产品系列列表

您可以添加要突出显示的产品系列列表。您最多可以向产品系列列表中添加 16 个产品系列块。

分区设置

设置描述
标题分区的标题
图片比产品系列的配图的图片比:
  • 适应图片 - 使用图片的纵横比。这可以防止图片被裁剪。

  • 纵向 - 将图片裁剪为使用 2:3 比例。

  • 方形(默认) - 将图片裁剪为使用 1:1 比例。

配色方案产品系列列表分区的背景色。可在“强调色 1”、“强调色 2”、“背景 1”、“背景 2”或“反转色”之间选择。
在移动设备上启用滑动功能将移动设备上的显示方式从列更改为行,使客户可以横向滑动以查看更多产品系列块。
如果列表中的产品系列未全部显示,请启用“查看全部”按钮显示"查看全部"按钮,将客户带至产品系列的完整列表。
分区填充将间距添加到收集列表的顶部或底部。使用范围滑块在产品系列分区上方或下方添加 0px 到 100px 之间的空间。

选择产品系列

  1. 在模板编辑器中,点击要向其添加产品系列的产品系列块。

  2. 点击选择产品系列

  3. 点击一个产品系列,然后点击选择

联系表

您的联系表会将所有提交发送到您商店的发件人邮箱。您可以在 Shopify 后台的商店详细信息设置页面中更改发件人邮箱。

该表单具有以下字段:

  • 名称

  • 邮箱(必填)

  • 电话号码

  • 评论

分区设置

设置描述
标题分区的标题
配色方案联系表分区的背景颜色。在“主题色 1”、“主题色 2”、“背景色 1”、“背景色 2”或“反转色”之间选择。
分区填充将间距添加到联系表的顶部或底部。使用范围滑块在联系表分区上方或下方添加 0px 到 100px 之间的空间。

自定义 Liquid

您可以添加自己的 Liquid 代码以创建自定义分区。

  • 添加已下载应用的说明中提供的应用代码片段,以轻松地将应用引入您的页面。

  • 直接在编辑器中添加自定义 Liquid 代码。

分区设置

设置描述
自定义 Liquid添加应用代码片段或其他自定义 Liquid 代码以创建高级自定义。
配色方案联系表分区的背景颜色。在“主题色 1”、“主题色 2”、“背景色 1”、“背景色 2”或“反转色”之间选择。
分区填充将间距添加到自定义 Liquid 分区的顶部或底部。使用范围滑块在自定义 Liquid 分区上方或下方添加 0px 到 100px 之间的空间。

电子邮件注册横幅

您可以在密码页面添加分区,客户可在其中输入其邮箱以在您的商店开业时收到通知。每个电子邮件订阅都会创建一个客户账户。

该分区附带三个默认块:

  • 标题

  • 副标题

  • 电子邮件表单

分区设置

设置描述
背景图片电子邮件注册横幅的背景图片。点击更改可替换或删除图片。删除图片后,将显示模板随附的图片。取消选中显示背景图片复选框可隐藏此图片。
编辑替代文本点击后可设置用于搜索引擎优化的图片替换文本,还可用于为使用屏幕阅读器的客户描述图片。
图片叠加不透明度利用叠加使电子邮件注册横幅图片变暗。使用滑块设置叠加的不透明度。默认为 0%。
显示背景图片选中此框可在电子邮件注册横幅上显示背景图片。
横幅高度

使用下拉菜单设置电子邮件注册横幅图片的高度。可在“适应图片”、“小”、“中”(默认)或“大”之间选择。

台式设备内容位置设置台式电脑上电子邮件注册横幅的位置。可在“顶部”、“中间”或“底部”以及“右”、“左”或“居中”之间选择。“中间居中”是默认选项。


在台式设备中,文本框会覆盖部分图片。在移动设备上,文本框在图片下方显示。

在台式设备上显示容器对于使用台式电脑进行购物的客户,将电子邮件注册横幅图片文本放置在图片上方的文本框中。
台式设备内容对齐方式设置台式电脑上的图片横幅文本的对齐方式。可选择右对齐、左对齐或居中(默认)。
配色方案电子邮件注册横幅分区的背景颜色。在“主题色 1”、“主题色 2”、“背景色 1”、“背景色 2”或“反转色”之间选择。


