我只是告诉大家完全隐藏区块元素的正确做法,大多数情况下,我们并不需要这样做,除非你要隐藏的区块有很多。
易懂的解释就是,HTML 是内容,CSS 是给内容的装饰样式。通常工具(比如视频里的三个)里带的隐藏都是直接加CSS代码 display none 的,显示条件的隐藏是直接在生成的HTML代码里应用指定的显示/隐藏规则。你可以理解为,一个是单纯在样式上隐藏,一个是直接从根部上隐藏。
使用自带设置隐藏区块
大多数建站工具都是自带隐藏功能的,刚刚上面也说了,他们只是单纯的在前端隐藏了而已,代码还在。视频里我们可以很明显的看到。
使用显示规则正确隐藏区块元素
1. 古腾堡条件规则隐藏区块
首先我们要知道,古腾堡本身是没有条件规则(Display conditions)这个功能的,我们需要借助第三方插件来完成。我这使用的是Spectra
下载开启之后我们要去到Spectra的设置 > Blocks / Extensions > 找到 Display conditions 开启它。
之后我们只需要去到古腾堡界面点击想要隐藏的元素区块,在侧边栏的高级找到 Display conditions 就可以了。
2. Elementor 显示条件隐藏元素
Elementor 在它的 3.19 版本已经出了显示条件功能,可以不用借助其他插件。如果你觉得有点限制,可以使用视频里我用到的 Dynamic Visibility for Elementor,它的条件规则非常多,你可以根据自己的需求调整。
3. Bricks builder 显示条件隐藏区块
Bricks builder 自带显示条件规则。