Shopify创建自定义页面教程

Shopify自定义页面如何创建?轻松提升店铺体验!

Shopify自定义页面可用于创建常规的文字页面如政策页面,以及特殊页面如品牌故事、联系我们、物流查询、联盟营销等功能页面。如下图所示,Orders Tracking页面是通过物流查询插件的功能设计而成:

本文将介绍如何在Shopify中创建自定义页面,并分享3种设计页面内容的方法。

制作自定义页面的操作步骤如下:

  1. 创建空白的自定义页面,为后续的内容填充提供“画布”
  2. 设计页面内容,可以使用原生的富文本编辑器、主题编辑器或页面编辑器插件如Pagefly

创建自定义页面

登录到Shopify后台,选择【在线商店】> 【页面】,然后点击【添加页面】:

下一步,填写页面的基础信息:

每个部分的解释如下:

  1. 标题:页面的标题,例:Contact us、Orders Tracking、Affiliate Program
  2. 内容:页面的主体内容,包括文本、图片、视频等多媒体内容。若需要高度定制,可使用主题编辑器或页面编辑器如 Pagefly 设计页面
  3. 可见性:设置页面是否对公众可见
  4. 模板:当前发布的主题会提供预设的页面模板,决定页面的布局和样式。
  5. 搜索引擎产品页面:包括页面标题、元描述、URL等SEO相关设置,优化这些设置可以提高页面在搜索引擎结果中的排名,吸引更多流量。

设计自定义页面

1. 富文本编辑器

常规页面指的是简单的图文组合,类似于Word文档的排版,常见的例子有政策页面,如下图所示:

这种页面直接使用原生的富文本编辑器填充内容即可:

对于政策页面,使用自定义页面和预设模板的效果是一致的,更推荐使用Shopify预设政策模板快速生成,详细的操作步骤请参考 Shopify预设模板快速生成政策页面

2. 模板编辑器

富文本编辑器适合设计简单的纯文字页面,但如果需要更高设计感或特殊功能(如“联系我们”页面的表单功能),推荐使用Shopify主题的模板编辑器。它提供丰富的布局模块,帮助你打造更精美、结构更合理的自定义页面。以下是用 Kalles 主题模板编辑器设计的“Contact us”页面示例:

上文提到,创建自定义页面时需要选择页面模板。我们可以专门为特定页面如Our Story创建一个自定义模板。通过模板编辑器设计这个模板,就能让页面展示独特的内容,而不会影响其他页面的布局和样式。下面是详细的操作步骤:

2.1 创建页面模板

在Shopify后台中,选择【在线商店】> 【模板】,在当前发布主题的右侧点击【自定义】:

在主题模板编辑器中,顶部中选择【页面】:

在【页面】中,点击【创建模板】:

在此处填写页面模板名称,多个单词请用下划线连接如:our_story。接着,选择一个现有模板作为基础,通常选择【默认页面】。

2.2 添加分区

下一步,隐藏富文本编辑器中的原生页面内容。接着,在模板编辑器中添加主题模块来设计页面内容,完成后保存页面:

Shopify主题自定义-设计自定义模板

如果你不熟悉主题编辑,可以参考Shopify官方指引:编辑模板,学习如何装修Shopify店铺。

2.3 分配页面模板

下一步,创建一个自定义页面,并将刚才设计的模板分配到这个页面:

最后,点击【查看】可以看到最终的页面效果:

需要注意的是,如果为自定义页面分配了页面模板,后续内容修改必须通过模板编辑器完成。

3. Shopify页面构建器应用

另一方面,Shopify 主题的功能模块(尤其是免费主题)往往有限,可能无法满足特定的设计需求。这时,你可以选择对主题进行二次开发,或直接购买支持所需功能的付费主题。如果你还不确定如何选择 Shopify 主题,可以参考这篇指南:如何选择Shopify主题及正版购买渠道介绍

如果你不熟悉主题开发,可以从 Shopify 应用市场 下载页面构建器应用(如 Pagefly、Gempages、Shogun)来设计页面。这些应用提供丰富的功能模块,操作方式与模板编辑器类似,但设计自由度更高。其中,Pagefly 性价比较高,还提供一个免费页面额度,适合初学者使用。下面是Pagefly演示商店的截图:

不同页面构建器的使用方法各异,以下是热门页面构建器应用的官方文档链接,可结合教程使用这些工具设计自定义落地页:

此外,你可以通过 Shopify系列教程 了解如何从0到1搭建Shopify独立站。

这篇文章有用吗?

平均评分 0 / 5. 投票数: 0

到目前为止还没有投票!成为第一位评论此文章。

很抱歉,这篇文章对您没有用!

让我们改善这篇文章!

告诉我们我们如何改善这篇文章?

滚动至顶部