创建购买按钮

本页打印于2023年3月28日。当前版本请访问https://help.shopify.com/en/manual/online-sales-channels/buy-button/create-buy-button。

在你添加购买按钮销售渠道在你的Shopify管理，你可以创建一个购买按钮一个产品或一个集合．

创建“购买”按钮后，复制自动生成的代码，然后将代码添加到希望按钮出现的网页或博客文章中。例如，你可能想在你的Wordpress博客或Squarespace网站上添加“购买”按钮。

一旦您将“购买”按钮嵌入到您的网站上，它的外观就不能更改。如果要更改它，则必须在通道中创建一个新按钮，并用新代码替换原来的代码。

定制购买按钮

你可以自定义一个购买按钮的外观和它的行为:

  • 它的颜色
  • 它的大小
  • 它的字体
  • 单击按钮时发生的操作
  • 结帐是否在新的浏览器窗口中打开

自定义按钮时，可以预览所做的更改。您可以通过单击预览来测试Buy按钮的行为。

布局风格

你可以选择“购买”按钮的布局。

购买按钮的可用布局
基本 选择此布局可添加一个没有任何产品图像的购买按钮。如果你已经在网上其他地方展示了你的产品，你可能想这样做，但只是想添加一个按钮来进行购买。
经典 选择此布局可在“购买”按钮旁边显示产品图像和价格。这种布局对于快速的产品预览非常有用，比如在博客文章中。
全视图 选择此布局可在“购买”按钮旁边显示产品图像、价格和描述。这种布局模拟在线商店中的产品详细信息页面。欧宝体育官网入口首页

购买按钮动作

创建Buy Button时，可以选择单击按钮时发生的操作。

如果Buy按钮用于某个集合，则该操作将应用于该集合中的每个产品。

  • 将产品添加到购物车将产品添加到购物车中。顾客可以继续购物，并向购物车中添加其他产品。
  • 直接结帐将客户直接带到您的收银台，在那里他们可以购买产品。客户无法在订单中添加其他产品。

  • 公开产品细节显示一个查看产品按钮。当客户单击按钮时，他们可以看到产品的描述，选择任何可用的产品变体，并将产品添加到购物车中。如果一个产品有多个产品图像，那么这些也会显示。

    属性时，此选项不可用全视图布局，因为全视图布局已经显示了所有的产品细节。

您还可以选择是在新的浏览器窗口中打开结帐，还是在与您的网站相同的选项卡中打开结帐。默认的行为是签出在一个新窗口中打开。

购买按钮外观

  • 按钮样式包括“购买按钮”按钮部分的形状、颜色和排版。
  • 布局根据您选择的布局样式，您可以自定义设置，如按钮对齐、图像大小、按钮文本、字体、颜色和大小。

  • 购物车包括嵌入式购物车的文本和颜色选项。属性的标签也可以启用和自定义请注意顺序字段。您可以使用订单记录从客户那里收集关于如何准备和交付订单的特殊说明。的额外的信息Field允许您向客户传递消息。

    如果您选择了，则只能编辑购物车的设置将产品添加到购物车或公开产品细节当按钮行动．

  • 详细的弹出包括产品详细信息弹出窗口的设置。您可以自定义按钮的文本，是否显示数量字段，用于背景和标签的颜色，以及标签的字体和字体大小。如果您已选择，则只能编辑这些设置公开产品细节当按钮行动．

为单个产品创建一个购买按钮

您可以为单个产品创建一个购买按钮。“购买”按钮可以包含产品的一个或所有变体。在创建Buy Button时，您可以选择一个布局样式，并自定义按钮的颜色、文本和外观，以及客户单击按钮时发生的操作。了解更多定制购买按钮．

在为产品创建Buy Button之前，必须具备在你的Shopify管理中添加产品而且让它可用到购买按钮销售渠道。

