Embedding Babylist Button to your Shopify Site

Ever wanted to add the popular Bablylist Button to your shopify website so you can potential customers buying your products in the future? Well you’ll have to use the back-end code because there isn’t a Shopify app to make it easier.

Instructions

  1. Login in to the admin part of the site (e.g www.yourwebsite.myshopify.com/admin or www.yourwebsite/admin
  2. Go to Online Store
  3. Select Actions, and select “Edit Code”
  4. Under “Templates”, select product.liquid

And paste this piece of code:

 <script type="text/javascript">window._bl = { partner: 'INSERT YOUR DOMAIN NAME HERE' };</script> <script async type="text/javascript" src="https://babylist.com/add.js"></script> 

Hit Save.

5. Then go to your product-template.liquid, and paste this piece of code above the “Add to Cart” buttion and fill the appropriate information:

 a class="btn" style="margin-bottom: 10px; width: 300px" 
     href="javascript: bl.addToRegistry({
                    images: '{{ product.featured_image.src | img_url: "800x" }}',
		    price: '{{ product.price | money_without_currency }}',
		    title: '{{ product.title }}',
		    url: '{{ shop.url }}{{ product.url }}'
     });">Add to Babylist</a>  

Hit Save.

Viola! You should be able to see the button in your single product pages.