Shopify购买按钮:如何添加到任何网站(2023)

与Shopify购买按钮，你可以完全整合Shopify的电子商务工具任何网站，无论是建立在WordPress, Squarespace, Wix或任何其他网站建设者．

Shopify不只是为成熟的电子商务企业服务。任何想从自己的项目中赚钱的人——无论是博主、艺术家、作家、设计师、播客还是有影响力的人——都将从中受益网上销售．

但是建立一个在线商店需要时间，并且重欧宝体育官网入口首页定向网络流量会增加结账过程的摩擦，这可能会对你的销售产生负面影响。Shopify购买按钮是您的解决方案!

1.添加购买按钮销售渠道到您的Shopify商店

你会想要从OB欧宝娱乐APP登录你的Shopify商店．如果你看到“购买”按钮列在销售渠道在左边的菜单上，销售渠道已经被添加，你可以直接跳到第2步。

在桌面

1. 转到Buy Button销售渠道页面在Shopify应用商店(你也可以进入这个页面通过进入设置>访问Shopify应用商店和搜索购买按钮⁠)。
2. 点击添加应用程序,然后增加销售渠道在下一个屏幕上。

页面刷新后，您应该看到购买按钮列在销售渠道在左边的菜单上。一定要把频道固定在导航栏上，方便以后访问。

如果你没有固定购买按钮，你可以通过点击再次找到它销售渠道然后购买按钮在你安装的频道下面。

在移动

1. 打开Shopify应用在你的移动设备上选择商店从底部菜单。
2. 旁边销售渠道中,选择添加通道(iPhone版)或者+(Android)。
3. 选择购买按钮从选项列表中，然后点击添加购买按钮．

2.创建一个购买按钮

一旦添加了Buy Button销售通道，就可以开始创建Buy Button了。OB欧宝娱乐APP导航到您的购买按钮页面，或者通过单击购买按钮(如果你把它固定在导航栏上的话)或者去设置>应用程序和销售渠道>购买按钮．

从那里，点击创建一个购买按钮．

您可以为单个产品或整个产品集合创建Buy Buttons。在下一个屏幕上，您将被要求选择您喜欢的选项。单击您的首选选项，然后搜索要用于创建购买按钮的产品或集合。

确保复选框已填满，然后单击选择．

一旦你做出了选择，你将被带到购买按钮编辑器，在那里你可以自定义购买按钮的外观。

如何定制购买按钮

在Buy Button编辑器中，您将看到左侧列出了许多选项，用于自定义Buy Button的外观和感觉。在右边，你会看到购买按钮的预览。

根据自己的喜好调整左边的选项。你的预览会随着调整自动更新，所以你可以看到你的购买按钮看起来像你在创建它。在预览版中，你可以通过点击位于编辑器顶部的桌面或移动图标来查看购买按钮在桌面和移动屏幕上的显示方式。

以下是您可以自定义的选项的细分:

• 产品变体:选择您希望通过购买按钮购买的产品的哪些变体。默认情况下将选择所有变体。
• 布局:选择基本，经典和完整视图。在右侧，当您从layout下拉菜单中选择每个布局时，您将看到每个布局的预览。
• 当人们点击时的动作:选择“将产品添加到购物车”、“直接结帐”或“打开产品详细信息”。“将产品添加到购物车”选项将在屏幕右侧创建一个购物车小部件。“直接结帐”选项将创建一个立即购买按钮，该按钮将使用户直接结帐(注意，客户将无法使用此选项向其购物车中添加多个项目)。“打开产品详细信息”选项将创建一个查看产品按钮，该按钮将打开一个弹出窗口，其中包含产品信息和一个添加到购物车按钮。
• 按钮样式:在这里你可以调整“购买”按钮的颜色、字体、大小和角的形状。
• 布局布局菜单将允许您对按钮的布局进行更精细的调整。您可以自定义字体颜色、按钮文本和排版设置。
• 购物车在这里，你可以调整购物车小部件的设置，包括复制和颜色。请注意，如果您使用“直接结帐”布局，则此选项将显示为灰色，因为没有购物车小部件。
• 详细的弹出如果你在“用户点击时的动作”下选择“打开产品详细信息”，你就可以为这个部分的弹出窗口定制文本、颜色和排版选项。
• 高级设置:在这里，您可以调整为用户提供结帐服务的方式。你可以选择“打开弹出窗口”(这会创建一个弹出式结帐，当订单完成时关闭)，或者“在同一选项卡中重定向”(这会将用户从浏览器窗口发送到您的Shopify结帐页面，并在交易完成后返回到您的页面)。

