0

我正在构建我的第一个 Wordpress 主题，并且正在尝试实现一些插件。我是一个绝对的初学者，所以请原谅我对它完全缺乏知识！

据我所知，您需要在 functions.php 文件中将脚本排入队列以使 JQuery 工作。我已经这样做了，但是通过遵循一系列不同的教程/在我导师的建议下。似乎它仍然无法正常工作，我不知道从这里做什么！

我敢肯定，对于受过训练的眼睛，我哪里出错了，这将是非常明显的，这很好，因为这正是我所需要的！:)

这是我的functions.php文件中的代码：

            <?php

            function my_init() {
                if (!is_admin()) {

                wp_register_script('jquery', get_template_directory_uri() . '/js/jquery-1.11.0.min.js', false, '1.11.0', true);
                wp_enqueue_script('jquery');

                wp_register_script('scrollup', get_template_directory_uri() . '/scrollup-master/js/jquery.scrollUp.min.js', array('jquery', 'jquery-ui-core'), '1.11.0', true );

                wp_enqueue_script('jquery.scrollUp');

                wp_register_script('slicknav', get_template_directory_uri() . '/js/jquery.slicknav.min.js', array('jquery', 'jquery-ui-core'), '1.11.0', true );

                wp_enqueue_script('slicknav');
                }
            }
            add_action('init', 'my_init');

            // Add action to load scripts enqued in load_scripts() function
            add_action('admin_enqueue_scripts', 'load_scripts');


            ?>

这是我放入 footer.php 文件的脚本：

            <script>
              $.scrollUp({
                scrollName: 'scrollUp', // Element ID
                topDistance: '300', // Distance from top before showing element (px)
                topSpeed: 300, // Speed back to top (ms)
                animation: 'fade', // Fade, slide, none
                animationInSpeed: 200, // Animation in speed (ms)
                animationOutSpeed: 200, // Animation out speed (ms)
                scrollText: 'Scroll to top', // Text for element
                activeOverlay: false, // Set CSS color to display scrollUp active point, e.g '#00FFFF'
              });
            });
            </script>

            <script>
                $(function(){
                    $('#menu').slicknav();
                });
            </script>

任何帮助将不胜感激！谢谢！

4

3 回答 3

1

你永远不应该注册你自己的 jquery 版本，它包含在 wordpress 核心中。

请阅读并理解wp_enqueue_script的 codex 页面。

您应该只注册不在核心中的脚本，并使用依赖参数wp_enqueue_script来确保 jquery 可用。

您的代码没有多大意义，脚本应该排队wp_enqueue_scripts而不是init，我不确定您为什么包含管理挂钩？

function yasmin_enqueue_scripts()
{
     wp_enqueue_script( /* ... */ );

     //...
}
add_action( 'wp_enqueue_scripts', 'yasmin_enqueue_scripts' );

您的 javascript 不应该放在 footer.php 中，它应该在一个单独的文件中并以wp_enqueue_script. 它还应该被包装在一个非冲突包装器中（自执行函数）

(function($){
    // all jquery code goes in here
})(jQuery);
于 2014-04-30T14:03:43.143 回答
0

要加载 jquery 或其他 js 文件，您可以通过这种方式编辑函数

       <?php

        function my_init() {

            wp_register_script('jquery', get_template_directory_uri() . '/js/jquery-1.11.0.min.js', false, '1.11.0', true);
            wp_enqueue_script('jquery');

            wp_register_script('scrollup', get_template_directory_uri() . '/scrollup-master/js/jquery.scrollUp.min.js', array('jquery', 'jquery-ui-core'), '1.11.0', true );

            wp_enqueue_script('jquery.scrollUp');

            wp_register_script('slicknav', get_template_directory_uri() . '/js/jquery.slicknav.min.js', array('jquery', 'jquery-ui-core'), '1.11.0', true );

            wp_enqueue_script('slicknav');

        }
       if (!is_admin()){
       add_action( 'wp_enqueue_script', 'my_init' );
      }


        ?>
于 2014-04-30T13:34:34.340 回答
0

最近，Wordpress 为jQuery 提供了 noConflict Wrapper。

尝试使用如下代码jQuery：

<script>
  (function($) {
    $.scrollUp({
      scrollName: 'scrollUp', // Element ID
      topDistance: '300', // Distance from top before showing element (px)
      topSpeed: 300, // Speed back to top (ms)
      animation: 'fade', // Fade, slide, none
      animationInSpeed: 200, // Animation in speed (ms)
      animationOutSpeed: 200, // Animation out speed (ms)
      scrollText: 'Scroll to top', // Text for element
      activeOverlay: false, // Set CSS color to display scrollUp active point, e.g '#00FFFF'
    });
  })(jQuery);
</script>
于 2014-04-30T13:44:05.490 回答