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

Question

我创建了一个与店面一起工作的子主题，并且正在努力自定义各个产品页面的布局。

在单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/ and the woocommerce template structure: 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 或类似名称的子文件夹。