请记住，对这些设置进行调整不会改变已经嵌入的“购买按钮”。这就是为什么在进入下一步之前，花点时间调整“购买”按钮是件好事。

当您对自己的设计感到满意时，单击右上角的Next按钮。

3.添加购买按钮嵌入代码到您的网站HTML

当您单击Next时，购买按钮的嵌入代码将自动生成。如果您准备将其嵌入到网页上，请单击“复制代码”按钮，如果您想回到“购买按钮”编辑器进行调整，请单击“保持自定义”按钮。

您在这里复制的代码可以粘贴到任何网页的HTML中，它将创建一个购买按钮和购物车，直接连接到您的Shopify管理，允许您管理和处理来自Shopify管理内任何网页的订单。

添加嵌入代码的过程可能会有所不同，这取决于您希望按钮的显示方式，您正在使用的网站构建器，甚至是您在平台上使用的主题。

以下是一些嵌入Shopify购买按钮的常见地方，以及你需要遵循的步骤:

在Shopify商店的登陆页面或博客文章中添加嵌入代码

你的Shopify商店已经内置了产品页面和购物车，但偶尔你可能会想在页面或博客文章中直接添加一个购买按钮，以增加方便。

例如，如果你正在写一篇关于新发布产品的博客文章，你可能想给读者一个直接从文章中购买的简单方法，而不是将他们链接到一个单独的页面。

在这种情况下，你需要遵循以下步骤:

1. 从你的Shopify管理，去欧宝体育官网入口首页网上商店>博客文章或欧宝体育官网入口首页网上商店>网页，这取决于你是把它添加到博客文章还是页面上。
2. 选择要添加购买按钮的博客文章或页面。
3. 在内容窗口中，选择<>按钮，从Edit视图切换到HTML视图。

1. 将之前复制的嵌入代码粘贴到HTML编辑器中，无论它出现在哪里。单击Save。

一旦你保存了你的页面或博客文章，你的购买按钮就会被添加到页面上。如果希望在不发布的情况下查看其外观，请选择预览(或视图页面如果要将其添加到页面中)，则在页面编辑器的右上角。

添加一个购买按钮到Squarespace网站

在Squarespace上，您可以将购买按钮添加到个人帖子或主页上的菜单中。添加一个购买按钮到您的Squarespace网站:

1. 登录你的Squarespace仪表板，打开你想添加购买按钮的页面。
2. 悬停在页面内容您希望“购买按钮”在页面元素中显示并单击的区域编辑．
3. 选择要在其中添加嵌入代码的插入点。
4. 从内容块菜单，在更多的部分中,选择代码．
5. 一定要超文本标记语言从右上角的下拉菜单中选择，然后将购买按钮嵌入代码粘贴到代码字段。
6. 点击应用．

请记住，一些自定义的Squarespace主题可能需要更高级的HTML知识来进行自定义。在这种情况下，最好直接向开发人员寻求帮助，以便为您的站点添加自定义代码。

添加一个购买按钮到WordPress博客

在你的WordPress.org网站上添加一个“购买”按钮:

