CODEWITHSUNDEEP
wordpresswordpress-theming
adipginting
adipginting

Reputation: 77

Loading a CSS file to a new theme in WordPress

I am making a new theme for WordPress using guide from this site https://www.taniarascia.com/developing-a-wordpress-theme-from-scratch.

The writer of tutorial the says that using <link href="" rel="stylesheet">

is not the most correct way to load scripts.

I am thinking to use wp_enqueue_style() and add_action() on function.php to load the .css file. I have already had three files, index.php, function.php, and style.css in my theme directory but I can't seem to make it work.

Below is the code I use to load the .css file:

<?php
  function enqueue_my_styles(){
  wp_enqueue_style('style', get_template_directory_uri().'/style.css');
 }

 add_action( 'wp_enqueue_scripts', 'enqueue_my_styles' );

?>

Upvotes: 1

Views: 945

Answers (1)

mrbubbles
mrbubbles

Reputation: 697

Is your functions file named functions.php or function.php? This should be functions.php and is fundamental.

Your code looks correct, but could actually be shortened a little as in the twentyfifteen Wordpress template;

function twentyfifteen_scripts() {
    // Load our main stylesheet.
    wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() );
}
add_action( 'wp_enqueue_scripts', 'twentyfifteen_scripts' );

You'd use get_template_directory_uri() for loading a custom file within the template directory.

function my_custom_styles() {        
    wp_enqueue_style( 'my-custom-style', get_template_directory_uri() . '/custom-style.css');
}
add_action( 'wp_enqueue_scripts', 'my_custom_styles' );

Upvotes: 1

Related Questions