在您的Shopify商店中添加自定义部分的关键步骤

目录

  1. 介绍
  2. 什么是Shopify Sections?
  3. 打造您的第一个Shopify部分
  4. 结论:整合部分

介绍

在Shopify商店中创建自定义部分对于获得更个性化和品牌化的用户体验至关重要。无论是插入促销横幅、特色产品、信息性简介还是互动内容,了解如何在Shopify中创建部分可以从根本上提升您网站的功能和吸引力。在本文中,我们深入探讨了创建这些可定制构建块的关键步骤,使您能够打造出卓越的商店。

量身定制的部分的重要性在于它们提供的改进控制;因此,它们对客户旅程和转化率产生重大影响。通过本次探索的结论,您将具备运用部分和打造一个独特的Shopify商店的实际知识。

什么是Shopify Sections?

Shopify部分作为存在于Shopify主题中的模块化的、可定制的元素,允许商店所有者调整其在线商店的外观和感觉。这些部分特别灵活,包含可以根据需要进行编辑、重新定位或删除的各种内容和功能。

随着Shopify的在线商店2.0的推出,一个全面改进的更新引入了对部分在整个商店中广泛应用的新能力,标志着与之前受限用法的转折点。

打造您的第一个Shopify部分

让我们展开为您的Shopify商店添加自定义部分的步骤,确保您遵循最佳实践和Shopify模板系统中的潜在复杂性。

第1步:了解Shopify模板

在开始创建部分之前,了解Shopify模板系统的工作原理。Shopify中的每个页面都是使用一个定义结构但没有实际内容的.json模板文件构建的。这就是部分发挥作用的地方。

第2步:构建部分

部分使用Liquid模板语言制作,并在主题代码的/sections目录中汇集。创建部分的步骤如下:

      1. 在您的Shopify管理后台中导航到在线商店 > 主题 > 编辑代码
      2. 进入/sections目录并使用添加新部分提示。
      3. 适当命名您的部分(例如welcome-banner)并选择创建部分

部分的构成要素包括三个主要组件:HTML/Liquid内容、CSS和JavaScript。它们被封装在一个{% schema %}中,其中详细说明了自定义的设置。

第3步:使用JSON模板进行结构化

通过将新部分与JSON模板集成,实现动态渲染。按照以下步骤将您的部分分配到一个.json模板文件中:

      1. 在主题代码编辑器中打开/templates目录。
      2. 编辑所需的模板文件,例如product.json
      3. "sections"对象追加一个条目来描述您的部分。

第4步:填充内容

有了结构,就可以通过填充丰富的内容来使您的部分焕发生机。通过主题编辑器中创建的定制设置,您可以优化商户和客户体验。

第5步:个性化定制选项

友好和美观是定制的引擎。给商户提供丰富的可调节设置:

      1. {% schema %}中使用各种字段类型,例如文本、图像选择器或颜色设置。
      2. 在定制之前,建立决定其通用外观的预设默认设置。

第6步:为主题编辑器添加预设

为了使您的部分可以在Shopify主题编辑器的“添加部分”菜单中访问,请在部分模式中附加预设,如下所示:

liquid "presets": [ { "name": "My Custom Section", "category": "Content" } ]

第7步:确保跨页面可用性

确保您的部分不仅仅可以工作,而且在不同的页面类型中可以取得良好的效果。使用全局变量来实现动态内容,以利用Liquid结构的本地自适应性。

第8步:提供更好的参与和交互

通过提供更复杂的部分呈现和交互方式(如滑块、标签页或可折叠内容),您可以丰富整体用户体验,不仅提高可读性,还提高记忆力。

结论:整合部分

将您的新部分与商店合并,在已经设计好的基础之上,您将看到您的定制内容在现场商店中无缝呈现,如果按照指导进行,即可站立。

常见问题:1. 我可以在结账页面上使用部分进行自定义吗? - 由于安全方面的考虑,Shopify在结账页面上提供了有限的自定义范围。

      1. 如何确保我的部分具有响应性和适用于移动设备?
      2. 在您的部分样式表中使用CSS媒体查询,并在各种设备尺寸上测试您的部分。

      3. 我可以在自定义部分中使用Shopify应用吗?

      4. 是的,部分可以集成应用块——由Shopify应用提供的类似小部件的元素,可以在不直接干预主题代码的情况下增强功能。

在Shopify中开发定制部分不仅仅是功能的构建,它是您商店网站中沉浸式、品牌共鸣的旅程的一大步骤。拥抱定制部分的力量,将您的Shopify体验提升到一个明显突出的水平。