为你的Shopify网站添加Buy on Amazon按钮

即刻注册Shopify,跟着WaimaoB2C精心准备的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)去培养客户的忠诚度。

二者如何更好的结合,也是我一直在考虑的问题。这个以后再详细讨论,今天只借鉴参考圈内技术大神网名约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地址.

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

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

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

<div class=”product-form__item product-form__item–submit”>
<button type=”submit” name=”add” id=”AddToCart-{{ section.id }}” {% unless current_variant.available %}disabled=”disabled”{% endunless %} class=”btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == ‘Default Title’ %} product-form__cart-submit–small{% endif %}”>
<span id=”AddToCartText-{{ section.id }}”>
{% unless current_variant.available %}
{{ ‘products.product.sold_out’ | t }}
{% else %}
{{ ‘products.product.add_to_cart’ | t }}
{% endunless %}
</span>
</button>
</div>
<a href=”{{ product.variants.first.barcode }}”><img src=”https://cdn.shopify.com/s/files/1/2115/3409/files/QQ_20170621143509.png”/></a>
</form>

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

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

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

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

25 thoughts on “为你的Shopify网站添加Buy on Amazon按钮

  1. starry

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

    Reply
  2. ZHANG

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

    Reply
    1. Shopify Post author

      是的,会产生错误的。除了Barcode之外,SKU也是可以添加的。另外,也可以在产品的详情描述上添加。

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

      以上仅供参考

      Reply
    1. Shopify Post author

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

      Reply
        1. Shopify Post author

          404错误页面是你的网站内部页面吧?请查看下你的链接有没有问题,还有就是字符是不是英文字符状态下的”” 而不是中文字符 “”

          Reply
    1. Shopify Post author

      目前只了解Amazon和Shopify,中东电商SOUQ可以关注“小爸爸的日记”的微信,微信号Xseller

      Reply
  3. 肆意

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

    Reply
  4. Lighton1502在搜狐

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

    Reply
  5. MEROUS

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

    Reply
  6. 格联博国际贸易有限公司

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

    Reply
    1. Shopify Post author

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

      Reply
    2. WaimaoB2C

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

      Reply

发表评论

电子邮件地址不会被公开。

shopify