Integrations

How to Add a Size Recommendation Widget to Shopify

A size recommendation widget gives shoppers a confident size at checkout. Here's how to add one to any Shopify store, step by step.

On this page
  1. What a Size Recommendation Widget Does
  2. Step 1 — Install From the App Store
  3. Step 2 — Add the App Block to Your Product Template
  4. Step 3 — Place It at the Decision Point
  5. Step 4 — Test on Mobile
  6. Step 5 — Map Your Sizes and Go Live
  7. Where YourSizer Fits
  8. Sources
  9. Frequently Asked Questions

What a Size Recommendation Widget Does

A size recommendation widget asks the shopper a little about their body and preferences, then tells them which size to buy in this specific product. Unlike a size chart, it doesn't leave the interpretation to the customer — it gives an answer. That's the difference between informing and deciding, and it's why recommendation widgets move return rates that charts don't.

Adding one to Shopify is straightforward. Here's the full process.


Step 1 — Install From the App Store

Choose a size recommendation app and install it. During install it requests access to your products and theme so it can map sizes and embed the widget. This is normal for app-block sizing tools.


Step 2 — Add the App Block to Your Product Template

Modern Shopify themes (Online Store 2.0) support app blocks, so no code is required:

  1. Go to Online Store → Themes → Customize.
  2. Open a Product template.
  3. Click Add block in the product information section.
  4. Select the widget's block.
  5. Drag it next to the size/variant selector.
  6. Save.

If you're on an older theme without app-block support, the app usually offers an app embed or a small snippet — follow the vendor's instructions and consider upgrading to a 2.0 theme.


Step 3 — Place It at the Decision Point

Placement is the single biggest factor in whether a widget gets used. Put it next to the size selector — that's the moment the shopper is uncertain. A fit tool buried in a footer tab gets ignored. We explain why in The Conversion Killer Hiding on Your Product Page.


Step 4 — Test on Mobile

Most fashion shoppers are on phones. Before you launch, confirm:

  • The launcher doesn't cover the Add to cart button.
  • The fit flow is usable on a small screen.
  • It loads without slowing the page.

Step 5 — Map Your Sizes and Go Live

Map the widget to your size system (and per-product fit notes if available), preview, and publish. Track size-related returns and bracketing before and after to measure impact — see How to Lower Your Shopify Return Rate.


Where YourSizer Fits

YourSizer is a size recommendation widget that installs as a Shopify app block and gives each shopper a confident, product-specific size using 3D body modeling. See it for brands, the shopper experience, or pricing.



Sources

Frequently Asked Questions

How do I add a size recommendation widget to Shopify?

On an Online Store 2.0 theme, install the app, then in the theme editor add its app block to the product template next to the size selector — no code needed. Older themes use an app embed or snippet.

Do I need to edit code to add a sizing widget?

Usually not. Modern Shopify themes support app blocks, so you can drag the widget into place in the theme editor. Only older themes may require a small snippet.

Where should the size recommendation widget appear?

Right next to the size or variant selector, where the shopper makes the size decision. Placing it there — rather than in a hidden tab — is what drives usage and reduces returns.

Put it into practice

See YourSizer on your own store

Size recommendation, 3D body model and photo try-on — live on your product pages in a day.