介绍在线商店2.0:对开欧宝体育官网入口首页发者意味着什么

Shopify网欧宝体育官网入口首页上商店

今天在Shopify Unite上,我们宣布了迄今为止最大的更新之一:在线商店2.0。欧宝体育官网入口首页

欧宝体育官网入口首页在线商店2.0为开发人员为Shopify商家构建主题和应用程序提供了大量机会。我们已经从头开始重建了在线商店体验,欧宝体育官网入口首页并引入了一套新的开发人员工具,以帮助您为商家和购物者创造惊人的体验。

在本文中,我们将介绍这些新工具和特性,以了解它们如何影响您的工作,以及它们提供的可能性。我们也会解释的需求更新您的主题和应用程序到在线商店2.0标准。欧宝体育官网入口首页

我们跳进去吧。

1.主题架构升级

我们已经升级了在线商店的主题架构,为商家提供了更容易和更灵活的定制选项。欧宝体育官网入口首页开发者也有新的机会来构建主题和集成,这些主题和集成可以很容易地被商家定制,以满足他们的需求。

每页都有章节

到目前为止,商家在Shopify上展示自己业务的方式受到限制,版块的灵活性仅限于主页。要在其他页面上实现类似的效果,需要进行代码编辑、精心设计的解决方案或定制应用程序。

每一页都有不同的章节。现在,商家可以在所有页面上添加部分,而不仅仅是主页,从而为个性化商店的各个方面提供了一系列新的机会。

每个页面上的部分是如何工作的

这些变化是通过店面呈现模板的新方法实现的。现在可以使用JSON模板文件呈现每种页面类型,该模板文件列出该页面的各个部分,并存储与商家添加或编辑的任何其他部分相关的设置数据。商店可以有多个模板文件,这些文件映射到不同的产品、集合页面、自定义页面、博客文章等,从而允许商家在同一商店中轻松地拥有不同的产品、集合和其他页面。

在新的JSON模板文件中,您可以定义在首次安装主题时默认应该出现哪些部分,以及它们应该以何种顺序出现。一旦添加了JSON模板,商家就可以导航到主题编辑器,并添加任何包含预设的部分——就像您之前在主页中添加动态部分一样。

要查看如何设置的模型,请查看/模板新主题目录,黎明,在GitHub仓库,或阅读我们的JSON模板的开发人员文档

请参见下面的模板演示。

主题应用扩展与应用程序块

随着主题架构的更新,应用程序如何与店面集成也随之更新。目前,还没有结构化的端到端解决方案可以让应用程序轻松地与主题集成。开发者不得不为每个现有的主题和主机资产构建集成逻辑,这使得他们很难构建出能够在所有主题上一致工作并且在世界任何地方都能快速运行的特性。

为了解决这些挑战,我们引入了主题应用程序扩展为开发人员,允许您通过应用程序块将应用程序扩展到商家的主题。

Shopify在欧宝体育官网入口首页线商店:更新的主题编辑器的动图,显示一个应用程序块被添加到产品页面。用户选择“添加块”,从下拉列表中选择应用程序。
添加到产品页面中的应用程序块更新主题编辑器

内置的模块化

应用程序块代表了应用程序包含在主题中的方式的根本变化。应用程序开发人员现在可以构建UI组件,这些组件可以直接通过主题编辑器添加、删除和配置,而无需修改主题的代码。这意味着卸载也更干净,自动删除了幽灵代码。

主题应用程序扩展可以很容易地创建,发布和更新(与版本控制)从Shopify CLI,就像其他应用程序扩展。

这种模块化意味着您不再需要为每个现有主题构建集成逻辑。由于不再需要打开主题代码来手动安装应用程序,因此您不必担心引入的破坏性更改。这意味着减少了与用户进行故障排除的时间。

要确定商家是否使用与您的主题应用程序扩展兼容的主题,您应该使用主题API资产的API。了解商家使用的主题类型将有助于您为商家提供最佳的登录体验,以便将应用程序集成到他们的主题中。

托管和管理资产

您还可以将应用程序的支持资产添加到主题应用程序扩展中,以便通过Shopify的CDN快速托管,并轻松地从主题扩展的应用程序块中引用这些资产。

