扩展您的模板

Shopify 模板提供许多设置和自定义选项。但是，您的模板可能不提供某些功能，或者您可能只是想进一步自定义模板。例如，您可能希望在商店中显示产品评论，这可以通过安装应用来实现。如果要扩展您的模板功能，您可以按照以下方式进行扩展。

本页相关主题

  • 添加自定义 HTML 或 Liquid

  • 安装应用

  • 编辑模板代码

添加自定义 HTML 或 Liquid

某些模板提供一些设置，让您能够添加 HTML 或 Liquid 代码的代码片段，这些代码可在包含相关设置的模板、分区或块中呈现。通过这些设置，您可以安全地将自定义代码添加到在线商店，而无需直接编辑模板的代码，这有助于确保您的模板符合自动升级条件。

您可以将这些设置用于以下任务：

  • 使用自定义 Liquid 分区插入适合您业务的 Liquid 变量。例如，您可以在产品页面上包含物流政策。

  • 使用自定义 Liquid 分区添加将应用与模板集成所需的代码。

若要了解模板是否有自定义 HTML 或 Liquid 选项，请参阅模板的文档。

Liquid 设置仅允许您访问有限的 Liquid 对象和标签。若要了解可在 Liquid 设置中使用的对象和标签，请参阅 Shopify.dev 上的 Liquid 设置文档。

安装应用

您可以安装应用，以向您的模板中添加功能和集成。您可在 Shopify 应用商店上查找应用。

在线商店应用可以通过以下方式与您的模板集成：

  • 作为应用块：通过应用块，您可以准确地在模块中要使用应用功能的位置添加应用功能。您可以通过模板编辑器添加、删除和自定义应用块。

    应用块只能与 Online Store 2.0 模板一起使用。如果您使用复古模板，那么您应该阅读应用描述和文档，了解该应用是否与您的模板兼容。

  • 作为应用嵌入：应用嵌入是应用提供的元素，可在您的模板中浮动或以叠加层的形式显示，也可在客户看不到的情况下将代码添加到您的在线商店。您可以通过模板编辑器启用、禁用和自定义应用嵌入。

  • 通过更改您的模板代码：一些应用直接将代码注入您的模板代码中，以便为您的模板添加功能。您可以使用应用设置或使用模板编辑器自定义应用。

    如果您的模板提供 Custom Liquid 部分，您或许可以将您的应用代码添加到模板编辑器中的“自定义 Liquid”部分，而不是直接编辑您的模板代码。

编辑模板代码

您可以通过编辑模板代码来对在线商店进行详细更改。模板文件包含 Liquid（Shopify 的模板语言），以及 HTML、CSS、JSON 和 JavaScript。只有在您了解 HTML 和 CSS，并具备 Liquid 的相关基础知识时，才可编辑模板的代码。

如果您编辑模板的代码，则可能会使其不符合自动升级的条件。只有在无法使用 HTML 或 Liquid 设置或 Shopify 应用进行所需更改的情况下，才应编辑模板的代码。

如果您使用 Shopify 的免费模板，Shopify 支持团队可以帮助您对模板代码进行某些自定义。有关可用自定义项的列表，请参阅模板的文档。详细了解针对模板的支持。

您可以按照以下方式编辑您的模板代码：

  • 直接在 Shopify 后台中编辑代码。

  • 使用 Shopify CLI 和 Shopify GitHub 集成等开发工具在本地编辑模板。

Shopify商户官网原文详情：

Extend your theme

Shopify themes offer many settings and customization options. However, there might be some features that your theme doesn't offer, or you might just want to further customize your theme. For example, you might want to display product reviews in your store, which you can do by installing an app. If you want to extend the functionality of your theme, you can do so in the following ways.

On this page

  • Add custom HTML or Liquid

  • Install an app

  • Edit your theme code

Add custom HTML or Liquid

Some themes offer settings that let you add snippets of HTML or Liquid code that can be rendered in the template, section, or block that contains the setting. These settings let you safely add custom code to your online store without editing your theme's code directly, which helps to ensure that your theme is eligible for automatic upgrades.

You might use these settings for the following tasks:

  • Use a Custom Liquid section to insert Liquid variables where they make sense for your business. For example, you might include your shipping policy on your product page.

  • Use a Custom Liquid section to add the code that's required to integrate an app with your theme.

To learn whether your theme has a custom HTML or Liquid option, refer to your theme's documentation.

Liquid settings only allow you to access limited Liquid objects and tags. To learn about the objects and tags that you can use in a Liquid setting, refer to the Liquid setting documentation on Shopify.dev.

Install an app

You can install apps to add features and integrations to your theme. You can find apps on the Shopify App Store.

Online Store apps can integrate with your theme in the following ways:

  • As an app block: App blocks let you add app functionality exactly where you want to use it in your theme. App blocks can be added, removed, and customized through the theme editor.

    App blocks can only be used with Online Store 2.0 themes. If you use a vintage theme, then you should read the app listing and documentation to understand whether the app is compatible with your theme.

  • As an app embed: App embeds are app-provided elements that float or appear as an overlay in your theme, or add code to your online store without being visible to your customers. App embeds can be enabled, disabled, and customized through the theme editor.

  • By altering your theme code: Some apps inject code directly into your theme's code to add functionality to your theme. You might customize the app using the app settings, or using the theme editor.

    If your theme offers a Custom Liquid section, then you might be able to add your app code into a Custom Liquid section in the theme editor instead of editing your theme code directly.

Edit your theme code

You can edit your theme code to make detailed changes to your online store. Theme files contain Liquid, Shopify's templating language, along with HTML, CSS, JSON, and JavaScript. Edit the code for a theme only if you know HTML and CSS, and have a basic understanding of Liquid.

If you edit your theme's code, then you might make it ineligible for automatic upgrades. You should only edit your theme's code if you can't make the changes that you need using an HTML or Liquid setting or a Shopify app.

If you use a free theme from Shopify, then Shopify Support can help you to make certain customizations to your theme code. Refer to your theme's documentation for a list of available customizations. Learn more about support for themes.

You can edit your theme code in the following ways:

  • Edit code directly in the Shopify admin.

  • Edit your theme locally using development tools like Shopify CLI and the Shopify GitHub integration.

文章内容来源：Shopify商户官方网站


（本文内容根据网络资料整理，出于传递更多信息之目的，不代表连连国际赞同其观点和立场）