对内容使用富文本编辑器

您可以使用Shopify的富文本编辑器来对您在线商店上显示的内容进行格式和样式设置。

使用富文本编辑器的位置

您可以使用富文本编辑器来添加或编辑您商店上多个位置中的文本:

如果您使用的是欧宝体育官网入口首页网上商店2.0模板,则可以使用模板编辑器向页面或模板中添加富文本分区

使用富文本编辑器添加HTML

可以使用富文本编辑器为您的博客文章,页面,产品描述和产品系列描述输入HTML内容。

点击显示HTML按钮在富文本编辑器中查看内容的HTML代码。

在HTML视图中,您可以在富文本编辑器中对内容进行许多更改。您可以使用HTML添加图片,视频或表格,还可以调试或微调布局和内容样式。

嵌入媒体小组件

如果您要嵌入视频或音乐小组件,那么您首先需要将小组件托管在YouTubeVimeo一夜等服务上。这些服务会生成嵌入代码,您可将该代码复制并粘贴到Shopify后台的富文本编辑器中。

步骤:

  1. 找到您想嵌入的媒体文件的嵌入代码

  2. 点击嵌入代码并按ctrl+一个(PC)或命令+一个(Mac)来选择整个嵌入代码。

  3. 通过按ctrl+C(PC)或命令+C(Mac)以复制嵌入代码。

  4. 在Shopify后台中,点击富文本编辑器上的显示HTML按钮以查看您正在编辑的内容。

  5. 通过按ctrl+V(PC)或命令+V(Mac)粘贴嵌入代码。

  6. 单击保存

使用富文本编辑器设置文本格式

通过格式设置按钮,您可以快速创建段落、标题或块引用。使用正确的格式设置和标题级别有助于他人和搜索引擎阅读您的网站内容。

若要为文本选择格式,请突出显示此文本,然后点击格式设置按钮。

格式设置选项

  • 段落

  • 标题 (1-6)

  • 块引用

粗体文本

若要将文本设置为粗体,请突出显示文本并点击粗体按钮。

斜体文本

若要将文本设置为斜体,请突出显示文本并点击斜体按钮。

为文本添加下划线

若要给文本添加下划线,请突出显示文本并点击下划线按钮。

创建项目符号列表

若要创建项目符号列表,请点击项目符号列表按钮。

可通过键入创建第一个项目符号列表项。若要创建新的列表项,请按输入返回键。若要结束使用列表,请按输入返回键两次。

创建编号列表

若要创建编号列表,请点击编号列表按钮。

可通过键入创建第一个编号列表项。若要创建新的列表项,请按输入返回键。若要结束使用列表,请按输入返回键两次。

缩进文本

缩进段落会在段落左侧产生边距若要缩进段落,请点击缩进按钮。

取消缩进文本

取消缩进段落会删除它任何已缩进的边距。若要取消缩进或“向左缩进”段落,请点击向左缩进按钮。

对齐文本

若要对齐文本,请选择文本,点击对齐方式按钮,然后选择左对齐居中对齐右对齐

使用富文本编辑器更改文本颜色

步骤:

  1. 突出显示文本,然后点击颜色按钮。

  2. 点击一种颜色或输入十六进制代码,即可将突出显示的文本更改为这种颜色。

更改文本背景色

步骤:

  1. 突出显示文本,然后点击颜色按钮。

  2. 点击背景选项卡。

  3. 点击一种颜色或输入十六进制代码,将突出显示的文本的背景更改为这种颜色。

在富文本编辑器中清除格式

若要从文本或图片中删除格式设置,请突出显示内容,然后点击清除格式按钮。

使用富文本编辑器插入表格

可以使用富文本编辑器在您的博客文章、页面、产品描述和产品系列描述中插入表格。创建表格之后,您可以将文本、图片,甚至是视频放入表格中。

步骤:

  1. 在富文本编辑器中,点击插入表格按钮。

  2. 点击插入表格以插入表格。这将创建包含一行和一列的表格。

