【问题标题】:How to add a div in between product listing in WooCommerce?如何在 WooCommerce 的产品列表之间添加 div?
【发布时间】:2017-06-25 14:20:54
【问题描述】:

在我的分类页面 WooCommerce 中有 20 种产品在列表中显示。

我想将产品列表增加到 40 个,并在 20 个产品后添加一个 div 用于添加。

谁能帮忙。

这是我的 archive-product.php 代码

<?php

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly
}

get_header( 'shop' ); ?>

<?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', false ) ) : ?>

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

    <?php endif; ?>

    <?php
        /**
         * woocommerce_archive_description hook.
         *
         * @hooked woocommerce_taxonomy_archive_description - 10
         * @hooked woocommerce_product_archive_description - 10
         */
        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' );
        ?>


        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
       <div class="content-box">
       <?php woocommerce_product_loop_start(); ?>

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

            ?>
                <?php if ( is_search() ) { ?>
                    <?php wc_get_template_part( 'content', 'search' ); ?>
                <?php }else{ ?>
                <?php wc_get_template_part( 'content', 'product' ); 
            }



                ?>


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

            ?>

            <?php woocommerce_product_loop_end(); ?>

       </div></div>


        <?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' );
?>

这是我的 content-product.php 代码

<?php
/**
 * The template for displaying product content within loops
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/content-product.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see     https://docs.woocommerce.com/document/template-structure/
 * @author  WooThemes
 * @package WooCommerce/Templates
 * @version 2.6.1
 */

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly
}

global $product;

// Ensure visibility
if ( empty( $product ) || ! $product->is_visible() ) {
    return;
}
?>

<?php
/**
 * woocommerce_before_shop_loop_item hook.
 *
 * @hooked woocommerce_template_loop_product_link_open - 10
 */
do_action( 'woocommerce_before_shop_loop_item' );

/**
 * woocommerce_before_shop_loop_item_title hook.
 *
 * @hooked woocommerce_show_product_loop_sale_flash - 10
 * @hooked woocommerce_template_loop_product_thumbnail - 10
 */
do_action( 'woocommerce_before_shop_loop_item_title' );

/**
 * woocommerce_shop_loop_item_title hook.
 *
 * @hooked woocommerce_template_loop_product_title - 10
 */
//do_action( 'woocommerce_shop_loop_item_title' );?>

<tr <?php post_class(); ?>>
    <td class="slno">
    </td>
<td><?php do_action( 'woocommerce_shop_loop_item_title' ); ?></td>
<td class="des">
    <?php do_action( 'woocommerce_after_shop_loop_item' ); ?>
?>

【问题讨论】:

    标签: php wordpress woocommerce


    【解决方案1】:

    在你的主题的function.php或你的自定义插件中添加这个以增加每页的产品:

    add_filter('loop_shop_per_page', create_function('$cols', 'return 40;'), 20);
    

    这里是“\wp-content\plugins\woocommerce\templates\archive-product.php”的示例,如果您编辑直接核心,或者如果您通过将templates 目录复制到当前主题目录来覆盖它路径将是“\mytheme\woocommerce\archive-product.php”

    请检查archive-product.php 的内容正好在while ( have_posts() ) : the_post(); 的上方和下方

    <?php
    /**
     * The Template for displaying product archives, including the main shop page which is a post type archive
     *
     * This template can be overridden by copying it to yourtheme/woocommerce/archive-product.php.
     *
     * HOWEVER, on occasion WooCommerce will need to update template files and you
     * (the theme developer) will need to copy the new files to your theme to
     * maintain compatibility. We try to do this as little as possible, but it does
     * happen. When this occurs the version of the template file will be bumped and
     * the readme will list any important changes.
     *
     * @see         https://docs.woocommerce.com/document/template-structure/
     * @author      WooThemes
     * @package     WooCommerce/Templates
     * @version     2.0.0
     */
    
    if ( ! defined( 'ABSPATH' ) ) {
        exit; // Exit if accessed directly
    }
    
    get_header( 'shop' ); ?>
    <?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
            /**
             * woocommerce_archive_description hook.
             *
             * @hooked woocommerce_taxonomy_archive_description - 10
             * @hooked woocommerce_product_archive_description - 10
             */
            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 $productIndex = 0; $addDivAt = 20 ?>
                <?php while ( have_posts() ) : the_post(); ?>
    
                    <?php wc_get_template_part( 'content', 'product' ); ?>
                        <?php $productIndex++; ?>
                        <?php if($productIndex == $addDivAt): ?>
                        <div>TRUE</div>
                        <?php endif; ?>
    
                <?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' );
    ?>
    

    【讨论】:

    • 如何在第 20 个产品之后插入包含内容的 div?你能帮忙吗@gvgvgvijayan
    • @Lipsa 请在while ( have_posts() ) : the_post();上方和下方检查archive-product.php的内容
    • 我只是想知道我在 archive-product.php 中所做的任何更改都没有反映在前端......但是产品列表在那里......
    • 这是您唯一需要做的更改,在某些索引产品之间添加 div 无需更改,请检查您的代码。 &lt;?php $productIndex = 0; $addDivAt = 20 ?&gt; &lt;?php while ( have_posts() ) : the_post(); ?&gt; &lt;?php wc_get_template_part( 'content', 'product' ); ?&gt; &lt;?php $productIndex++; ?&gt; &lt;?php if($productIndex == $addDivAt): ?&gt; &lt;div&gt;TRUE&lt;/div&gt; &lt;?php endif; ?&gt;
    • 我正在编辑 mytheme/woocommerce/archive-product.php ...但没有任何反应
    猜你喜欢
    • 2018-05-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-12-10
    • 2020-06-18
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多