根据我在woocommerce的经验,有两种方法。
1-为当前主题添加一些额外的css。
例如,我想修改产品的标题:
我打开chrome inspector,我看到产品页面有一个css类body.single-product
.
产品容器有一个css类div.product
(由woocommerce自己创建<div id = "product - <? php the_ID ();?>" <? php wc_product_class (\'\', $ product);? >>
).
因此,我可以应用自己的风格(例如,我的主题在h1
css类的标记product-title
)
所以我无法通过以下方式覆盖:
body.single.single-product div.product h1.product-title {
color: #13345f;
font-size: 1.5em;
font-weight: 800;
}
我的产品页面中的其他元素也是如此。
第二种方法,您可以创建自己的模板:your-theme/woocomerce /
, 和使用wc_get_template_part()
.
例如:我想创建自定义产品详细信息。
在我的主题中,我创建了文件夹woocomerce和一个名为single-produt.php
, 在同一级别中,一个名为content-single-product-custom.php
.
和内部single-produt.php
, 我称之为:wc_get_template_part( \'content\', \'single-product-custom\' );