创建表格后,再次点击插入表格按钮以修改表格的行和列:

  • 在上方插入行:将光标放在一行中,然后点击此按钮在上方插入一个新行。
  • 在下方插入行:将光标放在行中,然后点击此按钮在下方插入一个新行。
  • 在之前插入列:将光标放在列中,然后单击此按钮在此列之前插入一个新列。
  • 在之后插入列:将光标放在一列中,然后单击此按钮在该列之后插入一个新列。
  • 删除行:将光标放在要删除的行中,然后点击此按钮。
  • 删除列:将光标放在要删除的列中,然后单击此按钮。
  • 删除表格:将光标置于表格中的任意位置,然后单击此按钮以删除整个表格。

使用富文本编辑器插入链接

您可以使用富文本编辑器在博客文章、页面、产品描述和产品系列描述中插入链接(超链接)。您可以添加将客户引导至您Shopify在线商店中的页面以及其他网站的链接。还可以添加打开电子邮件或拨打电话的链接以帮助客户与您联系。

步骤:

  1. 突出显示您要转变为链接的文本或图片。
  2. 点击插入链接

  3. 链接到字段中输入此链接的目标网址:

  4. 链接标题框中输入链接的简短描述。

  5. 使用打开此链接(在其中打开此链接)菜单选择打开链接的方式:

  6. 点击插入链接将突出显示的文本转换为链接。

使用富文本编辑器添加内部和外部链接

指向您Shopify商店中的页面的链接称为内部链接。您可以使用短url来创建内部链接。例如,url/集合将指向您商店的产品系列页面。

若要链接到您在线商店的特定页面(例如产品系列或产品页面),请使用url格式/分页类型/ page-handle。例如、若要链接到您创建的名为“夏季精选”的产品系列、请使用网址/收藏/夏季系列

指向您Shopify商店外部网站的链接称为外部链接。需要输入完整的外部链接,并且以http://开头。

链接到页面内容中的文件

上传文件后,您可以将此文件链接到富文本编辑器中的内容,从而在产品或产品系列描述、网页或博客文章中提供下载。

步骤:

  1. 复制要链接的文件的url。

  2. 在Shopify后台,点击要在其中添加文件的产品,产品系列,网页或博客文章。

  3. 在富文本编辑器中,输入或选择链接文本。

  4. 选择链接文本。

  5. 点击插入链接

  6. 链接到字段中,粘贴您要链接的文件的网址。

备注:url需要以http://cdn.shopify.com/开头。如果看到http://static.shopify.com,请将它替换为http://cdn.shopify.com

  1. 单击插入链接。在富文本编辑器中,链接的文本显示为蓝色,并带有下划线。

使用富文本编辑器插入图片

使用富文本编辑器插入图片的方法分为三种。您可以:

上传图片

步骤:

  1. 在富文本编辑器中,点击插入图片按钮。

  2. 插入图片对话框中,点击已上传的图片选项卡。

  3. 点击上传文件

  4. 在您的计算机中选择jpeg或PNG图片文件。

  5. 点击上传的图片以选中它。

  6. 插入的大小(插入尺寸)菜单中,选择图片的显示尺寸。可以选择原始(原始尺寸)在不更改显示尺寸的情况下插入图片。

  7. 点击插入图片,将图片放入富文本编辑器中。

从产品图片中进行选择

步骤:

  1. 在富文本编辑器中,点击插入图片按钮。

  2. 插入图片对话框中,点击产品图片选项卡。

  3. 点击您要插入的图片。

  4. 插入的大小(插入尺寸)菜单中,选择图片的显示尺寸。可以选择原始(原始尺寸)在不更改显示尺寸的情况下插入图片。

  5. 点击插入图片将产品图片放入富文本编辑器。

使用图片url

若要使用公共url插入图片,请执行以下操作:

  1. 在富文本编辑器中,点击插入图片按钮。

  2. 插入图片对话框中,点击URL选项卡。

  3. 输入图片文件的可公开访问url。

  4. 点击插入图片,在富文本编辑器中插入原始大小的图片。

