写作干净的WooCommerce风格

时间:2017-05-04 作者:stucow88

因此,我正在建立我的第一个自定义WooCommerce商店,我发现我的styles类名变得过于冗长,或者就是这样。我使用Chrome中的inspector工具来获取类名。

下面是我目前正在使用的示例:

.woocommerce 
ul.products 
li.product a {
   ...
}

.woocommerce 
ul.products
li.product 
.price del {
   ...
}
这是建立定制商店的常规做法还是有更好的方法?

提前感谢

Stu:)

2 个回复
最合适的回答,由SO网友:Takebo 整理而成

我要做的是,根据我想要自定义的内容禁用Woocommerce默认样式,而不是覆盖css。

Woocommerce默认加载3种样式:Woocommerce general。CSSWoocomerce布局。csswoocommerce小屏幕。css

如果要完全自定义,可以通过添加以下内容禁用所有样式,或仅禁用不需要的样式:

// Remove each style one by one
add_filter( \'woocommerce_enqueue_styles\', \'jk_dequeue_styles\' );
function jk_dequeue_styles( $enqueue_styles ) {
    unset( $enqueue_styles[\'woocommerce-general\'] );    // Remove the gloss
    unset( $enqueue_styles[\'woocommerce-layout\'] );     // Remove the layout
    unset( $enqueue_styles[\'woocommerce-smallscreen\'] );    // Remove the smallscreen optimisation
    return $enqueue_styles;
}

// Or just remove them all in one line
add_filter( \'woocommerce_enqueue_styles\', \'__return_false\' );
查看Woocommerce文档了解更多详细信息Disable the default stylesheet

SO网友:Aniruddha Gawade

使用最大数量的课程始终是一个很好的做法,因为使用更多的课程会带来更多的体重年龄,并且它会始终考虑您的css 第一

但尽量不要使用divp 设置样式时标记price. 因为不同的产品类型使用不同的元素(例如简单用途p, 变量用途span). 所以它不会是所有价格标签的通用代码。

相关推荐

在带有PHP的子主题中包含style.css

在里面https://codex.wordpress.org/Child_Themes 这是包含样式的最佳实践。css在子主题中,必须将下面的代码放入函数中。php的子主题,但将“父样式”替换为可以在函数中找到的父主题的参数。父主题的php。我在我的主题文件中找不到它,那里也没有多少代码。使用@import包含父主题样式表的方法不适用于我,放入文件的css不会在任何浏览器的站点上显示自己。function my_theme_enqueue_styles() { $parent_s