Question

我想在某些woocommerce产品上添加带有自定义链接的按钮。

我通过添加以下代码部分解决了该问题：

 jQuery(function($) {
   $('.woocommerce .product_meta ').after ('<a class="button" href="http://www.ekosport.fr/N1-GL3357-community-touring-club.html">Acheter sur Ekosport</a>');
 });

但是我想添加一个条件：该按钮应该在产品类别“纺织品CTC”上隐藏

以下是产品的示例： https://communitytouringclub.com/produit/t-shirt-ctc/

感谢您的帮助

PS：jquery代码暂时未激活

Answer 1

您可以在选择的.product_meta上使用jQuery filter来检查子.posted_in > a的文本内容是否与诸如"Textile CTC"之类的字符串匹配。

然后仅将after的按钮标记插入到过滤的选择中。

const matchText = "Textile CTC";

$(function() {
  $(".product_meta")
    .filter(function() {
      return (
        $(this).find(".posted_in > a").text() === matchText
      );
    })
    .after(
      '<a class="button" href="http://www.ekosport.fr/N1-GL3357-community-touring-club.html">Acheter sur Ekosport</a>'
    );
});

.button {
  background: blue;
  color: white;
  margin: 10px;
  padding: 10px;
  display: inline-block;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="product_meta">
  <span class="sku_wrapper">UGS&nbsp;: 2018-men-CTC-t-shirt-1</span>
  <span class="posted_in">Catégorie&nbsp;:
      <a href="https://communitytouringclub.com/categorie-produit/textile-ctc/" rel="tag">Textile CTC</a>
    </span>
</div>
<div class="product_meta">
  <span class="sku_wrapper">UGS&nbsp;: 2018-men-CTC-t-shirt-1</span>
  <span class="posted_in">Catégorie&nbsp;:
      <a href="https://communitytouringclub.com/categorie-produit/textile-ctc/" rel="tag">Somthing else</a>
    </span>
</div>

如何在某些woocomerce产品上添加按钮

1 个答案: