如何在WordPress站点上使用这个jQuery脚本?

时间:2014-12-23 作者:user2059370

我一直在努力在wordpress网站上设置jquery列表文件。这是代码笔中的脚本和html:http://codepen.io/javve/pen/bBfgD

我的问题是。示例中有html,其中链接了脚本。我是否可以将html复制到自定义页面,或者是否需要在页眉/页脚中设置它们,或者为它们赋形?第二个问题是关于jquery的:

var monkeyList = new List(\'test-list\', {
valueNames: [\'name\'],
page: 5,
plugins: [ ListPagination({}) ] 
});
我该如何适应Wordpress?试图在标题的scripttags中设置它,但没有成功。

1 个回复
最合适的回答,由SO网友:Mohammad Mursaleen 整理而成

这很简单。

首先,您必须在主题函数中添加一个函数。php文件,使用wp_enqueue_scripts

// Register and enqueue all scripts in head
    function custom_scripts() {

        wp_register_script( \'script_googleapis\', \'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js\', false, false, false );
        wp_enqueue_script( \'script_googleapis\' );

        wp_register_script( \'script_listjs\', \'http://listjs.com/no-cdn/list.js\', false, false, false );
        wp_enqueue_script( \'script_listjs\' );

        wp_register_script( \'script_pagination\', \'http://listjs.com/no-cdn/list.pagination.js\', false, false, false );
        wp_enqueue_script( \'script_pagination\' );

    }

    // Hook into the \'wp_enqueue_scripts\' action
    add_action( \'wp_enqueue_scripts\', \'custom_scripts\' );  
然后,您可以使用调用函数在页脚中启动脚本wp_footer 吊钩如下:;

// Add this in function.php as well

    function call_script_in_footer(){
    ?>
    <script>
    var monkeyList = new List(\'test-list\', {
      valueNames: [\'name\'],
      page: 3,
      plugins: [ ListPagination({}) ] 
    });
    </script>
    <?php
    }

    add_action( \'wp_footer\', \'call_script_in_footer\' );
就这样。现在你可以在任何你想要的模板中使用HTML和CSS了。

结束