【发布时间】：2017-06-29 22:52:59
【问题描述】：
出于造型目的，我正在尝试在 Woocommerce 面包屑中添加指向产品名称的链接。由于它没有链接，并且我正在尝试为面包屑中的所有“a”标签添加样式，因此它的显示方式有所不同，如下图所示：
我只需要它有一个链接，即使是 'href="#"'。我可以在哪里以及如何添加此链接？
【问题讨论】：
标签： wordpress woocommerce breadcrumbs
【发布时间】：2017-06-29 22:52:59
【问题描述】：
您能否发布您的代码，以便我们更好地了解您的情况？
编辑：根据您给定的代码。您可以将产品名称放在一个 div 中并给它一个自定义 id，然后使用 css 将其设为大写。
<head>
<style>
#product {
display: inline;
text-transform:uppercase;
}
</style>
</head>
<body>
<nav class="woocommerce-breadcrumb" itemprop="breadcrumb">
<a href="manolitas.com/site">Collections</a> >
<a href="manolitas.com/site/product-category/around-the-world/… the World">Category</a>
><div id = "product"> Ines </div>>
<a href="#" class="wbsectitle3">Shop</a>
</nav>
<script src="javascriptfilepath/javascriptfilename.js">
</script>
</body>
然后你可以用javascript添加一个click事件来添加一个div元素的链接。 JAVASCRIPT
var product = document.getElementById("product");
product.onclick = function(){
window.location.href = "http://www.whereveryouwannago.com";
};
【讨论】：
-
我只是在 Wordpress 中安装了 Woocommerce，它就是这样来的。唯一的代码是自定义 CSS，为面包屑中的链接提供所需的样式（额外的填充、颜色和文本转换）： .woocommerce .woocommerce-breadcrumb a { color: #777;填充：25px；文本转换：大写； }
-
您可以为产品链接添加一个唯一的 id，然后使用 css 设置该唯一的 id。
<a href="#" id="product">Product</a> #product { padding: 25px; text-transform:uppercase;} -
问题是产品名称上没有链接。这是面包屑的源代码（产品名称是“Ines”）：
-
我只需要它有一个链接，即使是'href="#"'。我可以在哪里以及如何添加此链接？
-
我已经用代码更新了我的答案，以在面包屑中添加指向产品名称的链接并使文本大写