"阅读更多”按钮通常在 WooCommerce 的产品列表或产品目录页面。它指向单个产品页面,点击后可以查看更多关于该产品的详细信息。但有时候,直接在当前页面提供完整的产品信息对用户体验更有利,在需要简化浏览流程时提高效率。
如果你希望隐藏“阅读更多”按钮,下面是几种实现的方法:
如何在 WooCommerce 中隐藏“阅读更多”按钮
方法一:使用 CSS 隐藏按钮
最简单的方法是通过添加CSS personnalisé 来隐藏“阅读更多”按钮。请按照以下步骤操作:
- 进入 WordPress 仪表盘Cliquez sur Apparence > Personnalisation.
![图片[1]-如何在 WooCommerce 中隐藏“阅读更多”按钮:三种简单方法优化产品页面](https://www.361sale.com/wp-content/uploads/2025/02/20250219190208662-image.png)
- 在自定义面板中,点击 CSS supplémentaire.
![图片[2]-如何在 WooCommerce 中隐藏“阅读更多”按钮:三种简单方法优化产品页面](https://www.361sale.com/wp-content/uploads/2025/02/20250219190359805-image.png)
- 在文本框中添加以下代码:
.woocommerce .products .button {
display: none !important;
}
- 保存更改并发布。
这段 CSS 代码会隐藏 WooCommerce 产品页面中的“阅读更多”按钮,仍保留其他按钮(例如“添加到购物车”)。
方法二:使用 PHP 代码自定义产品页面
如果你希望对产品页面进行更多的控制Vous pouvez le faire.添加 PHP 代码来定制 WooCommerce 的模板文件。通过覆盖主题的 content-product.php
文件,可以直接去除或修改“阅读更多”按钮的显示。
- 在 WordPress 安装目录下,找到当前使用的主题文件夹。
- 如果你的主题没有
woocommerce
文件夹,可以复制wp-content/plugins/woocommerce/templates
a fait mouchecontent-product.php
到你的主题文件夹中。
![图片[3]-如何在 WooCommerce 中隐藏“阅读更多”按钮:三种简单方法优化产品页面](https://www.361sale.com/wp-content/uploads/2025/02/20250219190707403-1739963212969.png)
- compilateur
content-product.php
文件,找到以下代码:
<code><?php woocommerce_template_loop_product_link_open(); ?><br></code>
- 在代码中supprimerpeut-être注释掉与“阅读更多”相关的部分。
- 保存文件并上传到你的主题文件夹。
这样你可以更灵活地控制产品页面的显示内容,去掉不需要的元素。
方法三:使用插件简化设置
au cas où不熟悉代码,可以使用专门的 WooCommerce 插件来定制产品页面。plug-in (composant logiciel)comme si Code Snippets 可以在不编辑代码的情况下来简化设置去除或修改"阅读更多”按钮的显示。
- 在 WordPress 仪表盘中,点击 Plugins > Installer des plugins.
- Recherche et installation Code Snippets Plug-ins.
![图片[4]-如何在 WooCommerce 中隐藏“阅读更多”按钮:三种简单方法优化产品页面](https://www.361sale.com/wp-content/uploads/2025/02/20250220110544667-image.png)
- 安装并启用插件后,在后台导航到 Snippets > Add New.
![图片[5]-如何在 WooCommerce 中隐藏“阅读更多”按钮:三种简单方法优化产品页面](https://www.361sale.com/wp-content/uploads/2025/02/20250220110900151-image.png)
- 在代码编辑框中输入你需要的代码。例如,如果你想去除 WooCommerce 产品页面上的“阅读更多”按钮,可以使用以下代码:
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_excerpt', 20 );
![图片[6]-如何在 WooCommerce 中隐藏“阅读更多”按钮:三种简单方法优化产品页面](https://www.361sale.com/wp-content/uploads/2025/02/20250220110950819-image.png)
résumés
在 WooCommerce 中隐藏“阅读更多”按钮,你可以通过添加CSS personnalisé 来隐藏按钮,使用 PHP 代码自定义模板文件以去除按钮,或者使用 Code Snippets
这样的插件来简化设置,这些方法都能帮助你更灵活地控制产品页面的内容显示。
Lien vers cet article :https://www.361sale.com/fr/32764L'article est protégé par le droit d'auteur et doit être reproduit avec mention.
Pas de commentaires