Shopify在欧宝体育官网入口首页线商店:显示应用程序块和主题应用程序扩展如何交互的流程图。
一个包含在主题应用扩展中的应用块的例子。

要构建您的第一个主题应用程序扩展并使您的应用程序与在线商店2.0兼容,请访问欧宝体育官网入口首页文档中的迁移信息

2.灵活的存储内容

使用Onl欧宝体育官网入口首页ine Store 2.0,开发人员不必将元字段硬编码到主题中,也不必依赖api来更改产品页面。主题开发人员现在可以使用动态源来插入标准元字段和已知资源属性作为默认设置。

元字段的改进

更新主题编辑器是否允许商家添加metafields和属性,而无需使用api或代码。这意味着商家将能够在产品页面上准确地添加他们需要的内容,比如为买家引入一个空间,包括尺寸表或成分表。任何不太可能出现在核心存储编辑器中的内容现在都可以通过元字段添加进去。

在开发方面,我们从三个关键方面修改了元字段:

  • 更灵活的:元字段现在有一个更加灵活的类型系统,随着时间的推移,它将变得更加适合商业数据。
  • 标准metafields:我们正在引入标准元字段,这使得自定义主题更容易在不同垂直市场的商店中开箱操作。ob欧宝娱乐app下载地址
  • 报告提示:现在,您可以向元字段添加表示提示,允许Storefront API和Liquid用户以商家预期的方式呈现商家数据,而自定义代码要少得多。

了解有关元字段的更多信息在我们的文档中,并观看下面的演示。

文件选择器

元字段现在支持图像或PDF文件等媒体。元字段文件选择器使上传和选择产品页面上的媒体变得容易,而不是将资产硬编码到主题中。文件中保存的所有图像设置/文件部分可以立即使用。

例如,如果商家希望在产品页面上提供产品保修或尺寸图表可供下载,那么文件选择器可以通过简单的UX轻松选择该文件,并将其插入到文件元字段放置在主题上的位置。

文件API

开发人员还可以访问设置/文件通过新的Files API。GraphQL API允许应用程序上传或选择现有的媒体内容设置/文件。应用程序现在可以从这个管理区域的访问中受益,包括用内容填充媒体元字段。

这为应用程序提供了使用该空间存放与产品没有直接关联的文件和图像的机会,包括主题中使用的图像。了解更多关于Files API的信息在我们的文档中

3.对主题编辑器的增强

为了使商家能够利用这些改进和更新,并使开发人员更容易导航,我们还对主题编辑器进行了实质性的增强。

现在,编辑器不再需要向下钻取到不同的部分,而是在侧边栏中显示页面上所有内容的树状视图。从这个侧边栏,商家可以隐藏大多数块,除了页眉和页脚(其中可以包含可以移动或隐藏的块,但不能隐藏自己)。这些变化使商家可以轻松地更新页面的层次结构。

Shopify在欧宝体育官网入口首页线商店:更新的主题编辑器的动图,展示了如何轻松移动部分。
更新后的主题编辑器正在运行。

液体输入设置

主题编辑器的另一个更新是新的Liquid输入设置,它将允许商家直接从编辑器向页面添加自定义Liquid代码。Liquid设置类似于HTML设置类型,除了它允许访问Liquid变量,这意味着商家将能够访问全局和模板特定的Liquid对象。

这种设置将减少商家手动更改主题代码的需要,特别是在为使用Liquid的应用程序添加代码时。开发人员可以学习如何将此设置添加到节或块中在我们的开发者文档中,或查看我们的新主题“黎明”号的custom-liquid部分这是如何实现的一个例子。

这些变化使商家更容易使用在线商店2.0的新功能,并在不与开发人员接触的情况下对他们的在线商店做出决定-腾出时间专注于构建创造性的集成和解决方案。欧宝体育官网入口首页

4.新的开发人员工具

欧宝体育官网入口首页在线商店2.0为开发人员为Shopify商家构建应用程序和主题引入了一种全新的方式。为了支持这一更改,我们引入了一套新的开发人员工具无缝集成到Shopify,并协助开发,测试和部署您的主题的过程。

