Link css, js and images in custom wordpress theme

Incorporating CSS and JavaScript into your WordPress theme isn’t just about dropping links into your template files. WordPress provides a structured way to include these resources, ensuring they are loaded efficiently and without conflicts. Understanding the correct method to include CSS and JavaScript is crucial for any theme developer. Let’s explore the best practices for doing this the right way.

Path till theme directory

echo get_template_directory(); print = C:\xampp3\htdocs\wordpress/wp-content/themes/custom-theme
Path till theme directory

echo get_template_directory_uri();
print: http://localhost/wordpress/wp-content/themes/custom-theme
Path till theme directory (For links theme files)

bloginfo('template_directory');
print: http://localhost/wordpress/wp-content/themes/custom-theme
OR
get_theme_file_path()
link css, js & images

<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/style.css">

Leave a Reply