跳至正文
帮助
编辑器设计与设置

我可以在店铺中添加自定义代码、脚本或 meta 标签吗(HTML、CSS、JavaScript、head 部分)?

在建站工具中可以添加您自己的 HTML、CSS 和 JavaScript 的位置(自定义代码版块、自定义 CSS、自定义 Javascript),为什么不能把代码粘贴到 head 部分,以及 Google Search Console 验证、Google Tag Manager 和像素应改用哪个应用。

阅读时间 3 分钟

简短回答

您可以在建站工具中的三个地方添加自己的代码:页面中的自定义代码版块、自定义 CSS设置和自定义 Javascript设置。店铺没有可以把代码粘贴到 head 部分的输入框。对于 head 标签,请使用相应的应用(见下面的列表)。

什么工作用什么工具

  • 用 Google Search Console 验证我的店铺,或添加 google-site-verification meta 标签:使用域名验证器应用。它还能处理 Facebook(Meta)、TikTok 和 Snapchat 的域名验证。
  • Google Analytics、Google Ads 标签,或您在 Google Tag Manager 中管理的任何标签:使用Google Tag Manager应用。
  • Facebook、TikTok、Snapchat、ChatGPT、Pinterest、X 或 Google Ads 像素:请参阅Facebook、TikTok、Snapchat、ChatGPT、Pinterest和X,或Google Ads 转化。
  • Google Merchant Center 产品 feed:请参阅Google Merchant Center。Search Console 请使用域名验证器。
  • 热图和会话录屏:请参阅Microsoft Clarity或Contentsquare。
  • 页面中的小组件或嵌入内容(预约表单、视频、地图):使用下文的自定义代码版块。
  • 整个店铺或单个版块的样式:请参阅自定义 CSS。
  • 每个页面都要运行的脚本:请参阅自定义 JavaScript。

为什么建站工具中的代码无法验证您的网站

Google、Meta 和其他平台在验证时,会在页面的 head 中查找它们的标签。自定义代码版块会把代码放在页面正文中该版块所在的位置。自定义 Javascript 在页面加载后才在顾客的浏览器中运行。两者都无法按照这些平台要求的方式把标签放进 head,所以验证会失败。域名验证器会替您把标签放在正确的位置。

自定义代码版块

这是一个可以添加到任何页面的版块,每页最多 2 个。打开版块标签,点击添加新版块,然后选择自定义代码。它有三个字段:

  • HTML:显示在此版块中的标记。
  • CSS:只作用于此版块的样式,所以不会破坏页面的其余部分。
  • JavaScript:每次显示该版块时运行。您的代码会以 container 的形式接收该版块,所以请使用 container.querySelector(...) 来访问您自己的标记。

您还可以像设置其他版块一样设置它的宽度、配色方案和内边距。使用应用到所有页面,即可把它复制到已有自定义代码版块的其他页面。

技巧

  • 先在建站工具的预览中检查代码,然后发布,并在手机和电脑上测试线上店铺。
  • 如果更改后页面看起来坏了,请删除代码并发布,然后一部分一部分地加回去。
  • 第三方脚本可能会拖慢店铺。只添加您需要的内容。
  • 连接到您店铺的 AI 助手只有在店主允许时才能修改自定义代码。请参阅管理助手访问权限。

仍需帮助?

给我们留言,我们会回复你。

联系我们