如何在woocommerce页面添加侧边栏

时间:2015-06-01 07:49:42

标签: wordpress woocommerce

我有一个wordpress网站,我正在使用woocommerce插件。我有一个产品页面,侧边栏显示在页面底部。如何编辑放置侧边栏的代码,使其显示主要内容区域左侧的侧边栏。不在主要内容区域下?

模板的代码是:

    <?php
        /**
         * woocommerce_before_main_content hook
         *
         * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
         * @hooked woocommerce_breadcrumb - 20
         */
        do_action( 'woocommerce_before_main_content' );
    ?>

        <?php if ( apply_filters( 'woocommerce_show_page_title', true ) ) : ?>

            <h1 class="page-title"><?php woocommerce_page_title(); ?></h1>

        <?php endif; ?>

        <?php do_action( 'woocommerce_archive_description' ); ?>

        <?php if ( have_posts() ) : ?>

            <?php
                /**
                 * woocommerce_before_shop_loop hook
                 *
                 * @hooked woocommerce_result_count - 20
                 * @hooked woocommerce_catalog_ordering - 30
                 */
                do_action( 'woocommerce_before_shop_loop' );
            ?>

            <?php woocommerce_product_loop_start(); ?>

                <?php woocommerce_product_subcategories(); ?>

                <?php while ( have_posts() ) : the_post(); ?>

                    <?php wc_get_template_part( 'content', 'product' ); ?>

                <?php endwhile; // end of the loop. ?>

            <?php woocommerce_product_loop_end(); ?>

            <?php
                /**
                 * woocommerce_after_shop_loop hook
                 *
                 * @hooked woocommerce_pagination - 10
                 */
                do_action( 'woocommerce_after_shop_loop' );
            ?>

        <?php elseif ( ! woocommerce_product_subcategories( array( 'before' => woocommerce_product_loop_start( false ), 'after' => woocommerce_product_loop_end( false ) ) ) ) : ?>

            <?php wc_get_template( 'loop/no-products-found.php' ); ?>

        <?php endif; ?>

    <?php
        /**
         * woocommerce_after_main_content hook
         *
         * @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
         */
        do_action( 'woocommerce_after_main_content' );
    ?>

    <?php
        /**
         * woocommerce_sidebar hook
         *
         * @hooked woocommerce_get_sidebar - 10
         */
        do_action( 'woocommerce_sidebar' );
    ?>

1 个答案:

答案 0 :(得分:4)

您需要编辑包装器以支持WooCommerce模板系统。这是通过两种方式之一完成的。

第一个是在主题目录中创建一个woocommerce.php文件(使用主题的侧边栏布局模板作为基础)。这将覆盖WooCommerce包装器系统和archive-product.php模板。它将为您提供更多控制,因为它将根据您的主题工作。您需要使用<?php woocommerce_content(); ?>替换模板中的循环。您可以在上面的示例中注释掉侧边栏,并使用主题的设置侧边栏位置和您的woocommerce侧边栏<?php do_action( 'woocommerce_sidebar' );?>。有关详细信息,请参阅http://docs.woothemes.com/document/third-party-custom-theme-compatibility/

另一个选项是编辑WooCommerce包装器来调整类,这样你的侧边栏就有足够的空间。 <?php do_action( 'woocommerce_after_main_content' );?>是包装器的结尾。这是在global > wrapper-start.phpglobal > wrapper-end.php下的WooCommerce模板系统中(确保将它们复制到各自文件夹中woocommerce文件夹下的主题目录)。