在富文本编辑器中移动图片并调整大小

在将图片添加到产品描述、产品系列描述、网页或博客后,您可以将它移动到内容中的其他地点。

步骤:

  1. 在Shopify后台中,点击包含要移动或要对大小进行调整的图片的产品,产品系列,网页或博客文章。

  2. 在富文本编辑器中,点击图片。

  3. 执行以下任一操作:

  4. 单击保存

在富文本编辑器中编辑图片

您可以在富文本编辑器中更改图片的大小、文本环绕方式以及对齐方式。您还可以编辑图片url,或者添加或编辑图片替换文本。

步骤:

  1. 在富文本编辑器中双击图片,打开编辑图片对话框。
  2. 使用大小和对齐方式选项来编辑图片:

    • 若要更改图片的大小,请选择一个尺寸选项。
    • 若要更改图请,请使用新的图片网址。
    • 若要改善您在线商店的seo和可访问性,请添加或编辑图片替代文本。
    • 若要添加间距,请输入每侧所需留出的间距像素数。
    • 若要更改图片的对齐方式,请从代表左对齐、居中对齐或右对齐的图标中进行选择。
    • 若要添加文字环绕方式,请选中将文本环绕在图像周围(文字环绕图片)。
  3. 点击编辑图片以保存更改。

使用富文本编辑器插入视频

您可以使用富文本编辑器在博客文章、页面、产品描述和产品系列描述中插入或嵌入视频。

如果您想嵌入已创建的视频,需要先将视频上传到视频流网站,例如YouTubeVimeo

YouTube不允许禁用相关视频,但您可以指定相关视频应与刚才播放的视频来自同一频道。

步骤:

  1. 复制视频url(在PC上按ctrl+C,在Mac上按命令+C)。

  2. 访问嵌入感动地。嵌入响应工具可为您提供视频的改进嵌入代码。

  3. 在嵌入响应上,点击以选择视频所在的视频网站。

  4. 将您复制的视频URL粘贴至嵌入响应上的页面的URL(页面url)框中(在PC上按ctrl+V,在Mac上按命令+V)。

  5. 单击嵌入。嵌入响应将为您创建嵌入代码。

  6. 如果视频来自YouTube并且您只想显示来自同一YouTube频道中的相关视频,请在嵌入代码中找到视频的URL。将? rel = 0复制并粘贴到引号内的末尾。

  7. 复制嵌入代码框内的所有代码。

  8. 在Shopify后台中,点击富文本编辑器中的插入视频按钮。

  9. 将嵌入代码粘贴插入视频对话框中的框内。

  10. 点击插入视频

  11. 完成后点击保存将更改保存到正在编辑的项目。

使用富文本编辑器插入音频文件

您可以使用富文本编辑器在博客文章、页面、产品描述和产品系列描述中插入或嵌入音频文件。

步骤:

  1. 在Shopify后台,点击设置,然后点击文件

  2. 点击上传文件,上传要在商店中插入或嵌入的音频文件。

  3. 在线商店部分中,为想包含该音频文件的页面或博客文章打开富文本编辑器。

  4. 复制

    ,然后将代码粘贴在富文本编辑器中,以在您的页面上嵌入音频播放器。

  5. 复制以下代码:

  6. 单击保存

  7. 点击查看以确保您的音频文件可正常播放。

在富文本编辑器中添加或删除内部注释

您可以对不想发布到商店的内部文本使用注释标记< !---->

步骤:

  1. 在富文本编辑器中,点击显示HTML按钮。

  2. 若要添加内部注释,请将要隐藏的文本括在< !---->之中。例如:< !--yourtext-->

  3. 单击保存

包含在注释标记中的HTML标记将另存为内部文本。为了使这些HTML标记正常工作,您需要删除其两边的注释标记< !---->

准备好开始使用Shopify进行销售了吗?

免费试用