如何为Shopify店铺添加Buy on Amazon 亚马逊购买按钮 我并不推荐这样做

本文介绍的为Shopify独立站添加亚马逊按钮的方法原始文件已经丢失,所以,本篇所介绍的方法已经失效。懂代码的,可以根据文章中的思路进行修改实现想要的效果。

建议想要在自己的Shopify网站上添加Buy on Amazon的朋友,先阅读下这篇文章 《要不要做Shopify?亚马逊卖家需要了解的内容

最近还是有蛮多人询问如何在Shopify网站上添加 Buy on Amazon按钮,引导Shopify独立站的客户跳转到Amazon上购买相应的产品。虽然我在《Shopify开店教程-开店之前需要了解的内容 2》一文中写明正确的姿势是把Amazon的客户尽可能的往你的独立站引导,但是基于两个平台的不同,现在想来也无可厚非。

相对来说,Shopify更容易实现对用户的二次营销,因为客户的信息全部掌握在自己手里,营销推广更加的灵活,通过邮件营销等等方式,能够极大提高客户的忠诚度,这种忠诚到后面甚至可以作为自己公司的Amazon Reviewer团队,去给Amazon新上的产品快速增加Review,有必要的时候甚至进行下刷单。但是Shopify的难点在于新订单的获取,需要我们有一定的推广能力和一定的推广资金的投入。

而Amazon上获取新客户的订单要容易太多了,通常独立站的转化率能到2%,3%算正常,5%就不错了,但是在Amazon上10%是很平常的一件事情(有些产品转化率高的惊人,50%以上也是有的)。整体来讲,Amazon给人的信任程度,以及服务体验都可以促使新客户没有疑虑的下单。但是因为卖家手里的客户信息都是经过Amazon加工的,受Amazon规则的制约,并不能充(zi)分(you)的发(sao)挥(rao)去培养客户的忠诚度。

为Shopify店铺添加亚马逊购买按钮

二者如何更好的结合,也是我一直在考虑的问题。这个以后再详细讨论,今天只借鉴参考圈内技术大神网名L-KD的一篇文档 – 《shopify上创建亚马逊店铺链接方法-BY-IT-L》 来详细说明下如何给你的Shopify店铺添加一个Buy on Amazon按钮。

1 首先依据你的Shopify网站风格,设计一个格式为jpg,png的buy on Amazon的按钮,Google图片上可以找到一大堆,你可以找一张,然后简单PS下,拿来用。

2 进入Shopify后台 – Setting – Files,点击右上角的Upload Files按钮,将PS好的Buy on Amazon按钮的图片上传到你的Shopify网站中,并且复制该图片的URL地址.

Shopify添加亚马逊按钮

3 打开文档《shopify上创建亚马逊店铺链接方法-BY-IT-L》 找到  <a href=”{{ product.variants.first.barcode }}”><img src=””># “/&gt;</a>,并将这段代码中的#换成上一步中复制的Buy on Amazon按钮的图片URL地址,然后复制修改好的这段代码 <a href=”{{ product.variants.first.barcode }}”><img src=”&lt;span style=” />https://cdn.shopify.com/s/files/1/1139/1060/files/Buy-On-Amazon-Button.png “/&gt;</a># “/>,并将这段代码中的#换成上一步中复制的Buy on Amazon按钮的图片URL地址,然后复制修改好的这段代码https://cdn.shopify.com/s/files/1/1139/1060/files/Buy-On-Amazon-Button.png “/>

2017.06.21 更新
接部分同学反馈,添加代码之后还是不显示亚马逊购买按钮图片,经查,发现复制粘贴的代码中,有部分英文字符状态下的引号 “” 被替换为了中文状态的引号 “”。请务必注意下差别

4 找到产品页面的liquid文件。一般Shopify官方的主题文件位置在: Shopify后台-Online Store – Themes – Edit HTML/CSS – Sections – product-template.liquid 文件,然后在这个文件中找到添加购物车或者button字样的代码,并且将步骤3中复制的代码粘贴到购物车代码的下方,然后保存文件就可以了。(下图中绿色字体部分就是购物车按钮的代码,红色字体部分为我们新添加的亚马逊购买按钮的代码)(具体代码位置可能因为主题原因会和下面代码不同,请具体分析)

 



{% unless current_variant.available %}
{{ ‘products.product.sold_out’ | t }}
{% else %}
{{ ‘products.product.add_to_cart’ | t }}
{% endunless %}

 