随着Shopify GitHub集成的引入,更新的Shopify CLI工具和主题检查,您将通过版本控制体验更强大的主题开发,更好的沙箱环境来本地开发主题,并通过为Shopify主题调整的实时筛选器简化开发。

下面,我们来看看这些工具对你意味着什么。

Shopify Github集成

我们将推出与GitHub的新集成,使主题开发和维护更容易跟踪和管理。通过将您的GitHub用户帐户或组织连接到在线商店,更改将被推入和拉入GitHub repo,该repo始终与所选主题的当欧宝体育官网入口首页前状态同步。

GitHub与主题的集成将通过引入对版本控制的本地支持,允许开发人员在编辑主题时安全地协作。当在商家的商店工作时,开发人员现在可以实现工作流程,在填充到实时主题之前,必须在GitHub上审查和合并对主题的更改。

对于那些在部署到在线商店之前使用CI执行检查、测试和文件转换(例如运行Theme Check或将SCSS编译为CSS)的人来说,Github集成可以与Git子树结合使用,以同步生产就绪的文件。欧宝体育官网入口首页了解更多在我们的文档中,并观看下面的GitHub集成演示。

Shopify CLI

我们也对现有的做了一些重大的改变Shopify命令行工具。应用程序开发人员一直在使用CLI快速生成Node.js和Ruby on Rails应用程序和应用程序扩展,但我们现在扩大了该工具的范围,包括主题。

Shopify CLI加速您的主题开发,因为它现在可以:

  • 安全地开发、预览和测试开发主题内部的主题更改
  • 由于有了新的开发服务器,CSS和Liquid部分会随着开发而变化
  • 使用我们的新主题初始化一个新的主题项目,黎明,作为起点OB欧宝娱乐APP
  • 从命令行推送和发布主题
  • 运行主题检查关于你的主题
  • 填充主题的测试数据,包括产品、客户和草稿订单

发展的主题

开发主题是临时的,隐藏的主题,与您用于开发的Shopify商店相连。当你打来电话Shopify主题服务, Shopify CLI会自动在您正在开发的商店中创建开发主题,并且每次都会重用该主题Shopify主题服务随后运行。您不需要担心其他人查看或编辑它,因为开发主题在控件上不可见管理/主题页面。

开发主题不计入主题限制,并在7天后从商店中删除。当你奔跑时,它们也会被摧毁shopify-logout所以,如果你需要一个预览链接,当你退出时不会被破坏,你应该把你的主题推送到商店。

开发主题可用于查看您正在本地实时开发的主题的更改,并使用主题编辑器与主题进行交互和自定义主题。

这些工具旨在使您的开发过程更容易,并让您快速启动和运行在线商店2.0。欧宝体育官网入口首页

主题检查

Theme Check是Liquid和JSON的语言服务器,可以扫描主题的错误,并突出显示Shopify主题和Liquid的最佳实践。该工具可以与文本编辑器(如Visual Studio Code)集成,并识别主题代码中的几种类型的问题,包括Liquid语法错误、缺少模板、性能问题等。

为了帮助您快速调试主题问题,错误消息包括指向失败检查文档的链接。主题检查也与Shopify CLI工具捆绑在一起,所以你不需要单独安装它。请查看我们的开发人员文档了解如何安装和使用主题检查时,测试您的主题。

请参阅下面的新代码编辑器的视频。

5.新的参考主题

为了配合在线商店2.0的发布,我们推出了一个全新的默认欧宝体育官网入口首页主题,它将上述所有功能联系在一起。我们称之为黎明。

Dawn是Shopify的第一个源代码可用的参考主题,具有OS 2.0的灵活性和对速度的关注。它是用HTML和CSS的语义标记构建的,而不是依赖于多边形和外部库,可以在所有浏览器上创建出色的体验。它的设计是为了最大限度地提高灵活性,同时最大限度地降低复杂性,这意味着要平衡我们的设计与允许商家的空间做出改变,他们认为适合自己的业务。

在构建Dawn的过程中,我们一直强调速度,结果是Dawn在默认情况下是快速的,无论如何,它的加载速度比Debut快35%,而现在超过一半的商家使用的是这个主题。

