[TITLE]
网站编辑器中区块可见性设置指南
[DESCRIPTION]
本文详细说明在网站编辑器里如何依据设备类型、访客所在国家、网站语言、UTM 参数及登录状态等条件,对区块及其内部元素进行显示或隐藏的操作步骤,并提供可视化预览和实际示例,帮助快速实现精准的内容展示。
[KEYWORDS]
网站编辑器, 区块可见性, 设备类型, 国家定位, UTM 参数, 登录状态, 条件显示, 隐藏元素, 可视化预览, 多语言
[TRANSLATED_CONTENT]
可见性
您可以根据访客的以下属性选择显示或隐藏区块:
- 设备类型(移动端或电脑端),
- 国家(基于 IP 的地理位置),
- 网站语言,
UTM 参数 <../reporting/link_tracker>,以及- 登录状态。
移动端/电脑端 {#website/visibility/mobile-and-computer}
要根据访客的设备类型切换区块的可见性:
- 打开网站编辑器并选中一个区块。
- 在
自定义选项卡中,区块的自定义选项下,找到可见性。- 点击
<svg viewBox="0 0 465 462" xmlns="http://www.w3.org/2000/svg" width="18" height="18"><path d="M456.969 9.84743L454.026 6.90425C444.956 -2.16512 429.098 -1.01124 418.605 9.48152L10.8984 417.188C0.405681 427.681 -0.748186 443.539 8.32118 452.609L11.2644 455.552C20.3337 464.621 36.1919 463.467 46.6847 452.975L454.392 45.2678C464.884 34.775 466.038 18.9168 456.969 9.84743Z"></path><path d="M346.673 26.269H39.1908C17.8303 26.269 0.5 43.6036 0.5 64.9695V322.973C0.5 336.409 7.35309 348.251 17.752 355.19L114.47 258.472H62.9696C56.9597 258.472 52.0878 253.601 52.0878 247.591V88.7515C52.0878 82.7417 56.9597 77.8697 62.9696 77.8697H295.072L346.673 26.269Z"></path><path d="M296.331 258.472H402.32C408.33 258.472 413.202 253.601 413.202 247.591V141.602L464.79 90.0139V322.973C464.79 344.339 447.46 361.674 426.099 361.674H271.336L284.233 400.375H342.269C352.949 400.375 361.614 409.042 361.614 419.725C361.614 430.408 352.949 439.075 342.269 439.075H123.021C120.837 439.075 118.734 438.708 116.771 438.033L154.429 400.375H181.057L193.954 361.674H193.13L226.244 328.56C228.268 329.181 230.417 329.516 232.645 329.516C244.665 329.516 254.409 319.772 254.409 307.753C254.409 305.525 254.074 303.376 253.452 301.352L296.331 258.472Z"></path></svg>{=html}
(在桌面端显示/隐藏)按钮,以在电脑访问时隐藏该区块。 - 点击
<svg viewBox="0 0 566.93 566.93" xmlns="http://www.w3.org/2000/svg" width="18" height="18"><rect transform="translate(283.46 -117.41) rotate(45)" x="255.56" y="-16.93" width="55.81" height="600.8" rx="25.61"></rect><path d="m395.46 399.46a12 12 0 0 1-12 12h-128.4l-115.68 115.69a47.8 47.8 0 0 0 32.08 12.31h224a48 48 0 0 0 48-48v-268.4l-48 48zm-112 108a32 32 0 1 1 32-32 32 32 0 0 1-32 32z"></path><path d="m171.46 87.46a12 12 0 0 1 12-12h200a11.89 11.89 0 0 1 6.48 1.93l37.61-37.61a47.82 47.82 0 0 0-32.09-12.32h-224a48 48 0 0 0-48 48v268.41l48-48z"></path></svg>{=html}
(在移动端显示/隐藏)按钮,以在移动设备访问时隐藏该区块。
- 点击
- 点击
保存以应用更改。
有时也可以隐藏区块内部的元素,常用于隐藏在移动端宽度不足以正确显示的特定元素。若要查看是否支持此选项,选中区块内部的元素,并在该元素的自定义选项下寻找 可见性。
::: example
选中的图片在移动设备上被隐藏。
:::
条件 {#website/visibility/conditions}
要使用国家、网站语言、UTM 参数和登录状态等条件:
打开网站编辑器并选中一个区块。
在
自定义选项卡中,寻找可见性。点击
无条件并改为条件显示,即可看到以下选项:国家:访客 IP 所在的国家。语言:访客使用的站点语言。:::: note
::: title
注意
:::仅当安装了超过一种语言时此选项才可用
<../configuration/translate>。
:::UTM Campaign:所选的活动名称。UTM Medium:所选的活动媒介。UTM Source:所选的活动来源。用户:选择访客是已登录还是未登录才能查看区块。默认设置为对所有人可见。
对前五个选项中的任意一个或多个,选择
对 … 可见或对 … 隐藏,然后点击选择记录…并选中对应记录。
:::: tip
::: title
提示
:::
- 可多次点击
选择记录…为同一选项添加多个记录。 - 点击
fa-minus(移除)按钮可删除已选的记录。
::::
点击 保存 以应用更改。
::: example
下面的区块配置仅对 IP 属于比利时、站点语言为法语且通过 [Sales] 活动追踪链接访问的访客显示。
:::
隐形元素 {#website/visibility/invisible-elements}
带有自定义可见性设置的区块和元素会在网站编辑器侧边栏底部列出。您可以点击 fa-eye(可见)按钮来隐藏区块或元素,或点击 fa-eye-slash(隐藏)按钮在编辑器中显示它们,以预览页面实际效果。
[SUMMARY]
可见性
设备类型显示/隐藏
- 选中区块 → 自定义 → 可见性
- 桌面显示/隐藏按钮
- 移动显示/隐藏按钮
- 保存
区块内部元素隐藏
- 选中元素 → 可见性选项
- 适用于宽度限制的移动端
条件显示设置
- 选中区块 → 自定义 → 可见性 → 条件显示
- 可选条件:国家、语言、UTM Campaign、UTM Medium、UTM Source、用户登录状态
- 设置“对…可见”或“对…隐藏”,并选择记录
- 多记录选择、移除操作
- 保存
隐形元素预览
- 编辑器侧边栏底部列出自定义可见性元素
- 使用眼睛图标切换显示/隐藏以预览页面外观