wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

背景概述:

我在用woo+Elementor Pro做产品详情页模板的时候,想要在页面中只展示属性表的数据,但是实际情况下,我在产品编辑中添加属性之后:

wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

在产品详情页的模板中,只能添加元素Product Data Tab来展示这个内容,并且会附带产品描述和reviews的tab标签:

wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

但是我并不希望出现这些tab标签,我只需要属性表展示出来,经过一番研究,我总结了如下方法。

安装插件WPC Product Tabs for WooCommerce

wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

设置删除Global Tabs的Description和reviews,并保存

wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

为Product Data Tab元素添加css代码

在产品详情页模板中,选择Product Data Tab元素,找到custom CSS

wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

添加如下CS

S代码:

.woocommerce div.product.elementor ul.tabs {
display: none;

}
.woocommerce .woocommerce-tabs h2
{
display: none;
}
.woocommerce div.product.elementor .woocommerce-tabs .panel {
border: 0px;
padding: 0px;
}

看下编辑状态效果

wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

保存,查看前端显示效果

wordpress建站如何使用Elmentor pro设置只显示产品的属性表?

整个过程只需要,安装一个插件取消默认tab就可以(插件还可以让你添加自定义的tab,如果结合Elementor 模板应该玩出更多花样),然后为元素添加css,不显示一些不必要的内容。

Share:

给我们留言

Luxury Real Estate

Lorem ipsum dolor sit amet, cons aring elit sed dllao the eimod tempor inciunt ullaco laboris aliquip alora tolfy alora tolda foucos dondy athlle shalom.

Contact Information

Copyright © 亚格美(深圳)科技有限公司 | 皖公网安备 34010302002247号 | 皖ICP备2021015631号