如何在 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 或类似名称的子文件夹，具体取决于您使用的主题。