在台式设备上,只有选中在台式设备上显示容器选项时,所选配色方案才可见。在移动设备上,只有选中在移动设备上的图片下方显示内容时,所选配色方案才可见。

移动设备内容对齐方式设置移动设备上的图片横幅文本的对齐方式。可选择右对齐、左对齐或居中(默认)。
在移动设备上的图片下方显示内容在移动设备上,内容将显示在电子邮件注册横幅图片下方。

标题块

设置描述
标题分区的标题。

副标题块

设置描述
描述分区的描述。
文本样式更改电子邮件注册分区中的文本样式。可在“正文”(默认)和“副标题”中进行选择。

电子邮件注册信息

您可以添加一个分区,供客户在其中输入他们的邮箱并订阅您的新闻通讯或营销信息。当客户订阅时,系统会在您 Shopify 的后台中创建客户账户。

该分区附带三个默认块:

  • 标题

  • 副标题

  • 电子邮件表单

分区设置

设置描述
配色方案电子邮件注册信息分区的背景色。可在“强调色 1”、“强调色 2”、“背景 1”、“背景 2”或“反转色”之间选择。
使分区展示全宽使分区按浏览器窗口的全宽显示。

标题块

设置描述
标题分区的标题。

副标题块

设置描述
描述分区的描述。

电子邮件表单

电子邮件表单块会显示一个字段,客户可在其中输入电子邮箱地址来注册接收您的营销信息。此块没有可自定义设置。

特色产品

您可以添加包含特定产品的分区。

分区设置

设置描述
产品您希望在分区中作为特色产品显示的产品。
配色方案选择特色产品的配色方案。
显示辅助背景在辅助背景色上显示特色产品。
隐藏其他多种媒体文件选择此选项以在选择多选项后隐藏其他多变种的媒体文件。
启用视频循环允许视频再次播放。客户必须点击才能开始重新播放。
分区填充将间距添加到特色产品分区的顶部或底部。使用范围滑块将 0px 到 100px 的空间添加到分区的顶部或底部。


分区块

您可以在特色产品分区中添加以下块。

设置
文本输入用于特色产品的文本:
  • 文本:接受文本或动态源。

  • 文本样式:在正文副标题大写之间切换。

标题此块没有可自定义设置。
价格此块没有可自定义设置。
多属性选择器在椭圆形框或下拉菜单之间选择。
数量选择器此块没有可自定义设置。
Buy Button选中显示动态结账按钮框,以显示在 Payments 设置中启用的任何动态结账选项。
分享可供客户将产品分享到其社交媒体的可点击文本。
产品评分用星星图形显示平均产品评分,并在括号里注明评论次数,例如 ★★★★★ (8)。还需要产品评论应用(例如 Shopify Product Reviews)以及元字段定义(用于 reviews.rating_count和 reviews.rating)。
自定义 Liquid添加<a href="/manual/online-store/themes/extend/>自定义 Liquid 或 HTML 代码。
应用添加一个与 Online Store 2.0 兼容的应用。


特色产品系列

您可以添加一个分区,用于在一个产品系列中显示产品。

分区设置

设置描述
标题分区的标题。
收藏要在其中显示产品的产品系列。
要显示的最大产品数要在产品系列中显示的产品数量。必须是偶数。最小值:2。最大值:12。
配色方案特色产品系列分区的背景颜色。在“主题色 1”、“主题色 2”、“背景色 1”、“背景色 2”或“反转色”之间选择。
如果产品系列中的产品未全部显示,请启用“查看全部”按钮如果产品系列中的产品数超过了可显示的最大产品数字段中设置的值,此时会显示“查看全部”按钮,该按钮可将客户定向到产品系列页面。
在移动设备上启用滑动功能将移动设备上的显示方式从列更改为行,使客户可以横向滑动以查看更多产品。
图片比产品图片的图片比:
  • 适应图片 - 使用图片的纵横比。这可以防止图片被裁剪。

  • 纵向 - 将图片裁剪为使用 2:3 比例。

  • 方形 - 将图片裁剪为使用 1:1 比例。

