wpveda book

  Edit This Page

WordPress CSS

WordPress inbuilt CSS classes

WordPress Default CSS Styles

WordPress CSS: Understanding the Native Classes

WordPress admin pages style guide

Creating Admin Themes

Theme post-editor style

add_editor_style( $stylesheet );

$stylesheet

(string/array) (optional) Path to a stylesheet file, relative to the current theme directory, or an array thereof to link multiple stylesheet files. Default: "editor-style.css"

Example

function my_theme_add_editor_styles() {
    add_editor_style( '/path-to-css/editor-style.css' );
}

add_action( 'admin_init', 'my_theme_add_editor_styles' );

For more details : https://codex.wordpress.org/Function_Reference/add_editor_style

WordPress style and script

Register and enqueue Style
  1. Register Style
  2. Enqueue Style
Register and enqueue Script
  1. Register Script
  2. Enqueue Script

Example

/**
 * Proper way to enqueue scripts and styles
 */
function theme_name_scripts() {
    wp_enqueue_style( 'style-name', get_stylesheet_uri() );
    wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );
}

add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );