我似乎一直在努力寻找这方面的示例/答案/资源。
我在/主题名/WooCommerce/存档产品中创建了一个自定义WooCommerce主页。php,其中我使用此代码段输出产品:
$display_count = 9;
$page = get_query_var( \'paged\' ) ? get_query_var( \'paged\' ) : 1;
$offset = ( $page - 1 ) * $display_count;
$args = array(
\'post_type\' => \'product\',
\'post_status\' => \'publish\',
\'posts_per_page\' => $display_count,
\'page\' => $page,
\'offset\' => $offset,
\'orderby\' => \'menu_order\',
\'order\' => \'ASC\'
); ?>
<div class="homepage-content">
<div class="product-list-contain">
<?php
$loop = new WP_Query( $args );
if ( $loop->have_posts() ) :
// do_action( \'woocommerce_before_shop_loop\' );
woocommerce_product_loop_start(); ?>
<div id="product-list">
<?php
while ( $loop->have_posts() ) :
$loop->the_post();
wc_get_template_part( \'content\', \'product\' );
endwhile;
?>
</div>
<?php
woocommerce_product_loop_end(); ?>
<?php
do_action( \'woocommerce_after_shop_loop\' ); ?>
<?php
else :
do_action( \'woocommerce_no_products_found\' );
endif; ?>
<?php
wp_reset_postdata(); ?>
</div>
</div>
输出为充满li的ul:
<li class="product type-product post-2048 status-publish first instock product_cat-uncategorized product_tag-aesthetic product_tag-hard product_tag-thermoconductive has-post-thumbnail shipping-taxable product-type-simple">
<a href="/example/" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">
<img width="300" height="300" src="/example.jpeg" class="attachment-woocommerce_thumbnail size-woocommerce_thumbnail" alt="diamond foil" srcset="example.jpeg 300w, example.jpeg 150w, example.jpeg 100w, example.jpeg 80w" sizes="(max-width: 300px) 100vw, 300px">
<h2 class="woocommerce-loop-product__title">Diamond</h2>
</a>
</li>
我在哪里可以修改这条线创建的这些li的布局:
wc_get_template_part( \'content\', \'product\' );
我已经创建了一个子主题文件夹WooCommerce,并对存档产品进行了更改。php在那里。
Where can amends to this part wc_get_template_part( \'content\', \'product\' ); of the WooCommerce product loop be made?
EDIT (回复评论后):我现在在内容产品中。php。但这只是有更多的WP操作,例如
do_action( \'woocommerce_shop_loop_item_title\' );
Now my question would be, where is this file edited - woocommerce_shop_loop_item_title?
感谢所有贡献者,Jason。
最合适的回答,由SO网友:Yashar 整理而成
如评论中所述,wc_get_template_part()
尝试查找并加载请求的模板文件
这些模板文件可以在/woocommerce/
子主题的子目录,或在另一个第三方插件中定义(借助woocommerce_locate_template
过滤器挂钩)。如果这些都不存在,WC将从加载默认模板文件/plugins/woocommerce/templates/
目录
更新的问题WoocCommerce使用WordPress插件API加载模板内容。这就是为什么有很多do_action()
模板文件中的函数。您可以(也可能应该)使用这些操作过滤器来操作内容。覆盖整个模板文件应该是最后的选择(根据最佳实践)
在这种情况下content-product.php
文件包含此行:
do_action( \'woocommerce_before_shop_loop_item_title\' );
所有模板的默认内容在中定义
/plugins/woocommerce/includes/wc-template-hooks.php
标题为:
add_action( \'woocommerce_shop_loop_item_title\', \'woocommerce_template_loop_product_title\', 10 );
在这种情况下,
woocommerce_template_loop_product_title
函数将HTML标记和内容添加到标题部分,并位于以下文件中:
/plugins/woocommerce/includes/wc-template-functions.php
function woocommerce_template_loop_product_title() {
echo \'<h2 class="\' . esc_attr( apply_filters( \'woocommerce_product_loop_title_classes\', \'woocommerce-loop-product__title\' ) ) . \'">\' . get_the_title() . \'</h2>\';
}
您可以使用乙醚
woocommerce_shop_loop_item_title
要在标题部分中添加额外的HTML标记,或删除默认内容并添加自己的HTML标记,请执行以下操作:
remove_action( \'woocommerce_shop_loop_item_title\', \'woocommerce_template_loop_product_title\', 10 );
add_action( \'woocommerce_shop_loop_item_title\', \'tst_your_function\', 10 );
function tst_your_function() {
echo \'<h3 class="\' . esc_attr( apply_filters( \'woocommerce_product_loop_title_classes\', \'woocommerce-loop-product__title\' ) ) . \'"><strong>\' . get_the_title() . \'</string></h3>\';
}