主题开发简介

嘿店支持第三方开发者对店铺进行自定义开发，可以通过丰富的嘿店API为商家定制个性化的店铺页面。

1.相关名词

  • 页面配置：商店默认含有8个主要页面以及若干个自定义页面，页面配置为页面中里面定义的版块及每个版块的配置文件
页面名称 英文名 url 与其他页面不同的特殊数据
主页 home ／ 无
商品列表 search /search 商品列表，查询条件
商品详情 product /product/:productName 名为productName商品的数据
专题列表 collection_list /collections 专题列表
专题详情 collection /collections/:collectionName 名为collectionName专题的数据
文章列表 blog /blog 博客列表
文章详情 article /blog/:blogName 名为blogName博客的数据
购物车 cart /cart 购物车页面
自定义页面 static /page/:pageName 名为pageName页面的富文本内容

  • 版块: 组成页面的单位，页面通过设置板块的组合和板块的配置以及页面中的特殊数据构成

  • 预设：一套页面板块配置的组合，使得启用的店铺能有一套默认的页面设置

  • 片段：一段可在任意板块中复用的代码

  • 布局: 构成页面布局，设置了页面中除板块内容外的文件引入

  • 语言文件：用于翻译模版中的固定字符，在文件中规定了特定的键值映射

  • 资源文件: 用于使模版更丰富的js,css,images以及fonts文件

2.主题运行机制

主题的运行依赖于shopfront服务，主题的编辑依赖于dashboard服务，开发者开发的模版可以支持建站工具编辑，也可以不支持建站工具编辑。

  • 店铺浏览
    1. shopfront服务会查询店铺的当前主题，然后通过买家输入的URL得到特定的页面类型和页面名称，查询出页面配置
    2. 页面配置定义了页面中有的板块名称和板块详情，shopfront服务用当前主题中的板块文件渲染，将页面呈现给用户。
  • 编辑主题
    1. 在嘿店管理后台中，点选编辑主题。dashboard服务会启动一个iframe显示在预览区域，iframe的src属性为店铺的预览地址加上edit=1的query参数
    2. shopfront服务会对edit=1参数做特殊的处理，在店铺中载入更多编辑器相关的代码，这些代码会使用postMessage与dashboard服务通信
    3. 店铺中其他的处理与店铺浏览中描述的两步相同。
    4. 当用户编辑主题配置时，shopfront服务和dashboard服务会通信并保持数据同步，发生配置变化时，iframe中会重新渲染页面呈现预览效果。

3.相关资源

results matching ""

    No results matching ""