将引导模板转换为Wordpress时jQuery未加载

Question

jQuery文件将不会从引导模板加载。我正在把它转换成Wordpress的主题。我尝试了许多不同的方式在我的functions.php文件中对脚本进行排队。我试过取消jQuery的注册，但没有结果.

Chrome工具会产生404错误，并被归档以加载js文件。

<?php 
  function willow_rivers_files() {
    wp_enqueue_style('font-awesome', get_theme_file_uri('vendor/fontawesome-free/css/all.min.css'));
    wp_enqueue_style('bootstrap-files', get_theme_file_uri('vendor/bootstrap/css/bootstrap.min.css'));
    wp_enqueue_style('custom-style-from-template', get_theme_file_uri('css/grayscale.min.css'));
    wp_enqueue_style('custom-style', get_theme_file_uri('style.css'));
    wp_enqueue_style('google-font-round', '//fonts.googleapis.com/css?family=Varela+Round');
    wp_enqueue_style('google-fonts-nunito', '//fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i');  

    wp_enqueue_script('jquery', get_template_directory_uri('vendor/jquery/jquery.min.js'), NULL, '1.0', true);
    wp_enqueue_script('jquery-easing', get_template_directory_uri('vendor/jquery-easing/jquery.easing.min.js'), NULL, '1.0', true);
    wp_enqueue_script('jquery-easing', get_template_directory_uri('js/grayscale.min.js'), NULL, '1.0', true);
  }

  add_action('wp_enqueue_scripts', 'willow_rivers_files');
?>

Answer 1

WordPress有自己的jquery库，不需要单独包含它。

要从WP加载jquery，只需在JS enqueue的第三个参数中添加jquery库的依赖性即可。

请试如下：

删除

1. ：

wp_enqueue_script('jquery', get_template_directory_uri('vendor/jquery/jquery.min.js'), NULL, '1.0', true);

以下两行的

1. 将其从

中更改

wp_enqueue_script('jquery-easing', get_template_directory_uri('vendor/jquery-easing/jquery.easing.min.js'), NULL, '1.0', true); wp_enqueue_script('jquery-easing', get_template_directory_uri('js/grayscale.min.js'), NULL, '1.0', true);

至

wp_enqueue_script('jquery-easing', get_template_directory_uri(). '/vendor/jquery-easing/jquery.easing.min.js', array( 'jquery' ), '1.0', true); wp_enqueue_script('jquery-easing', get_template_directory_uri(). '/js/grayscale.min.js', array( 'jquery' ), '1.0', true);

请确保路径get_template directory_uri()将返回需要添加"/“前面的路径的其余部分的http://www.example.com/wp-content/themes/yourtheme。

希望这能帮到你！