I converted a html,css,js template to a wordpress theme. To enqueue my css it worked correctly, i just add the function in functions.php but to enqueue javascript it doesn't work i tryed a lot of modifications but nothing works Here is my function.php
<?php function load_stylesheets() { wp_register_style('normal',get_template_directory_uri() . '/css/normalize.css', array(), 1, 'all'); wp_enqueue_style('normal'); wp_register_style('demonstration',get_template_directory_uri() . '/css/demo.css', array(), 1, 'all'); wp_enqueue_style('demonstration'); } add_action('wp_enqueue_scripts','load_stylesheets'); function addjs() { wp_register_script('anime', get_template_directory_uri() . '/js/anime.min.js', array(), 1,1, 1); wp_enqueue_script('anime'); wp_register_script('imagesload', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array(), 1,1, 1); wp_enqueue_script('imagesload'); wp_register_script('main', get_template_directory_uri() . '/js/main.js', array(), 1,1, 1); wp_enqueue_script('main'); }
Please Try this
add_action('wp_footer','addjs');
function addjs() {
wp_register_script('anime', get_template_directory_uri() . '/js/anime.min.js', array ('jquery'),'',true);
wp_register_script('imagesload', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array ('jquery'),'',true);
wp_register_script('main', get_template_directory_uri() . '/js/main.js', array ('jquery'),'',true);
}
The short-and-sweet of it is that you're not calling your addjs
function anywhere. If you added:
add_action( 'wp_enqueue_scripts', 'addjs' );
Then it should work. ( Note: anyone that the above doesn't work for, look at the edit below )
However, there's a couple things you should note:
Make sure your indenting/spacing is consistent, and you don't have extraneous whitespace after lines. Clean code is key!
You don't need to add JS and CSS files separately, they can both be handled in the same add_action
function callback.
Unless you're doing some really fancy stuff (enqueueing only while a shortcode is found on a page, etc.), wp_enqueue_{script/style}
will take care of the wp_register_{script/style}
function for you. In most cases you can use enqueue
them instead of registering and then enqueueing them.
Take a look at the documentation and make sure your arguments are the same as the ones the function accepts. It will prevent warnings and errors in more extreme cases.
Here's a cleaned up example for you:
add_action( 'wp_enqueue_scripts', 'enqueue_theme_assets' );
function enqueue_theme_assets(){
// Styles
wp_enqueue_style( 'normal', get_template_directory_uri() . '/css/normalize.css', array(), '1.0' );
wp_enqueue_style( 'demonstration', get_template_directory_uri() . '/css/demo.css', array(), '1.0');
// Scripts
wp_enqueue_script( 'anime', get_template_directory_uri() . '/js/anime.min.js', array(), '1.0', true );
wp_enqueue_script( 'imagesload', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array(),'1.0', true );
wp_enqueue_script( 'main', get_template_directory_uri() . '/js/main.js', array(), '1.0', true );
}
I just saw your comment that add_action( 'wp_enqueue_scripts', 'addjs' );
wasn't working. Take a look at the wp_enqueue_script()
docs. You'll note in the #Usage section, that it properly enqueuing scripts on the wp_enqueue_scripts
hook relies on the wp_footer()
and wp_head()
functions being utilized in your theme, so **make sure you have wp_footer();
called in your theme, especially since you have the $in_footer
argument set to true
.
wp_enqueue_scripts is the proper hook to use when enqueuing scripts and styles that are meant to appear on the front end. Despite the name, it is used for enqueuing both scripts and styles.
So You have to add scripts and styles inside one function or you can add one more wordpress action with your existing code.
add_action( 'wp_enqueue_scripts', 'addjs' );
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.