GTM触发器应设置何种CSS选择器仅识别toggle折叠面板的打开点击

GTM触发器正确配置方案 #

你使用的是Divi主题内置的toggle组件，它的状态类逻辑为：关闭状态外层容器带et_pb_toggle_close类，打开后切换为et_pb_toggle_open类，可直接用该规则区分打开/关闭操作。

触发器配置步骤

1. 触发器类型选择「点击 - 所有元素」
2. 触发条件设置为「部分点击」
3. 匹配规则填写：点击元素 匹配CSS选择器，对应值为：

.3-buttons-row-class .et_pb_toggle.et_pb_toggle_close .et_pb_toggle_title

选择器逻辑说明

• .3-buttons-row-class 限定仅匹配你设置的三列toggle所在行的元素，不会误触发页面其他位置的toggle组件
• .et_pb_toggle.et_pb_toggle_close 限定仅当toggle处于关闭状态时点击才会命中，自动排除关闭toggle的点击操作
• .et_pb_toggle_title 匹配实际点击的toggle标题区域，和你提供的点击元素结构完全对应

配置完成后可通过GTM预览模式测试，点击关闭状态的toggle即可触发对应标签，点击已打开的toggle不会触发。

内容的提问来源于stack exchange，提问作者Bklaus_hh