配色方案

通过模板中的所有分区(例如富文本、图片横幅和产品系列列表),您可以从您在模板设置中设置的颜色中选择要应用于相关分区的配色方案。您的模板会应用默认配色方案,而配色方案可随时在模板编辑器中进行更改。添加品牌颜色可确保您的在线商店应用一致的调色板。

颜色设置

图片和图片填充的背景可在模板编辑器中设置。使用下拉菜单即可在以下颜色中进行选择:强调色 1、强调色 1 渐变、强调色 2、强调色 2 渐变、背景 1、背景 1 渐变、背景 2、背景 2 渐变或反转色。您可以在模板编辑器的预览面板中预览选定的配色方案。

设置描述
文本颜色可以应用于分区或块文本。
强调色 1颜色可应用于 impact 按钮和某些分区的背景。
强调色 1 渐变选择预设的渐变,或使用渐变选择器来自定义主题色渐变。
强调色 2颜色可应用于 impact 按钮和某些分区的背景。
强调色 2 渐变选择预设的渐变,或使用渐变选择器来自定义主题色渐变。
背景 1颜色可应用于 impact 按钮和某些分区的背景。
背景 1 渐变使用预设的渐变,或使用渐变选择器来自定义背景色渐变。
背景 2颜色可应用于 impact 按钮和某些分区的背景。
背景 2 渐变使用预设的渐变,或使用渐变选择器来自定义背景色渐变。
反转色颜色可应用于 impact 按钮和某些分区的背景。使用背景 1 作为文本颜色,并将文本颜色用作背颜色

某些设置不仅可用于选择配色方案,还可支持使用渐变。例如,在 Dawn 中,您可以设置品牌颜色的渐变,并用它取代标准主题色和背景色选项。

管理配色方案

您的商店配色方案在您的模板设置中完成设置。

PC:

  1. Shopify 后台中,转到在线商店 > 模板

  2. 找到您要编辑的模板,然后点击自定义

  1. 点击侧边栏底部的模板设置

  2. 点击颜色

  3. 若要更改模板中的颜色,请点击颜色并使用颜色选择器或在文本字段中输入新颜色的值。

  4. 点击保存

对于纯色,请使用颜色选择器选择新颜色,或在文本字段中输入该颜色的值。该字段接受颜色名称 (例如 redblackblue)、RGB 或十六进制颜色值。

苹果系统:

  1. 在 Shopify 应用中,轻触商店

  2. 销售渠道部分,轻触在线商店

  3. 轻触管理模板

  4. 找到您要编辑的模板,然后轻触自定义

  5. 轻触编辑

  1. 点击侧边栏底部的模板设置

  2. 点击颜色

  3. 若要更改模板中的颜色,请点击颜色并使用颜色选择器或在文本字段中输入新颜色的值。

  4. 点击保存

对于纯色,请使用颜色选择器选择新颜色,或在文本字段中输入该颜色的值。该字段接受颜色名称 (例如 redblackblue)、RGB 或十六进制颜色值。

安卓系统:

  1. 在 Shopify 应用中,轻触商店

  2. 销售渠道部分,轻触在线商店

  3. 轻触管理模板

  4. 找到您要编辑的模板,然后轻触自定义

  5. 轻触编辑

  1. 点击侧边栏底部的模板设置

  2. 点击颜色

  3. 若要更改模板中的颜色,请点击颜色并使用颜色选择器或在文本字段中输入新颜色的值。

  4. 点击保存

对于纯色,请使用颜色选择器选择新颜色,或在文本字段中输入该颜色的值。该字段接受颜色名称 (例如 redblackblue)、RGB 或十六进制颜色值。

Shopify商户官网原文详情:

Color schemes

Different sections across the theme, such as Rich text, Image banner, and Collection list, let you select a color scheme to apply to that section from the colors you set in your theme settings. Your theme has a default color scheme applied, which can be changed at any time in the theme editor. Adding your brand colors ensures a cohesive application of your color palette across your online store.

Color settings

The background of images and image padding can be set in your theme editor. Use the drop-down menu to choose between Accent 1, Accent 1 gradient, Accent 2, Accent 2 gradient, Background 1, Background 1 gradient, Background 2, Background 2 gradient, or Inverse. You can preview selected color schemes in your theme editor's preview panel.

SettingDescription
TextColor can be applied to section or block text.
Accent 1Color can be applied to impact buttons and the backgrounds of some sections.
Accent 1 gradientSelect a preset gradient, or use the gradient picker to customize your accent gradient.
Accent 2Color can be applied to impact buttons and the backgrounds of some sections.
Accent 2 gradientSelect a preset gradient, or use the gradient picker to customize your accent gradient.
Background 1Color can be applied to impact buttons and the backgrounds of some sections.
Background 1 gradientSelect a preset gradient, or use the gradient picker to customize your background gradient.
Background 2Color can be applied to impact buttons and the backgrounds of some sections.
Background 2 gradientSelect a preset gradient, or use the gradient picker to customize your background gradient.
InverseColor can be applied to impact buttons and the backgrounds of some sections. Uses Background 1 as the text color, and the text color as the background color

Some of the settings that allow you to choose a color scheme also allow you to use gradients. For example, in Dawn, you can set up gradients of your brand's colors and use them in place of the standard accent and background color options.

Manage your color scheme

Your store's color scheme is set within your theme settings.

PC:

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme that you want to edit, and then click Customize.

  1. Click Theme Settings at the bottom of your sidebar.

  2. Click Colors.

  3. To change a color in your theme, click the color and use the color picker or enter the value of the new color in the text field.

  4. Click Save.

For solid colors, use the color picker to select a new color or enter the value of the color in the text field. The field accepts color names (for example, redblackblue), RGB, or hexadecimal color values.

iPhone:

  1. From the Shopify app, tap Store.

  2. In the Sales channels section, tap Online Store.

  3. Tap Manage themes.

  4. Find the theme that you want to edit, and then tap Customize.

  5. Tap Edit.

  1. Click Theme Settings at the bottom of your sidebar.

  2. Click Colors.

  3. To change a color in your theme, click the color and use the color picker or enter the value of the new color in the text field.

  4. Click Save.

For solid colors, use the color picker to select a new color or enter the value of the color in the text field. The field accepts color names (for example, redblackblue), RGB, or hexadecimal color values.

Android:

  1. From the Shopify app, tap Store.

  2. In the Sales channels section, tap Online Store.

  3. Tap Manage themes.

  4. Find the theme that you want to edit, and then tap Customize.

  5. Tap Edit.

  1. Click Theme Settings at the bottom of your sidebar.

  2. Click Colors.

  3. To change a color in your theme, click the color and use the color picker or enter the value of the new color in the text field.

  4. Click Save.

For solid colors, use the color picker to select a new color or enter the value of the color in the text field. The field accepts color names (for example, redblackblue), RGB, or hexadecimal color values.

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