在 Woocommerce 中更改添加到购物车按钮的样式答案

【问题标题】：Changing Style of Add to Cart Button in Woocommerce在 Woocommerce 中更改添加到购物车按钮的样式
【发布时间】：2021-11-23 19:42:15
【问题描述】：

我在 woocommerce 中使用带有自定义主页的店面主题，出于某种原因，添加到购物车按钮在主页和存档页面（搜索结果、类别等）上的显示方式不同。我猜是因为我使用自定义主页。在主页上，它通常显示为按钮，在商店页面或类别中，它显示为文本链接以及小篮子图标。我已经尝试了一切来解决这个问题，甚至使用了自定义添加到购物车按钮插件，但到目前为止没有任何效果。

有人能告诉我如何让添加到购物车在类别和搜索页面中显示为按钮吗？我会很感激的。下面是截图供大家参考。

首页 - https://imgur.com/a/FozNnaN 产品分类页面 - https://imgur.com/a/Uu0MmD4（需要修复这个）

【问题讨论】：

标签： php wordpress woocommerce

【解决方案1】：

这里没有神奇的答案。有数以千计的主题和插件都可以影响您添加到购物车的风格。按照下面的粗略大纲应用样式。

使用检查控制台。右键单击并检查按钮并记下应用于所需按钮的样式。

在另一个选项卡中打开包含您要更改的按钮的页面，检查按钮并构建一个充分针对按钮的规则。然后根据需要应用进行更改的样式。

一旦满意，复制整个样式规则并将其添加到您的主题 styles.css 或使用允许您添加 css 的插件 (https://wordpress.org/plugins/custom-css-js/)

【讨论】：

感谢您的回复。我尝试查看 css 并认为下面的代码正在改变添加到购物车按钮的样式。你能好心检查一下吗。 .add_to_cart, .button, button:not(.pswp__button), input[type=button], input[type=reset], input[type=submit], .woocommerce-active .site-header .site-header-cart .cart-contents { 边框半径：3px;文字阴影：0 1px 1px rgba(0, 0, 0, 0.3);字体粗细：900；字体家族：“拉托”，无衬线； box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.4), inset 0 1px rgba(255, 255, 255, 0.2), 0 1px 1px rgba(0, 0, 0, 0.3); }
@MayankG 不，我不能。我没有安装您的设置来验证您的样式。我只是提供了一种方法，告诉你如何自己应用你想要的样式。
谢谢我用你的把戏做到了。