在 OS 3.0 主题中配置自定义页面封面 – SHOPLINE 常见问题

为了提升店铺搜索结果的视觉吸引力并保持品牌一致性，SHOPLINE 现已支持为自定义页面设置 自定义页面封面。通过为自定义页面设置独特的封面图，您可以确保封面图在预测搜索和搜索结果页中脱颖而出，从而提高顾客的参与度。

本文将引导您了解如何在管理后台设置自定义页面封面，并将其显示在您的在线商店中。

自定义页面封面的功能特点

自定义页面封面为您管理页面让在线商店不同板块中的视觉呈现提供了一种灵活的方式。利用此功能可确保您的自定义内容在搜索结果和页面布局中均能得到专业的展示。

提升搜索体验： 当顾客搜索与自定义页面相关的关键词时，自定义页面封面将出现在预测搜索下拉列表和主搜索结果中。
视觉一致性： 顾客将看到直观的视觉引导而非仅是文本链接，使您的自定义内容（如：画册、关于我们或促销页面）更符合品牌美学。
SEO 与无障碍优化： 包含专门的 ALT 属性字段，帮助搜索引擎理解您的图片内容，提升店铺的整体 SEO 排名。

注意： 有关如何针对搜索引擎优化图片的更多信息，请参阅《在文件库中为图片添加 ALT 属性》。

配置自定义页面封面共有两种方式。您可以选择在页面管理设置中设定全局封面，也可以直接在 OS 3.0 主题编辑器中进行个性化配置。

方法一：从自定义页面设置中设置

此方法设置的封面将作为搜索结果以及所有主题区块的默认「来源」。

在 SHOPLINE 管理后台，前往 在线商店 > 自定义页面。点击创建页面按钮以开始新页面，或点击您想要编辑的现有 自定义页面 标题。
在右侧边栏中，找到 自定义页面封面 区域。
点击从您的设备上传图片，或从 文件库 中选择图片。
- 选择图片后，您可以点击眼睛图标预览封面的显示效果。
上传完成后，您可以将鼠标悬停在图片上进行管理：
- 更改：将当前图片更换为其他图片。
- 删除：从页面中移除图片（将出现确认弹窗）。
- ALT：可以至 文件库 输入用于 SEO 和无障碍访问的替代文本。
  
  注意： 有关如何针对搜索引擎优化图片的更多信息，请参阅《在文件库中为图片添加 ALT 属性》。

方法二：从 OS 3.0 主题编辑器设置

此方法允许您在设计店铺布局时上传或覆盖封面，并支持为桌面端和移动端设置不同的图片。

前往在线商店 > 店铺设计 > 我的主题。选择一个兼容的 OS 3.0 主题（例如：Fashion）并点击设计进入编辑器。
在主题编辑器中，导航至您想要显示自定义页面的任意页面（例如：首页）。在左侧侧边栏中，点击 + 添加组件 并选择 自定义页面 section。
在自定义页面 section下，点击 封面图 block。您可以在右侧设置面板中分别为以下项上传或选择图片：
- 桌面端封面： 在大屏幕设备上显示的图片。
- 移动端封面： 专门为移动端竖屏优化的图片。
  
  注意： 在 封面图 block 上传新图片仅会影响当前 自定义页面 section，不会同步更新或覆盖在自定义页面设置中设定的封面图。
点击保存以应用更改。

为确保最佳性能和 SEO 收录，请留意以下技术要求及主题限制。

图片要求：
- 支持格式：JPG 和 PNG。
- 文件大小：需在 4MB 以内。
- 建议尺寸：1200px x 1600px。
主题可用性：目前所有 OS 3.0 主题包含内置的 封面图 block 支持，Bottle 主题除外。
数据共享与显示逻辑：
- 全局数据共享：在 自定义页面设置 中设定的封面图存储于页面核心数据中。这意味着即使您在不同的 OS 3.0 主题之间切换，该图片也会自动同步并保持可用。
- Section 特定覆盖：如果您直接在主题编辑器 自定义页面 section 中上传了特定的封面图，该图片将与该主题的配置绑定。如果您更换了主题，则需要在新主题的编辑器中为该模块重新选择或上传图片。
开发者自定义： 对于其他 OS 3.0 主题（如 Bottle）或自定义主题，开发者可以通过调用 featured_image Sline 对象手动显示此图片。该对象包含 alt、src、height 和 width 属性。
搜索收录： 这些页面的自定义 URL 也会被收录，这意味着在 URL 中找到的关键词也可以触发搜索结果中封面图的显示。