5 以上代码添加完毕之后记得点击右上角的Save按钮保存更改,在你的产品页面就会有一个Buy on Amazon按钮了

6 打开具体的产品添加页面,在Inventory项下的Barcode一栏中填人你对应产品的Amazon Listing的URL,保存,就完成设置了

shopify添加亚马逊按钮

前台显示效果如下:(实际效果看这里

如何为Shopify店铺添加Buy on Amazon 亚马逊购买按钮

PS:目前这个方法可用,但是只能添加一个Amazon站点的链接地址

另外可以尝试通过在Description里面添加亚马逊按钮试试。效果也差不太多的

赞(26) 打赏
未经允许不得转载:歪猫跨境 | WaimaoB2C » 如何为Shopify店铺添加Buy on Amazon 亚马逊购买按钮

留言交流 47

  1. #25

    我添加了代码,也在barcoad放了我的链接,可是没看到buy on amazon这个按钮

    区善芬10个月前 (08-05)回复
  2. #24

    现在这个做法是不是无效了?

    陈平24561年前 (2021-03-05)回复
  3. #23

    复制不了代码

    匿名2年前 (2020-03-27)回复
  4. #22

    楼主,问下,最后添加完 亚马逊链接,但是界面还是本主页,没有跳过去,是因为我的shopify是适用版本吗?

    匿名3年前 (2019-11-06)回复
    • 那应该是你的链接没有添加正确吧,查看下代码看看是不是正常跳转的链接

      Conway3年前 (2019-11-06)回复
  5. #21

    这张图我能用吗?

    匿名3年前 (2019-01-18)回复
    • 可以

      Conway3年前 (2019-02-15)回复
  6. #20

    加了buy on Amazon 后,有pixel可以跟踪这个按钮吗,这个事件像素怎么设置呢

    匿名3年前 (2019-01-09)回复
    • 没有办法跟踪

      Conway3年前 (2019-02-15)回复
  7. #19

    如果只是某个产品不想有这个按钮,该怎么设置呢

    匿名3年前 (2018-12-28)回复
    • 如果是这样的话,这个方法行不通。你可以直接将buy on amazon按钮加到产品描述里面,来实现你想要的功能

      Conway3年前 (2019-01-01)回复
    • 加个判断好了哇

      匿名3年前 (2019-01-07)回复
  8. #18

    这个意思是, 把引流到自己亚马逊店铺下单么?

    匿名4年前 (2018-10-18)回复
    • 是的,正解

      Conway4年前 (2018-10-22)回复
  9. #17

    如何让图标在手机自适应大小呢?

    匿名4年前 (2018-09-17)回复
    • 查看代码,删掉设定图片大小的 width length 就可以了

      Conway4年前 (2018-09-17)回复
  10. #16

    怎样让图片自适应?

    匿名4年前 (2018-09-14)回复
    • 这个图片是指产品图片还是Buy on Amazon按钮的图片?SHOPIFY的图片都是自适应的吧,Buy On Amazon的图片在插入的时候看代码,把限定图片大小的代码 width length 这些删掉,就自适应了

      Conway4年前 (2018-09-17)回复
  11. #15

    添加成功了,图标也出来了,但是点击没反应

    匿名4年前 (2018-08-21)回复
    • 看下你的代码是不是有什么问题,比方式应该是英文状态的双引号 “” 但是你那边用了中文状态的双引号 “”

      Conway4年前 (2018-08-28)回复
  12. #14

    您好, 有什么代码可以调整按钮位置吗, 我按照您这个方法添加成功了,但是没有跟原来的图标对齐

    匿名4年前 (2018-07-24)回复
    • 调整下你添加的代码的位置和图片的大小试试吧

      Conway4年前 (2018-07-25)回复
  13. #13

    大神,我找不到那个html的部分,我的模板是面费的,用搜索框搜了也找不到

    yxx4年前 (2018-05-30)回复
  14. #12

    大神,我找不到那个编辑HTML的页面,我的是免费模板

    yxx4年前 (2018-05-30)回复
  15. #11

    我买的正版的主题,但是也找不到那串代码

    天使的左手4年前 (2018-05-29)回复
  16. #10

    这样为店铺所有的产品填上了按钮,我只想几个在亚马逊卖的产品添加这个按钮,其它的产品不用添加,这个如何解决呢?

    starry4年前 (2018-05-28)回复
    • 那就再产品描述里面添加吧

      Conway4年前 (2018-06-04)回复
  17. #9

    我的sections里面没有那个代码怎么办/

    sunny4年前 (2018-05-09)回复
  18. #8

    我的sections里面没有那个代码怎么办/

    ys4年前 (2018-05-09)回复
  19. #7

    我也试验了这个方法,确实可以显示。
    但是,我有一个担心。如果我是用SHOPIFY去到亚马逊做LISTING的。那么BARCODE也是要同步过去的。
    如果这里我把BARCODE换成了这个地址,是否会在亚马逊同步LISTING的过程中产生错误?
    有没有其他地方可以加?

    ZHANG4年前 (2018-04-04)回复
    • 是的,会产生错误的。除了Barcode之外,SKU也是可以添加的。另外,也可以在产品的详情描述上添加。

      不过就个人经验来讲,已经不建议去这么搞了。SP独立站搞的流量不容易,没必要把这些流量再引导到Amazon,而应该着重考虑独立站的转化问题。Amazon上的竞争对手太多了。没办法保证你带到Amazon的流量就一定买了你的产品。另外,SP独立站的溢价能力也是很强悍的。你在Amazon上卖10美金的产品,在SP独立站上卖15美金,20美金都可能卖的很好

      以上仅供参考

      Conway4年前 (2018-04-05)回复
      • 楼主,我的product-template里面没有那串代码,找了一下午别的地方也找了还是没有

        天使的左手4年前 (2018-05-29)回复
    • 请问,可以设置 buy on Aliexpress吗?

      匿名4年前 (2018-05-23)回复
      • 可以,把Amazon改成Aliexpress就可以了

        Conway4年前 (2018-05-24)回复
  20. #6

    老师好,我前面都成功了,就是最后一步的时候,添加amazon listing URL的时候,点进去显示404错误,求教!!

    Martin4年前 (2018-02-10)回复
    • 那应该是URL的问题,你检查下URL吧,可能的问题是URL没有带http,或者引号有问题,(正确的引号是英文状态下的半角符号)。正确的URL格式是 href="https://amazon.com"

      Conway4年前 (2018-02-10)回复
      • 我填加 amazon listing URL,点进去一直都显示404错误,求教

        cherry4年前 (2018-03-13)回复
        • 404错误页面是你的网站内部页面吧?请查看下你的链接有没有问题,还有就是字符是不是英文字符状态下的”” 而不是中文字符 “”

          Conway4年前 (2018-03-20)回复
  21. #5

    楼主对中东电商SOUQ,有研究吗?希望看到科普贴,我觉得你什么都会讲得很浅显易懂。

    tom chu5年前 (2017-12-05)回复
    • 目前只了解Amazon和Shopify,中东电商SOUQ可以关注“小爸爸的日记”的微信,微信号Xseller

      Conway5年前 (2017-12-08)回复
  22. #4

    博主,我想咨询一下,我已经按照你写的教程安装上去了,但是点击buy on amazon这个按钮没有跳到亚马逊,没有什么反应。这是个什么情况呢

    肆意5年前 (2017-09-30)回复
    • 贴一下你改的代码看下

      WaimaoB2C5年前 (2017-10-07)回复
  23. #3

    楼主,我发现,用了这串代码后,有多SKU 的图片,不在会随着SKU 的图片转化。就是固定的那张图。

    Lighton1502在搜狐5年前 (2017-08-15)回复
  24. #2

    你好,我试了下,如果是变体类型,那么只有第一个SKU的亚马逊链接是有效的,剩余的SKU指向链接都是以第一个SKU为准。这个怎么解决

    MEROUS5年前 (2017-08-14)回复
  25. #1

    楼主你好,我试了一下,还是不行,添加不了,把这一串代码放到最后面才可以,但是不好看

    格联博国际贸易有限公司5年前 (2017-07-22)回复
    • 看你用的什么主题了。如果是Shopify官方的免费主题,请找到Sections – Product-template.liquid文件然后找到对应的位置。其他主题就要自己找找定义Product Page的页面以及对应的位置了。

      Conway5年前 (2017-07-24)回复
    • 看你用的什么主题了。如果是Shopify官方的免费主题,请找到Sections – Product-template.liquid文件然后找到对应的位置。其他主题就要自己找找定义Product Page的页面以及对应的位置了。

      WaimaoB2C5年前 (2017-07-24)回复

觉得文章有用就打赏一下文章作者

非常感谢你的打赏,我们将继续给力更多优质内容

支付宝扫一扫打赏

微信扫一扫打赏