大多数人已经知道WordPress是世界上最流行的CMS(内容管理系统)。这些数字是惊人的。目前占据着全球CMS市场近60%的市场份额,大多数开发人员在过去至少参与过一ob欧宝娱乐app下载地址个WordPress项目也就不足为奇了。
WordPress是一个基于web的,用PHP编写的开源网站创建工具。我经营一家免费在线培训课程为WordPress开发者提供Shopify主题的概述。
在这次培训中,我分享了WordPress主题和Shopify主题之间的一些比较和相似之处。我已经将这些比较和相似之处汇编成一篇文章,这样你就可以快速提升你的Shopify主题,特别是如果你过去已经用WordPress进行主题化。
需要注意的是,本文假设您对WordPress主题化有基本的了解。如果您对其中一些概念不熟悉,我提供了有关这些主题的进一步阅读的链接。
或者,了解更多关于构建主题的信息Shopify metafields。
WordPress vs. Shopify
Shopify
Shopify是一个托管平台,这意味着你不能在自己的服务器或第三方托管提供商(如GoDaddy)上托管Shopify。从这个意义上讲,它与WordPress非常不同,WordPress可以在本地安装,也可以安装在任何可以运行PHP并拥有mySQL数据库的服务器上。
托管平台为您的客户带来了一些非常惊人的好处,包括无限带宽、每日备份、PCI遵从性和默认情况下带有在线商店的SSL证书。欧宝体育官网入口首页
Shopify也是为商业而建的。这意味着它是一个专门的销售平台。这意味着它有很多开箱即用的功能,比如集成支付网关、运输、Shopify部分(我将在后面详细讨论),以及更多。这也意味着在Shopify主题商店中找到的任何主题都支持我们的功能。组件的样式是开箱即用的,看起来没有添加任何东西。
WordPress
WordPress (CMS)是自托管的,这意味着你可以在任何服务器上托管你的WordPress站点,只要该服务器可以运行一个体面的版本PHP和mySQL。这在开始时确实具有成本效益,但一旦业务开始扩展,支付带宽和保证正常运行时间OB欧宝娱乐APP变得更加难以管理,而且成本更高。
WordPress最初是一个博客平台,然后成为一个非常流行的CMS。为了让WordPress拥有电子商务功能,它需要添加,通常是像WooCommerce这样的插件。
找到你的新宠减价编辑器在我们的综述中。
基本内容元素
在所有的内容管理系统中,我们都有基本的内容元素,即内容的类型。在WordPress中,这些是自定义的帖子类型、帖子和页面。在Shopify中,主要的内容类型包括集合、产品、文章(博客中的单独帖子)和页面。
WordPress |
Shopify |
自定义帖子类型 |
(又名集合。产品类别,但仍然不同于标签) 产品 |
的帖子 |
文章 |
页面 |
页面 |
为了简单起见,我选择根据存在什么类型的主题模板以及最常用的模板来比较它们。然而,在WordPress和Shopify中存在比上面列出的内容类型和模板更多的内容类型和模板。
扩展功能
所以,如果一个主题没有提供我们想要或需要的功能怎么办?这通常是当我们需要扩展平台的功能以满足我们的需求时。
WordPress |
Shopify |
插件 --- 您可以独立下载它们并将它们上传到WordPress,或者直接在WordPress UI中下载它们。 |
应用程序 --- 通过Shopify应用商店下载它们,如果你登录了,它们会自动安装到你的Shopify商店。 |
在WordPress的情况下,您将安装插件来扩展平台的功能。例如,WordPress开箱即用不包括电子商务组件,所以我们需要安装WooCommerce插件来启用某些自定义帖子类型和电子商务功能。
对于Shopify来说,这种扩展功能以应用程序的形式体现出来。你可以在Shopify应用商店。要在Shopify商店中安装应用程序,只需到应用程序选项卡中的Shopify管理主菜单,并单击访问Shopify应用商店。然后你可以选择你想要安装的应用程序,它们将安装到你的商店中。安装完成后,你会看到商店中安装的所有应用程序的列表应用程序选项卡,类似于你会看到所有WordPress插件的列表插件选项卡。
父主题和子主题
在WordPress以及Drupal等其他内容管理系统中,有父主题和子主题的概念。然而,需要注意的是,Shopify目前并没有类似的概念。Shopify中的主题不会自动更新。由于没有自动更新,这意味着您不需要担心对现有主题的自定义被覆盖。
来更新主题您需要下载最新版本并将其上传到您的商店。如果您已经进行了自定义,那么不幸的是,您需要将这些自定义移到新更新的主题中,或者使用版本控制来检查差异,然后进行必要的更改。
Shopify主题结构vs. WordPress主题结构
Shopify主题使用液体用于模板的语言,它允许开发人员动态地将内容加载到店面。Liquid是一种由Shopify创建的开源模板语言,用Ruby编写,也用于像变身怪医模板。
WordPress主题是用PHP编写的,并且有各种各样的命名约定。我在下面附上了一个最新的2017主题与一个典型的Shopify主题的例子。
WordPress |
Shopify |
二千零一十七/ | -公司/ | -资产/ | -模板/ | - screenshot.png | - style.css | -…template.php |
my-shopify-theme / |-资产/ |-配置/ |-/ /布局 |-地区/ |-部分/ |-片段/ |-模板/ |
每个Shopify主题目录都包含不同的文件类型,包括Liquid模板、图像、CSS、JSON和JavaScript。如果您有兴趣了解更多信息,我已经将每个目录链接到相应的文档,以便您可以进一步阅读。
重要的是要注意,如果您的主题包含任何额外的目录,这些额外的目录将被省略,当主题上传到Shopify。Shopify将只接受这种目录结构,并为其主题使用这种特定的命名。
我想指出几个特定的目录,它们映射到WordPress中的类似概念。这些包括:
WordPress |
Shopify |
自定义插件或
--- 这些控件控制主题的定制面板。 |
--- 这些控件控制主题的自定义主题页面。 |
--- 该文件包含主题的页眉和页脚内容,以及呈现模板的动态“内容”区域。 |
--- 这个目录包含 |
主题目录中的模板文件 --- 各种页面、帖子和主题模板位于WordPress的主题目录或创建的子目录中。 |
--- 页面、产品、集合、文章和所有其他模板都可以在此目录中找到。 |
--- 该目录包含可重用PHP代码的较小片段。 |
--- 此目录包含可重用Liquid代码的较小片段。 |
Shopify节和配置
的部分/
目录包含主题的节,这些节是可重用的内容模块,可以由主题的用户自定义和重新排序。的自定义主题页面会让你想起WordPress定制面板。可以编辑或创建它们主题的选择和部分模板。主题选项和节在Shopify中非常容易定制,因为它们使用简单的JSON对象来组织选项数据。
你可能还喜欢:主题选项介绍。
静态部分都类似于WordPress小部件,因为您可以在模板文件中为它们注册一个区域,然后可以通过输入、选项和选择器对它们进行定制自定义主题页面面板。
Shopifytheme.liquid
与WordPressindex . php
Shopify的theme.liquid
模板类似于index . php
在WordPress主题中找到的文件。它包含主题的页眉和页脚,以及呈现其他模板的动态内容区域。也可以在布局/
目录是顶级布局的液体文件,用于呈现礼品卡,和密码页面。
模板
的模板/
目录包含所有其他Liquid模板,包括客户帐户模板。模板中通常包含较小的代码片段片段/
目录中的内容区域中呈现的模板theme.liquid
文件,它控制整个主题的包装布局。
片段
的片段/
目录包含所有主题的液体片段文件,这是代码位,可以在主题的其他模板中引用。
您可以使用Liquid include标记将代码片段加载到主题中。snippet非常类似于公司/
目录。
资产管理
所有你上传到资产/
目录都托管在我们的CDN上。CDN代表内容交付/分发网络,这意味着我们可以非常快速地提供资产,即使在商店中有大量流量时也是如此。
资产包括图像、CSS和JavaScript文件。您还应该知道Shopify具有编译Sass的能力,因此您可以使用Sass进行主题开发而无需编译器。请注意,Shopify目前运行的是Sass 3.2。
WordPress |
Shopify |
--- 用于正确地引用CSS和脚本文件为您的主题。 |
液体过滤器 --- 使用适当的液体过滤器中的CSS、JS和其他文件 |
在WordPress中,显然也
通常,你可以在主题中使用WordPress钩子,这是一个庞大的WordPress动作和过滤器的集合,几乎可以改变WordPress所做的一切。与此形成对比的是,Shopify使用Liquid过滤器来引用文件中包含的各种资产资产/
目录中。
要引用样式表,只需在< >头
元素中theme.liquid
文件:
{{'theme.css' | asset_url | stylesheet_tag}}
在哪里theme.css
希望链接到主题的样式表的名称。它将渲染一个完整的<链接>
元素中添加适当的href
url到CDN上的样式表。
你也可以使用下面的代码来引用JavaScript:
{{'scripts.js' | asset_url | script_tag}}
在哪里scripts.js
是要链接到主题的JavaScript文件的名称。
你可能还喜欢:img_url过滤器好了10倍。
循环和模板
WordPress循环是所有WordPress主题开发的中心。在Liquid中,我们使用a为
循环循环遍历一组产品、收藏品或物品例如,循环遍历一个产品列表可能像这样:
{%表示集合中的产品。产品%}{{产品。Title}} {% endfor %}
专业技巧
要检查您在什么主题模板上-只需将此代码片段添加到顶部theme.liquid
,然后在您的商店中导航到您想要的页面。它将始终输出用于将页面内容呈现为文本的模板。{{模板}}
你可能还喜欢:如何在Shopify主题开发中使用替代模板。
资源
唷!这是关于Shopify主题的大量信息!如果您想了解更多信息,我在下面提供了关于主题的额外资源。
一定要报名参加免费合作伙伴帐户,开始本地开发和LOB欧宝娱乐APPiquid!
本地开发和入门主题OB欧宝娱乐APP 学习液体 所有的东西我可以在本文中介绍更多的主题相似之处,但我所包含的对于任何希望构建第一个Shopify主题的主题开发人员来说都是一个很好的开始。OB欧宝娱乐APP
你是一个WordPress开发人员进入Shopify吗?你想了解更多关于什么?请在下面的评论中告诉我们!