Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>To add your own css in the wp_head(), you need to use a collection of WordPress functions:</p> <p>First, you'll put this in your theme's functions.php file:</p> <p><code>add_action('wp_enqueue_scripts', 'your_function_name');</code></p> <p>(This uses the <a href="http://codex.wordpress.org/Function_Reference/add_action" rel="noreferrer">add action</a> hook, hooking into the <a href="http://codex.wordpress.org/Plugin_API/Action_Reference/wp_enqueue_scripts" rel="noreferrer">wp_enqueue_scripts</a> action.)</p> <p>Then, you'll need to add the function to your functions.php file that will utilize the WordPress function <a href="http://codex.wordpress.org/Function_Reference/wp_enqueue_style" rel="noreferrer">wp_enqueue_style</a>:</p> <pre><code>function your_function_name() { wp_enqueue_style('my-script-slug', get_stylesheet_directory_uri() . '/your_style.css'); } </code></pre> <p>Note the use of <a href="http://codex.wordpress.org/Function_Reference/get_stylesheet_directory_uri" rel="noreferrer">get_stylesheet_directory_uri()</a> - this gets the proper stylesheet directory for your theme.</p> <p>This is also the proper way to enqueue scripts into your header. Example:</p> <pre><code>function your_function_name() { // Enqueue the style wp_enqueue_style('my-script-slug', get_stylesheet_directory_uri() . '/your_style.css'); // Enqueue the script wp_enqueue_script('my-script-slug', get_stylesheet_directory_uri() . '/your_script.js'); } </code></pre> <p>Which uses the WordPress <a href="http://codex.wordpress.org/Function_Reference/wp_enqueue_script" rel="noreferrer">wp_enqueue_script</a> function.</p> <p>Finally, it is worth mentioning that altering the twenty thirteen (or any other core theme) theme directly is usually discouraged. The recommendation is to create a child theme (overkill in my opinion, but worth mentioning).</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload