如何在WooCommerce中自定义产品页面

Question

我创建了一个与店面搭配使用的子主题，并且正在努力定制各个产品页面的布局。

在single-product.php下，我期望看到可以操纵的html标记，但实际上声明的是：

wc_get_template_part( 'content', 'single-product' );

无法访问实际代码...

类似地，我需要使用搜索栏将代码添加到单个产品搜索结果中。但是在search.php中声明了以下内容：

get_template_part( 'loop' );

再次，迫使我尽量使用JS和CSS来操纵外观。

Answer 1

请查看get_template_part()函数：https://developer.wordpress.org/reference/functions/get_template_part/和woocommerce模板结构：https://docs.woocommerce.com/document/template-structure/

---

使用woocommerce，您可以以安全更新的方式编辑模板文件：

1. 在主题文件夹（wp-content / themes / yourtheme）中，创建一个名为woocommerce的空文件夹。
2. 转到woocommerce插件中的模板目录（wp-content / plugins / woocommerce / templates）并复制名为content-single-product.php的文件。
3. 将文件粘贴到主题文件夹中刚刚创建的名为woocommerce的文件夹中。
4. 即使woocommerce插件已更新，您现在也可以进行调整并保留它们。

---

在search.php文件中，您正在加载名为loop.php的文件，该文件应该位于主题文件夹（wp-content / themes / yourtheme）中。编辑此文件以进行更改。主题中可能有一个名为template-parts或类似的子文件夹，具体取决于您使用的主题。