Baby and gift retailers on Shopify lose registry-driven sales every day simply because shoppers can’t add products to their Babylist registry without leaving the site. Babylist doesn’t offer an official Shopify app, and there’s no toggle for it in the Dawn theme editor — which is why we get asked to implement this integration so often. Here’s exactly how we do it.
Why add a Babylist button to your store
Babylist is the most-used baby registry platform in the US, and its browser extension already lets shoppers add items from any site. But relying on a browser extension means friction: the shopper needs it installed, and many don’t. A native “Add to Babylist” button on your product page removes that friction entirely, which typically means more registry adds and more downstream sales when gift-givers purchase from your store.
Because there’s no Shopify app for this, adding the button requires two small pieces of code in your theme. Neither requires backend development — just access to your theme’s code editor.
Step 1: add the Babylist partner script
This script registers your domain with Babylist and loads the function the button depends on. It only needs to be added once, site-wide.
In your Shopify admin, go to Online Store → Themes → Dawn → Edit code, open layout/theme.liquid, and paste this immediately before </head>:
<script type=”text/javascript”>
window._bl = { partner: ‘yourdomain.com’ };
</script>
<script async type=”text/javascript” src=”https://www.babylist.com/add.js”></script>
Swap in your store’s actual root domain — no https:// prefix, no trailing slash.
Step 2: add the button to product pages
Dawn is built on Shopify’s Online Store 2.0 architecture, so there’s no single product.liquid file to hunt through like on older themes — product pages are assembled from JSON templates and sections. That means you don’t need to touch theme code to place the button; you can do it from the theme customizer:
- Go to Online Store → Themes → Customize and open a product page
- In the product information block list, click Add block → Custom Liquid
- Drag it into position — most stores put it just above or below the “Buy it now” button
- Paste in the code below, then save
<a href=”javascript:bl.addToRegistry({
images: ‘{{ product.featured_image | image_url: width: 800 }}’,
price: ‘{{ product.price | money_without_currency }}’,
title: ‘{{ product.title | escape }}’,
url: ‘{{ shop.url }}{{ product.url }}’
});” class=”button button–secondary” style=”width:100%; margin-top:10px;”>
Add to Babylist
</a>
The button button--secondary class inherits Dawn’s native button styling automatically, so the button matches the rest of your storefront without any extra CSS. Under the hood, this calls the same bl.addToRegistry() function Babylist’s own browser extension uses — you’re just triggering it directly from an on-page button instead of requiring the shopper to have the extension installed.
Common issues
The button doesn’t do anything. The partner script from step 1 usually hasn’t loaded yet, or window._bl was set with a typo. Confirm the script is present in your published theme’s <head>, not just in a draft.
The button appears in the wrong place. Because Dawn renders product pages from blocks rather than a single template file, use the Custom Liquid block’s drag handle in the customizer instead of trying to reorder it in the code editor.
Product image or price is missing. Some products don’t have a featured image; add a fallback or conditionally hide the button for those products.
Need help with Shopify customizations like this?
Small integrations like the Babylist button are exactly the kind of theme customization that’s easy to get wrong on Online Store 2.0 themes — one mismatched block type or a script placed in the wrong file, and it silently doesn’t work. If you’d rather have it done right the first time, or want other registry and wishlist integrations added to your store, get in touch with our team — we handle Shopify theme customizations like this regularly.