模板,Shopify Boundless模板详细设置教程

模板,Shopify Boundless详细设置教程核心内容

                                                                                               

模板,Shopify Boundless详细设置教程文本

       

   

   Boundless 非常适合展示摄影作品， UI 非常小，可以展示无边框的摄影作品。Boundless 可在移动设备上呈现最佳效果，适用于中大库存Shopify商店。

   

       

   

   模板编辑器

   

   使用模板编辑器定制模板。模板编辑器工具栏分为分区和模板设置。

   

       

   

   分区是一个自定义的内容块，可以在您的在线商店中确定不同的页面布局。

   

   主页分区包括多种功能（如幻灯片或新闻信息注册），您可以添加、重新排列或删除这些功能。主页上最多可以有 25 分区。

   

   每种类型的页面都有自己的分区。例如，产品页面的分区决定了在线商店中每个产品页面的布局。

   

   页面上的分区总是位于在线商店的特定位置。您可以定制它们，但不能重新排列或删除它们。

   

   每个模板包括固定分区(如页眉和页脚)，这些分区将显示在网店的每个页面上。

   

   您可以了解 独特的分区选择以及如何定制它们以适用于您的业务。

   

   Boundless 包括以下静态分区：

   

   标头

   

   侧栏菜单

   

   公告栏

   

   幻灯片

   

   操作栏

   

   页脚

   

   产品

   

   收藏

   

   产品系列表页面

   

   文章

   

   动态分区

   

   您可以从定义主页的布局中添加、重新排列和删除动态分区。每个模板都有唯一的动态分区可供选择。

   

   Boundless 包括以下动态分区：

   

   博客文章

   

   产品系列表

   

   特色产品系列

   

   带文本的图片

   

   特色产品

   

   新闻通讯

   

   地图

   

   格式文本

   

   视频

   

   自定义 HTML

   

   标头

   

   模板的标头是显示在您商店每个页面顶部的分区。

   

   标头分区包括以下设置：

   

   logo - 向标头添加 logo 图片。

   

   主页 logo - 添加 ，只显示在主页上logo。主页 logo 显示在幻灯片上，所以请选择图片上容易看到的 logo 版本。

   

   自定义 logo 宽度(以像素为单位) - 设置 logo 的大小。

   

   自定义标头

   

   在 Shopify 后台，转到网店 > 模版。

   

   查找 Boundless，然后单击自定义。

   

   单击标头。

   

   使用设置来自定义标头。

   

   单击保存。

   

   侧栏菜单

   

   侧栏菜单就像商店的目录。菜单按钮显示主菜单和页脚菜单 ，无论顾客在哪里

   

   侧边栏菜单显示两个菜单：主菜单以较大的大小显示在顶部，而附加菜单以较小的大小显示在主菜单的下方。

   

   定制侧栏菜单：

   

   单击分区。

   

   单击侧栏菜单。

   

   从 Primary menu在列表中，选择要显示为主菜单的菜单。通常，这是商店的主菜单。

   

   从 Additional menu在列表中，选择要显示在主菜单下的菜单。通常，这是商店的页脚菜单。

   

   单击保存。

   

   幻灯片

   

   你可以创建主页幻灯片，最多可以播放五张图片。

   

   最好为您的幻灯片使用高分辨率图片。使用 3840 x 2160 px 或更大的图片，但不要超过 Shopify 上传限制。

   

   由于幻灯片的大小和形状取决于客户设备的大小和形状，您的幻灯片图片将在某些屏幕上切割。试着使用中间的焦点图片，这样每张图片的重要部分总是可见的。

   

   如需详细了解适用于幻灯片图片的最佳方法，请参考上传图片。

   

   幻灯片分区包括以下设置：

   

   幻灯片高度 - 设置幻灯片的高度。选择 Adapt to first image slide height(适应第一张图片幻灯片的高度)，根据第一张图片的高度设置幻灯片的高度。

   

   自动循环播放幻灯片 - 自动播放幻灯片。

   

   幻灯片改变时间间隔 - 选择更改幻灯片的频率。

   

   文本和图标 - 选择一种颜色来显示幻灯片上的文本和图标。

   

   图片叠加 - 在图片幻灯片上添加一层颜色。叠加使幻灯片文本更容易阅读。

   

   不透明度 - 设置叠加的不透明度。

   

   图片 - 添加图片幻灯片放映幻灯片。

   

   图片位置 - 选择图片中最重要的区域作为幻灯片的焦点。

   

   标题 - 将标题添加到幻灯片中。

   

   按钮文本 - 向幻灯片添加带有文本标签的按钮。

   

   按钮链接 - 将按钮链接到在线商店的另一部分。

   

   在主页上添加幻灯片

   

   在 Shopify 后台，转到网店 > 模版。

   

   查找 Boundless，然后单击自定义。

   

   单击幻灯片。

   

   来自定义幻灯片的使用设置。

   

   单击保存。

   

   操作栏

   

   默认情况下，操作栏将显示商店的主菜单。您可以根据客户查看的页面定制操作栏以显示不同的产品。在主页上，操作栏通常用于显示产品系列。在产品系列中，操作栏可以显示更多的子类别或其他相关产品系列。

   

   例如，如果你的商店卖衣服，主页上的操作栏可能会显示男装、女装和配饰。如果客户单击女装，上衣、下衣和鞋子可能会显示在产品系列页面的操作栏上。

   

   如果操作栏以这种方式工作，请在主菜单上使用指向产品系列的链接。将指向商店其他部分（联系人或关于页面）的链接放置在页脚菜单中。

   

   要定制操作栏，请执行以下操作：

   

   单击分区选项卡。

   

   单击操作栏。

   

   在菜单列表中，选择要显示在操作栏中的菜单。

   

   单击保存。

   

   页脚

   

   使用 Boundless，菜单可以在页脚内容中显示。

   

   提示:

   

   我们建议您同时在商店的侧栏菜单和页脚中显示页脚菜单。

   

   定制商店页脚：

   

   单击分区选项卡。

   

   单击页脚。

   

   在菜单列表中，选择页脚中显示的菜单。

   

   单击保存。

   

   产品

   

   您可以在产品分区中添加或删除以下元素：

   

   产品品牌或供应商

   

   数量选择器

   

   社会共享图标

   

   动态结账按钮

   

   产品推荐

   

   您还可以跳过第一张产品图片，设置图片样式，选择产品表的宽度。

   

   要编辑产品页面的设置，请执行以下操作：

   

   从顶栏下拉菜单中选择产品页面。

   

   单击分区。

   

   单击产品。

   

   如果您想跳过第一张产品图片，请选择 Skip first product image(跳过第一张产品图片)。

   

   这意味着第一张产品图片只显示在产品系列页面上，而不是产品页面上。使用此选项，您可以设计第一张产品图片，使其在产品系列页面上看起来最好，并定制其他产品图片，使其在产品页面提供的更大空间中看起来更好

   

   请从 设置图片样式Image style在下拉菜单中选择 (图片样式)Tall/square(高/正方形)或 Wide（宽）。

   

   若要显示产品品牌或供应商，请选中 Show vendor(显示供应商)。要显示品牌或供应商，您需要向产品添加供应商。

   

   要显示数量选择器，请选择显示数量选择器。

   

   要显示社交共享图标，请选择 Enable product sharing（启用产品共享）。

   

   要显示动态结账按钮，请选择 Show dynamic checkout button(显示动态结账按钮)。

   

   从 Product form width在下拉菜单中选择 (产品表宽度)Small（小）或 Large(大)设置产品表的宽度。

   

   单击保存。

   

   建议添加或删除产品

   

   您可以在产品页面上展示推荐产品，让客户更容易找到其他可能感兴趣的产品。

   

   从顶栏下拉菜单中选择产品页面。

   

   单击产品推荐。

   

   使用显示动态推荐复选框，选择在产品页面上显示或隐藏产品推荐。

   

   可选：如需更改推荐产品上方显示的标题，请在标题字段中输入新标题。

   

   可选：使用显示厂家复选框，选择在产品描述中显示或隐藏厂家。

   

   单击保存。

   

   收藏

   

   Boundless 包括产品系列页面的多个排序和筛选、外观和分页选项。

   

   在模板预览中打开产品系列页面。

   

   单击分区选项卡。

   

   单击产品系列。

   

   在外观区域设置以下选项：

   

   - 从 Image style在列表中，选择产品图片的图片方向：Tall/square(高/正方形)或 Wide（宽）。

   

   在图片尺寸列表中，选择产品图片的尺寸。

   

   如需增加图片间距，请选择 Add spacing between images(在图片之间增加间距)。

   

   如果您想在产品图片下显示供应商或品牌名称，请选择 Show product vendor(显示产品供应商)。

   

   在 Sorting & filtering在区域内设置以下选项：

   

   如需显示排序选项列表，请选择 Show sorting options(显示排序选项)。

   

   如果您想显示让客户按标签筛选的列表，请选择 Show tag filtering(显示标签筛选)。

   

   在 Pagination (分页)区域Pagination type在列表中，选择显示编号页面或查看更多按钮。

   

   单击保存p>

   特色产品系列

   

   在模板编辑器的特色产品系列中，Image style(图片样式)选项可用于更改产品系列和产品页面显示图片的方式:

   

   如果产品图片呈正方形或纵向，则 Tall/square(高/正方形)最适合

   

   如果你的图片是矩形图片或水平图片，选择宽度是最合适的

   

   图片尺寸选项可以确定产品系列页面上产品图片的尺寸。如果显示较小的产品图片，则可以在一行中添加更多的图片。

   

   每行显示的图片数量也取决于客户的设备(桌面设备或移动设备)和窗口大小。

   

   单击分区选项卡。

   

   单击特色产品系列分区。

   

   从产品系列列表中选择产品系列。您选择的产品系列中最多可以显示50个 产品。

   

   从 Image style(图片样式)列表中，方向设置为 Tall/square(高/正方形)或 Wide（宽）。

   

   在图片尺寸列表中选择图片尺寸。

   

   如需增加产品图片周围的间距，请选择 Add image spacing(增加图片间距)。

   

   要显示产品供应商或品牌名称，请选择 Show product vendor(显示产品供应商)。

   

   单击保存。

   

   新闻通讯

   

   您可以在主页上添加新闻通讯注册。这使得您可以为电子邮件营销活动收集客户的电子邮件地址。你可以在 Shopify 博客了解电子邮件营销的详细信息。

   

       

   

   向主页添加新闻通讯注册：

   

   在 Shopify 后台，转到网店 > 模版。

   

   查找 Boundless，然后单击自定义。

   

   单击分区。

   

   单击添加分区 > 新闻通讯。

   

   在标题字段中输入新闻通讯注册标题。默认标题为订阅我们的新闻通讯。

   

   在子标题字段中输入新闻通信注册子标题。

   

   单击保存。

   

   格式文本

   

   使用格式文本分区在主页上提供任何书面内容或嵌入 Shopify 后台创建的任何页面。例如，您可以通过嵌入博客页面来展示即将进行的活动，或显示包含以下任何内容的页面：

   

   来自您在线商店的嵌入视频

   

   有商店位置的 Google 地图

   

   商店的联系信息。

   

   单击分区选项卡。

   

   单击格式文本。

   

   输入文本并设置文本格式。

   

   如果您想在商店中显示页面，请单击添加内容，然后单击页面。从下拉菜单中选择页面作为主页。

   

   单击保存。

   

   视频

   

   您可以在您的主页中添加 YouTube 或 Vimeo 视频。视频能吸引顾客，让他们对你的生意感兴趣。

   

   在主页上添加视频：

   

   在 Shopify 后台，转到网店 > 模版。

   

   查找 Boundless，然后单击自定义。

   

   单击分区。

   

   单击添加分区 > 视频。

   

   将视频标题输入标题字段。

   

   在 Video link(视频链接)在字段中输入视频共享链接。

   

   YouTube 共享链接如下：https://youtu.be/OTJXAUZY9t0。你可以在这里 YouTube 帮助文章知道如何复制 YouTube 视频共享链接。

   

   Vimeo 共享链接如下：https://vimeo.com/28132510。你可以在这里 Vimeo 帮助中心文章了解如何复制 Vimeo 视频共享链接。

   

   单击保存。

   

   自定义 HTML

   

   在自定义 HTML 可用于 部分HTML 代码创建主页的自定义内容。例如， HTML 从第三方网站设置文本块格式、创建表或嵌入内容。

   

   要定制自己HTML 添加到主页上，请执行以下操作:

   

   在 Shopify 后台，转到网店 > 模版。

   

   查找 Boundless，然后单击自定义。

   

   单击分区。

   

   单击添加分区。

   

   在 Advanced layout(高级布局)区域，单击 Custom HTML（自定义 HTML）> 添加。

   

   单击 Custom HTML（自定义 HTML），然后输入 ，想要添加到主页HTML 代码。

   

   单击保存。

   

   模板设置：您可以使用模板设置来自固定在线商店的颜色和字体。您还可以设置链接到社交媒体账户，编辑购物车设置，并添加网站图标。

   

   Boundless 包括以下模板设置：

   

   颜色

   

   版式

   

   购物车

   

   社交媒体

   

   网站图标

   

   结账

   

   颜色

   

   您可以为在线商店的不同部分选择颜色。

   

   自定义颜色设置

   

   在 Shopify 后台，转到网店 > 模版。

   

   单击 **** 旁边的自定义。

   

   单击模板设置。

   

   单击颜色。

   

   对于每种类型的内容，单击颜色 swatch 使用颜色选择器：

   

       

   

   - 最近选择的区域显示了你最近为你的模板选择的颜色。- 当前使用区域显示您目前在模板的其他部分使用的颜色。

   

   要将颜色设置为透明，请单击无。

   

   单击保存。

   

   版式

   

   您可以在网上商店设置文本的字体样式和大小。

   

   自定义字体设置

   

   在 Shopify 后台，转到网店 > 模版。

   

   单击 **** 旁边的自定义。

   

   单击模板设置。

   

   单击 Typography（字体）。

   

   使用字体选择器单击更改每种类型的文本：

   

       

   

   浏览字体通过使用搜索字段或单击加载更多。

   

   如需查看所有可用字体，请参考 Shopify 字体库。

   

   单击要使用的字体名称。

   

   如果要将字体改为其他样式，如粗体或斜体，请单击 Regular(常规)。下一步，单击要使用的样式，然后单击选择。

   

       

   

   单击保存。

   

   购物车

   

   Boundless 允许您选择购物车类型，并为客户注明自定义购物车页面。

   

   Boundless 模板支持 2 购物车类型:

   

   当将商品添加到购物车中时，页面将重新定向您的购物车页面。

   

   将商品添加到购物车时，抽屉会在页面一侧打开抽屉，并提示用户前往结帐页面。

   

   提示:

   

   抽屉购物车是一种 AJAX 购物车类型，这意味着它可能会阻止脚本功能，比如允许客户选择送货日期的日期选择器。单击此处仔细研究 Shopify Ajax API。

   

   Boundless 还包括允许客户向您发送订单的特殊说明。

   

   若要在 Brooklyn购物车选项设置在 中，请执行以下操作:

   

   单击模板设置。

   

   单击购物车页面。

   

   从购物车类型列表中选择购物车类型。

   

   如果您希望客户在结账时提供订单备注，请选择 Enable order notes(启用订单备注)。

   

   单击保存。

   

   社交媒体

   

   您可以在产品和博客文章中添加社交共享按钮，并链接到您的社交媒体账户。

   

   自定义社交媒体设置

   

   在 Shopify 后台，转到网店 > 模版。

   

   查找 Boundless，然后单击自定义。

   

   单击模板设置。

   

   单击社交媒体。

   

   如需上传社交共享图片，请单击选择图片或浏览社交共享图片区域的免费图片。

   

   如果您想在您的社交媒体账户中添加链接，请在提供的字段中输入您的账户链接。请输入完整的链接，如 https://instagram.com/shopify 或 https://twitter.com/shopify。

   

   指向您的社交媒体账户的链接显示在您的体账户的链接。

   

   如果您想在产品和博客文章中添加社交共享按钮，请在 Sharing options选择任意或所有的复选框(共享选项)区域。

   

   可添加以下共享按钮：

   

   - 在 Facebook 上共享 - 在 Twitter 发推文 - 固定在 Pinterest 上(不能用于博客文章共享)

   

   单击保存。

   

   备注: 要在产品页面和博客文章上显示社交共享按钮，您还需要在这些页面的分区中启用这些按钮。

   

   网站图标

   

   你可以上传网站图标 (Favicon)， 可以显示在以下位置logo 帮您推广网店品牌：

   

   您的 Web 浏览器标签

   

   您的 Web 浏览器历史记录

   

   桌面上的图标

   

   位于您的在线商店名称旁边(加入书签后)。

   

   要上传网站图标，请执行以下操作:

   

   单击模板设置选项卡。

   

   单击网站图标。

   

   在 Favicon image(网站图标图片)区域，单击选择图片，然后执行以下操作之一:

   

   - 如果要选择已上传到 Shopify 后台图片，请单击库选项卡。- 若要从本地计算机选择图片，请单击库选项卡，然后单击加号按钮。

   

   提示: Boundless 建议大小为 32 x 32 像素。

   

   单击保存。

   

   结账

   

   在本部分，您可以定制商店的结账页面。单击此处了解商店结账页面的详细信息。

   

   在操作栏中设置子菜单

   

   如果在操作栏上创建链接到主页的菜单，菜单也会显示在主页上。这可能发生在为不存在的产品系列设置菜单时，因此应改为创建指向主页的占位符链接。

   

   在为操作栏创建产品系列链接之前，应创建产品系列。或者，在创建要链接的产品系列之前，您可以链接到所有产品页面。（资料来源：Shopify）

   

   以上内容属于作者个人观点，不代表跨境网的立场！如有侵权，请联系我们。

   相关推荐:Shopify Brooklyn模板固定分区：标头和页脚介绍