步骤:

  1. 从你的Shopify管理员，点击设置>app和销售渠道．

  2. 从app和销售渠道页面,点击购买按钮．

  3. 点击打开销售渠道．

  4. 点击创建一个购买按钮．

  5. 点击产品购买按钮．

  6. 从目录中选择产品或使用搜索来查找产品。点击选择．

  7. 可选:自定义购买按钮。

    1. 如果您的产品有变体，请进行选择所有的变量或者选择您想要包含的变体。
    2. 选择一个布局风格和行动当客户点击按钮时，就会发生这种情况。你也可以自定义按钮的外观．
    3. 默认情况下，结帐行为将打开一个新窗口，但您可以选择在与您的网站相同的浏览器选项卡中打开结帐。点击高级设置>重定向到同一选项卡．

  8. 点击下一个．

  9. 点击复制代码．

  10. 打开要显示“购买”按钮的网页的HTML编辑器。指添加购买按钮代码的HTML．

  11. 将代码粘贴到希望出现Buy按钮的HTML中，然后保存更改。

  1. 从Shopify应用,挖掘商店．

  2. 在销售渠道节中,利用购买按钮．

  3. 点击创建一个购买按钮．

  4. 点击产品购买按钮．

  5. 从目录中选择产品或使用搜索来查找产品。点击选择．

  6. 可选:点击定制．

    1. 如果您的产品有多个变体，那么请进行选择所有的变量或者从下拉列表中选择。
    2. 选择一个布局风格和行动当客户点击按钮时，就会发生这种情况。你也可以自定义按钮的外观．
    3. 默认情况下，结帐行为将打开一个新窗口，但您可以选择在与您的网站相同的浏览器选项卡中打开结帐。点击高级设置>重定向到同一选项卡．

  7. 点击完成．

  8. 点击复制代码．

  9. 打开要显示“购买”按钮的网页的HTML编辑器。指添加购买按钮代码的HTML．

  10. 将代码粘贴到希望出现Buy按钮的HTML中，然后保存更改。

  1. 从Shopify应用,挖掘商店．

  2. 在销售渠道节中,利用购买按钮．

  3. 点击创建一个购买按钮．

  4. 点击产品购买按钮．

  5. 从目录中选择产品或使用搜索来查找产品。点击选择．

  6. 可选:点击定制．

    1. 如果您的产品有多个变体，那么请进行选择所有的变量或者从下拉列表中选择。
    2. 选择一个布局风格和行动当客户点击按钮时，就会发生这种情况。你也可以自定义按钮的外观．
    3. 默认情况下，结帐行为将打开一个新窗口，但您可以选择在与您的网站相同的浏览器选项卡中打开结帐。点击高级设置>重定向到同一选项卡．

  7. 点击完成．

  8. 点击复制代码．

  9. 打开要显示“购买”按钮的网页的HTML编辑器。指添加购买按钮代码的HTML．

  10. 将代码粘贴到希望出现Buy按钮的HTML中，然后保存更改。

为收藏创建一个购买按钮

为集合创建Buy Button时，实际上是在为集合中的每个产品创建一个按钮。

在创建Buy Button时，您可以选择一个布局样式，并自定义按钮的颜色、文本和外观，以及客户单击按钮时发生的操作。了解更多定制购买按钮．

在你创建一个购买按钮集合之前，你必须有:

步骤:

  1. 从你的Shopify管理员，点击设置>app和销售渠道．

  2. 从app和销售渠道页面,点击购买按钮．

  3. 点击打开销售渠道．

  4. 点击创建一个购买按钮．

  5. 点击收藏购买按钮．

  6. 选择集合或使用搜索来查找集合。点击选择．

  7. 可选:自定义购买按钮。

    1. 选择行动当客户点击按钮时，就会发生这种情况。你也可以自定义按钮的外观．
    2. 默认情况下，结帐行为将打开一个新窗口，但您可以选择在与您的网站相同的浏览器选项卡中打开结帐。点击高级设置>重定向到同一选项卡．

  8. 点击下一个．

  9. 点击复制代码．

  10. 打开要显示“购买”按钮的网页的HTML编辑器。指添加购买按钮代码的HTML．

  11. 将代码粘贴到希望出现Buy按钮的HTML中，然后保存更改。

  1. 从Shopify应用,挖掘商店．

  2. 在销售渠道节中,利用购买按钮．

  3. 点击创建一个购买按钮．

  4. 点击收藏购买按钮．

  5. 选择集合或使用搜索来查找集合。点击选择．

  6. 可选:点击定制．

    1. 选择行动当客户点击按钮时，就会发生这种情况。你也可以自定义按钮的外观．
    2. 默认情况下，结帐行为将打开一个新窗口，但您可以选择在与您的网站相同的浏览器选项卡中打开结帐。点击高级设置>重定向到同一选项卡．

  7. 点击完成．

  8. 点击复制代码．

  9. 打开要显示“购买”按钮的网页的HTML编辑器。指添加购买按钮代码的HTML．

  10. 将代码粘贴到希望出现Buy按钮的HTML中，然后保存更改。

  1. 从Shopify应用,挖掘商店．

  2. 在销售渠道节中,利用购买按钮．

  3. 点击创建一个购买按钮．

  4. 点击收藏购买按钮．

  5. 选择集合或使用搜索来查找集合。点击选择．

  6. 可选:点击定制．

    1. 选择行动当客户点击按钮时，就会发生这种情况。你也可以自定义按钮的外观．
    2. 默认情况下，结帐行为将打开一个新窗口，但您可以选择在与您的网站相同的浏览器选项卡中打开结帐。点击高级设置>重定向到同一选项卡．

  7. 点击完成．

  8. 点击复制代码．

  9. 打开要显示“购买”按钮的网页的HTML编辑器。指添加购买按钮代码的HTML．

  10. 将代码粘贴到希望出现Buy按钮的HTML中，然后保存更改。

准备好开始与ShoOB欧宝娱乐APPpify销售?

免费试用