Question

我正在尝试在二十世纪的儿童主题中为我的woocommerce商店页面添加砖石。这也是我网站的首页。我是PHP和Wordpress的新手。

第一步是创建一个从http://masonry.desandro.com/加载masonry.pkgd.min.js文件的函数

这是功能：

function twentytwelve_child_masonry() {
if (! is_admin()) {
    wp_register_script('jquery_masonry', get_stylesheet_directory_uri(). 'js/masonry.pkgd.min.js' ,array(jquery), 3.2 );
    wp_enque_script('jquery_masonry');
    add_action('wp_footer', 'twentytwelve_child_add_masonry');        
    function twentytwelve_child_add_masonry() { ?>
        <script> 
            jQuery(document).ready(function($) {
                $('#content').masonry({
                    itemSelector: '.products',
            isAnimated: true;
                }); });
        </script>
    <?php
  }}}
add_action('init', 'twentytwelve_child_masonry');

我在Lynda.com的教程中找到了关于构建响应主题的内容。当我尝试加载页面时，网站崩溃了。有人有什么想法？非常感谢帮助。

Answer 1

您需要修复一些语法错误，停止嵌套函数，正确使用wp_enqueue_script，并在适当的时候将脚本排入队列。您不能（或不应该）使用init操作将它们排队。相反，你真的应该简化以下内容：

function twentytwelve_child_masonry() {
    wp_enqueue_script( 'jquery_masonry', get_stylesheet_directory_uri() . '/js/masonry.pkgd.min.js', array('jquery'), '3.2', true );
}
add_action('wp_enqueue_scripts', 'twentytwelve_child_masonry');

然后，将以下内容添加到 footer.php ：

<script> 
    jQuery(document).ready(function($) {
        $('#content').masonry({
            itemSelector: '.products',
            isAnimated: true;
        }); 
    });
</script>

然而，如上所述，Masonry附带WordPress ......所以这仍然可能使事情变得复杂。

将Masonry添加到WooCommerce后网站中断

1 个答案: