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:

给我们留言

嘿,你好!我是你的外贸营销伙伴,经验丰富的老手Sandy,已在这个领域打拼了整整十年!我做过的产品很多很杂,有促销礼品、餐具、光模块,WEB3.0等。如果你正在寻找一位经验丰富、充满激情、真诚可靠的合作伙伴,那么我就是你需要的人。让我们携手并肩,共同开拓更广阔的市场,创造更加美好的未来!

Contact Information

Copyright © 亚格美(Yageme)工作室 | 粤公网安备 34010302002247号 | 粤ICP备2024192089号