产品查看更多元素

什么是“产品查看更多”元素？

此 产品查看更多元素 GemPages 中有一个动态按钮，可将访问者重定向到产品详细信息页面。

它通常用于 产品列表 or 购物 部分，其中显示多种产品，仅包含图像和标题等基本信息。

通过添加“查看更多产品”按钮，您可以为购物者提供一种清晰的方式来查看产品的全部详细信息，鼓励更深入的探索并增加购买的可能性。

例如，想象一下一个展示产品的产品网格。每个产品卡可能只显示图片、标题和价格。通过添加“查看更多产品”按钮，客户可以点击直接访问完整的产品详情页面。

如何将产品查看更多元素添加到您的页面？

请按照以下步骤将其添加到您的页面：

第三步：  使用搜索栏找到该元素，然后将其拖放到所需位置。

例如，如果您正在构建一个产品系列页面，则可以将按钮放在每个产品卡下方。 产品列表.

第三步： 添加后，单击“查看更多产品”按钮打开其 设定面板 您将看到两个可用的选项卡： 个人设置 以及 先进的.

配置设置选项卡

1. 产品来源

显示元素正在显示哪个产品的信息。

按钮将自动从您的 Shopify 管理员。确保您的 Shopify 商店中已经设置了必要的产品信息（标题、描述、价格等）。

2. 尺寸

您可以调整 宽度, 高度和 填充 按钮的大小。这些值以像素为单位定义，用于控制按钮的大小或紧凑程度。

3。 背景

选择一个 颜色 和 图片背景 用于按钮。 

4. 形状

此部分控制按钮的整体样式：

• 边境：定义边框粗细和样式。
• 角落：调整角半径。
• 阴影：使用按钮阴影添加深度。

5. 图标

您可以为按钮添加图标或仅保留文本。 

如果您选择添加一个：

• 图标：从 GemPages 的内置图标中选择或上传您自己的自定义图标。
• 职务：决定图标出现在文本的左侧还是右侧。
• 间隙：调整文本与图标之间的间距。您可以手动设置值或使用滑块。

6. 文本

在下面 文本 部分，将其切换为 ON 以展开全文的配置，包括：

• 样式：从编辑器中预定义的六种标题样式或三种段落样式中进行选择。
• 字体：从库中选择字体或 上传您自己的自定义字体.
• 尺寸：设置字体大小（以像素为单位）。
• 颜色：选择与您的设计相匹配的文本颜色。
• 字体粗细：调整文本的粗体显示方式。
• 线高：定义文本行之间的垂直间距。
• 字母间距：调整各个字母之间的间距。
• 改造：应用文本转换，例如大写、小写或首字母大写。
• 阴影：为文本添加阴影以强调。

7.效果

• Hover：定义鼠标悬停时按钮的变化方式。您可以调整悬停效果的背景颜色、文本颜色、边框、边角和阴影。

8. 重定向至

• 新标签页：选择产品详细信息页面是否在新浏览器选项卡中打开（是）或当前选项卡（没有).

9. 对齐

将按钮与其容器对齐。您可以将其放置在 左, 中心 或 右.

配置高级选项卡

如需更多高级自定义，请导航至“高级”选项卡并按照 本文.