主题编辑器

主题编辑器（theme editor）是一个让商家自定义店铺内容与外观、并实时预览 theme 变更的工具。

作为 theme 开发者，您可以通过引入设置，以及将 theme 功能拆分为模块化的 sections 和 blocks，让商家能够在主题编辑器中自定义自己的 theme。

在主题编辑器的预览中，商家应当看到 theme 上线后店铺前台将完全一致的呈现效果。

通过主题编辑器支持自定义

商家可以在 Shoplazza 后台访问主题编辑器。

为了了解您的 theme 设置在商家眼中是如何呈现的，您可以在主题编辑器中预览自己的 theme。在开发过程中，您可以通过以下方式访问主题编辑器：

您应当选择最适合当前开发流程的预览方式。

商家在主题编辑器中可以访问的设置由 theme 控制。设置可以在以下位置指定：

当商家使用主题编辑器配置这些设置时，他们的配置会被保存。进一步了解 theme 设置，以及您可以添加到 theme 中的设置类型。

主题编辑器可以在商家与某些输入设置交互时直接预览效果，而无需在商家做出选择后刷新整个店铺前台预览。

主题编辑器可以对纯文本或富文本设置进行实时预览。这包括以下设置：

该设置在父级 HTML 元素内部不能被其他 Liquid 标记前置、后接或包裹：

✅

<h1>{{ section.settings.title | escape }}</h1>

❌

{% assign title = section.settings.title %}
<h1>{{ title | escape }}</h1>

✅

{% when 'heading' %}
  <h1>{{ block.settings.title | escape }}</h1>z

❌

{% when 'heading' %}
  {% assign title = block.settings.title %}
  <h1>{{ titlee | escape }}</h1>

您需要确保您的 theme 在编辑器中的表现与在店铺前台中的表现一致。在某些情况下，您需要在 theme 于主题编辑器中预览时调整其行为，以便为商家提供这种体验。

为了让您的 theme 具备上下文感知能力，您需要将其与主题编辑器集成。

与主题编辑器集成可让您执行以下操作：