在悬停时显示第二张图片在客户将光标悬停在产品图片上时,显示第二张产品图像(如果产品有第二张图片)。
显示厂商显示产品的厂商。
显示产品评分用星星图形显示平均产品评分,并在括号里注明评论次数,例如 ★★★★★ (8)。还需要产品评论应用(例如 Shopify Product Reviews)以及元字段定义(用于 reviews.rating_count和 reviews.rating)。
分区填充将间距添加到特色系列分区的顶部或底部。使用范围滑块在特色产品系列分区上方或下方添加 0px 到 100px 之间的空间。

Shopify商户官网原文详情:

Collection list

You can add a list of collections that you want to highlight. You can add up to 16 collection blocks to a collection list.

Section settings

SettingDescription
HeadingThe title of the section
Image ratioThe image ratio for the featured images of the collections:
  • Adapt to image - Uses the aspect ratio of the images. This prevents the images from being cropped.

  • Portrait - Crops the images to use a 2:3 ratio.

  • Square (default) - Crops the images to use a 1:1 ratio.

Color schemeThe background color of the collection list section. Choose between Accent 1, Accent 2, Background 1, Background 2, or Inverse.
Enable swipe on mobileChanges the mobile display from a column to a row, where customers can swipe sideways to see more collection blocks.
Enable "View all" button if list includes more collections than shownDisplays a "View all" button that takes the customers to the full list of collections.
Section paddingAdd spacing to the top or bottom of the collection list. Use the range slider to add between 0px and 100px of space above or below the collection section.

Choose collections

  1. From your theme editor, click the Collection block that you want to add a collection to.

  2. Click Select collection.

  3. Click a collection, and then click Select.

Contact form

Your contact form sends all submissions to your store's Sender email address. You can change the sender email address in the Store details settings page of your Shopify admin.

The form has the following fields:

  • Name

  • Email (required)

  • Phone number

  • Comment

Section settings

SettingDescription
HeadingThe title of the section
Color schemeThe background color of the contact form section. Select between Accent 1, Accent 2, Background 1, Background 2, or Inverse.
Section paddingAdd spacing to the top or bottom of the contact form. Use the range slider to add between 0px and 100px of space above or below the contact form section.

Custom Liquid

You can add your own Liquid code to create a custom section.

  • Add app snippets provided in the instructions from your downloaded apps to easily introduce apps to your pages.

  • Add custom Liquid code directly in the editor.

Section settings

SettingDescription
Custom LiquidAdd app snippets or other custom Liquid code to create advanced customizations.
Color schemeThe background color of the contact form section. Select between Accent 1, Accent 2, Background 1, Background 2, or Inverse.
Section paddingAdd spacing to the top or bottom of the custom Liquid section. Use the range slider to add between 0px and 100px of space above or below the custom Liquid section.

Email signup banner

You can add a section to your password page, where customers can enter their email address to be informed when your store is open. Each email subscription creates a customer account.

The section comes with three default blocks:

  • Heading

  • Subheading

  • Email form

Section settings

SettingDescription
Background imageThe background image for the email signup banner. Click Change to replace or remove the image. When the image is removed, the image that comes with the theme is shown. Hide this image by deselecting the Show background image checkbox.
Edit alt textClick to set image alt text for search engine optimization and to describe the image for customers using screen readers.
Image overlay opacityDims the email signup banner image with an overlay. Use the slider to set the opacity of the overlay. Defaults to 0%.
Show background imageCheck this box to display the background image on your email signup banner.
Banner height

Set the height of your email signup banner image using the drop-down menu. Choose between Adapt to Image, small, medium (default), or large.

Desktop content positionSet the position of the email signup banner for desktop computers. Choose between top, middle, or bottom, and right, left, or center. Middle center is the default option.


On desktop, the text box partially covers the image. On mobile, the text box displays below the image.

Show container on desktopPlaces your email signup banner image text in a text box over the image for customers shopping from a desktop computer.
Desktop content alignmentSet the alignment of the image banner text for desktop computers. Choose between right, left, or center (default).
Color schemeThe background color of the email signup banner section. Choose between Accent 1, Accent 2, Background 1 (default), Background 2, or Inverse.