Shopify网欧宝体育官网入口首页上商店:一个视觉黎明,Shopify的新主题。
黎明,Shopify的第一个可用的参考主题。

因为《Dawn》已经拥有了所有页面的JSON模板,所以你可以在自己的主题上解锁部分时使用它作为模型。它最终将取代Debut成为所有新店的默认主题。

通过阅读我们的文章了解更多关于我们如何构建Dawn的信息在Shopify用户体验博客上

关于使用最小的JavaScript

可以说,《黎明》最大的追求是我们探索了你到底能走多远仅按需使用javascript进行开发。这是因为我们比以往任何时候都更重视速度,提供了一个快速的基础,以增加商家商店快速加载的可能性。

我们知道,用最少的JavaScript构建意味着我们不会牺牲商家和买家的用户体验。在某些情况下,JavaScript是必要的,即使它不是性能最好的选择。但在有意义的地方,我们倾向于使用本地浏览器功能,而不是JavaScript库和polyfill。

我们鼓励开发人员尽可能利用本地浏览器的功能来呈现HTML和CSS布局。

6.Shopify主题商店重新开放

我们很高兴地宣布,除了在线商店2.0的改进,我们也将重新开放欧宝体育官网入口首页Shopify主题商店于2021年7月15日向合作伙伴发布。在那一天,您将能够提交您的新主题进行审查,批准的主题将开始发布。

更好的是,在9月份,我们将取消你在Shopify主题商店每年赚到的前100万美元的所有收益分成。这意味着,如果你的收入低于100万美元,你将支付零收入分成——这些数字每年都会重置。当你的收入超过100万美元时,你仍然只需要支付增量收益的15%。

每个账户提交到Shopify主题商店的一次性提交费用为99美元,所有交易的处理费为2.9%。我们很快就会有更多关于这次更新的信息。

随着数百万商家使用Shopify来经营他们的业务,现在是时候为这些全球企业家建立主题了。Shopify主题商店自2018年以来一直关闭,所以这是一个早期进入并建立自己作为值得信赖的主题开发者的机会。

了解有关最新指南的更多信息提交主题到Shopify主题商店。如果你还没有,在下面注册一个Shopify合作伙伴帐户,并开始建立你的第一个主题。OB欧宝娱乐APP

7.更新你的主题和应用

为了充分利用这些改进,您应该计划尽快将您的主题和应用程序迁移到Online Store 2.0的更新要求中—特别是当商家开始期望OS 2.0提供的灵活性时。欧宝体育官网入口首页

到今年年底,Shopify主题商店中的所有主题和Shopify应用商店中的应用程序都将使用新的基础设施。商家现有的主题将在今年之后继续使用,但要通过主题编辑器访问新的在线商店2.0功能,商家需要确保他们的主题与在线商店2.0兼容。欧宝体育官网入口首页

了解更多关于将主题迁移到OS 2.0构建主题应用扩展使您的应用程序兼容OS 2.0主题。

更新的文档

为了帮助您更新主题和应用程序,我们对在线商店的开发人员文档进行了全面检查。欧宝体育官网入口首页我们的文档现在包括:

  • 使用主题的开发人员工作流和流程指南
  • 具有语义web最佳实践的商业组件的最佳实践
  • 应用程序应该如何与新的在线商店架构集成,包括如何使你的应用程序与传统主题一起工欧宝体育官网入口首页作

访问我们的新文档了解有关更新应用程序和主题的更多信息。通过加入我们的每月What 's New for Developers通讯,随时了解Shopify开发的最新动态。

模板图标

为商业的未来而建设

欧宝体育官网入口首页在线商店2.0标志着Shopify对主题构建方式的端到端彻底改革。每个页面上都有部分,应用程序驱动的块,灵活的数据存储和强大的开发人员工具,在Shopify上构建主题的过程比以往任何时候都更容易。提供给应用程序开发人员的可扩展性意味着更多的机会为商家构建集成,并直接在在线商店中展示您的解决方案。欧宝体育官网入口首页

更新主题为你的应用创建主题应用扩展充分利用这些更新,继续为世界各地的商家建设。

欲知详情,请浏览:Shopify伙伴

主题:

借助Shopify合作伙伴计划发展您的业务

了解更多