1. 从你的WordPress仪表板，进入你的文章，选择你想添加购买按钮的文章。
2. 根据你使用的WordPress编辑器的版本，完成以下步骤之一:
   • 如果你的WordPress网站使用的是经典编辑器，点击文本选项卡，以便从可视化视图切换到文本视图。
   • 如果你正在使用块编辑器为你的WordPress网站，点击+按下按钮，然后搜索并选择自定义HTML．
3. 将“购买按钮”嵌入代码粘贴到您希望它显示的位置。
4. 点击保存草稿，预览,或发布，这取决于你想采取的行动。

您还可以通过完成以下步骤将嵌入代码添加到WordPress菜单中:

1. 在你的WordPress仪表板上，点击外观．
2. 选择定制要打开主题编辑器，请选择小部件．
3. 选择要添加购买按钮的区域。
4. 点击添加小部件,然后文本⁠。
5. 粘贴购买按钮嵌入代码。
6. 点击保存和发布．

请注意，Shopify购买按钮与WordPress.org平台兼容，但由于HTML定制限制，与WordPress.com不兼容。

添加一个购买按钮到Wix

要在您的Wix网站上添加Shopify购买按钮，请遵循以下步骤:

1. 从Wix指示板中选择站点我的网站要向其添加“购买按钮”的页面，然后选择编辑网站．
2. 在Wix网站编辑器中，单击+,然后更多的．选择HTML代码．这将在页面中添加一个HTML代码小部件。
3. 点击输入代码．在HTML的设置弹出窗口，将您的购买按钮嵌入代码粘贴到在这里添加代码字段。
4. 点击应用．
5. 根据您的喜好调整HTML代码小部件的大小。如果您在购物车中嵌入了购买按钮，请记住确保购物车选项卡是可见的。
6. 调整完成后，单击保存．

值得注意的是，如果您想为多个产品嵌入购买按钮，最好嵌入一个集合购买按钮，而不是为单个产品嵌入购买按钮。如果您嵌入多个单一产品的购买按钮，那么访问者将看到每个产品的单独购物车。

添加Shopify购买按钮脚本标签

在某些情况下，网站建设者(如Unbounce)将要求您粘贴< >脚本标记单独地放在页眉中，同时将其余代码粘贴到页面主体中，无论您希望Buy Button出现在哪里。

为了做到这一点，你需要分离< >脚本元素< div >元素在“购买按钮”嵌入代码中。你会看到< div >元素放置在代码的顶部。它看起来是这样的:

< div id = "产品组件- 1655929612938”> < / div >

script元素(它要长得多)组成了嵌入代码的其余部分，从OB欧宝娱乐APP<脚本type = " text / javascript”>结尾是> < /脚本．

一旦你把这些元素分开，下面是你要采取的步骤:

1. 打开页面头的网站，你想嵌入你的购买按钮。
2. 复制并粘贴< >脚本元素，在它的整体，到您的网站页眉。
3. 保存更改。
4. 现在，打开想要添加Shopify购买按钮的页面编辑器。
5. 复制并粘贴< div >元素放入页面中，无论您希望“购买按钮”出现在哪里。
6. 保存更改。

添加电子商务到任何网站与Shopify购买按钮

Shopify的“购买按钮”可以帮助卖家在他们所在的地方找到客户——无论是页面还是平台。直接向客户销售而无需将他们发送到另一个页面的便利减少了摩擦，有助于促进销售。

对于店主来说，在博客页面上策略性地放置“购买”按钮可以让顾客在不离开当前页面的情况下轻松购买产品。

对于博主、艺术家、作家、设计师、播客、有影响力的人，以及任何想要将自己的作品货币化的人来说，Shopify的购买按钮提供了一种利用Shopify的简单方法电子商务平台而不需要建立一个全新的网站。

通过可定制的样式、颜色和功能，Shopify Buy Buttons可以让您将任何页面或网站变成一个成熟的在线商店。欧宝体育官网入口首页

OB欧宝娱乐APP开始免费试用shopify -不需要信用卡!

电子邮件地址 OB欧宝娱乐APP开始免费试用