On desktop, the color scheme selected is visible only when the Show container on desktop option is selected. On mobile, the color scheme selected is visible only when Show content below image on mobile is selected.

Mobile content alignmentSet the alignment of the image banner text for mobile devices. Choose between right, left, or center (default).
Show content below on mobileContent will appear below the email signup banner image on mobile devices.

Heading block

SettingDescription
HeadingThe title for the section.

Subheading block

SettingDescription
DescriptionThe description for the section.
Text styleChanges the style of text in the email signup section. Choose between Body (default) and Subtitle.

Email signup

You can add a section where customers can enter their email address and subscribe to your newsletter or marketing. When a customer subscribes, a customer account is created in your Shopify admin.

The section comes with three default blocks:

  • Heading

  • Subheading

  • Email form

Section settings

SettingDescription
Color schemeThe background color of the email signup section. Choose between Accent 1, Accent 2, Background 1, Background 2, or Inverse.
Make section full widthMakes the section the full width of the browser window.

Heading block

SettingDescription
HeadingThe title for the section.

Subheading block

SettingDescription
DescriptionThe description for the section.

Email form

The email form block displays a field where a customer can enter an email address to sign up to opt into your marketing materials. The block has no customizable settings.

Featured product

You can add a section that features a specific product.

Section settings


SettingDescription
ProductThe product that you want to feature in the section.
Color schemeSelect the color scheme of the featured product.
Show secondary backgroundDisplays the featured product on your secondary background color.
Hide other variants' mediaSelect this option to hide the media for other variants once a variant has been selected.
Enable video loopingAllows the video to be played again. Customers must click to start the replay.
Section paddingAdd spacing to the top or bottom of the featured product section. Use the range slider to add between 0px and 100px of space to the top or the bottom of the section.


Section blocks

You can add the following blocks in your Featured product section.

BlockSettings
TextEnter text for your featured product:
  • Text: Accepts text or dynamic source.

  • Text style: Choose between BodySubtitle, or Uppercase.


TitleThis block has no customizable settings.
PriceThis block has no customizable settings.
Variant pickerChoose between pills or a drop-down menu.
Quantity selectorThis block has no customizable settings.
Buy buttonsCheck the Show dynamic checkout buttons box to display any dynamic checkout options that you've enabled in your Payments settings.
ShareClickable text that allows customers to share the product to their social media.
Product ratingDisplays the average product rating in stars with the number of reviews in parenthesis, for example: ★★★★★ (8). Also requires a product review app such as Shopify Product Reviews, and metafield definitions for reviews.rating_count and reviews.rating.
Custom LiquidAdd AppsAdd an Online Store 2.0-compatible app.


Featured collection

You can add a section that displays products in one collection.

Section settings


SettingDescription
HeadingThe title of the section.
CollectionWhich collection you want to display products from.
Maximum products to showThe number of products from the collection to display. Must be an even number. Minimum: 2. Maximum: 12.
Color schemeThe background color of the featured collection section. Choose between Accent 1, Accent 2, Background 1, Background 2, or Inverse.
Enable "View all" button if collection has more products than shownIf the collection has more products than set in the Maximum products to show field, then this displays a "View all" button that takes the customers to the collections page.
Enable swipe on mobileChanges the mobile display from a column to a row, where customers can swipe sideways to see more products.
Image ratioThe image ratio for the product images:
  • Adapt to image - Uses the aspect ratio of the images. This prevents the images from being cropped.

  • Portrait - Crops the images to use a 2:3 ratio.

  • Square - Crops the images to use a 1:1 ratio.

Show second image on hoverWhen the customer hovers their cursor over the product image, displays the second product image if the product has one.
Show vendorDisplays the vendors of the products.
Show product ratingDisplays the average product rating in stars with the number of reviews in parenthesis, for example: ★★★★★ (8). Also requires a product review app such as Shopify Product Reviews, and metafield definitions for reviews.rating_count and reviews.rating.
Section paddingAdd spacing to the top or bottom of the featured collection section. Use the range slider to add between 0px and 100px of space above or below the featured collection section.

文章内容来源:Shopify商户官方网站


(本文内容根据网络资料整理,出于传递更多信息之目的,不代表连连国际赞同其观点和立场)