Integrations

How to Add a Size Recommender to Ecwid

A practical walkthrough for embedding fit guidance across every storefront your Ecwid store runs on.

On this page
  1. Why Ecwid's embed model changes the sizing calculus
  2. Installing ecwid sizing app functionality without a developer
  3. Choosing the right ecwid fit widget for apparel vs. footwear
  4. Measuring impact after you add a size recommender to ecwid
  5. Frequently Asked Questions

Ecwid merchants face a problem most other platforms don't: the same storefront can be embedded on a WordPress page, a Wix site, a Facebook shop, and a standalone Ecwid-hosted domain, all at once. Adding a size recommender means getting fit guidance to show up reliably no matter where a shopper actually lands, and that requires understanding Ecwid's embed model before you touch a single line of code.

Why Ecwid's embed model changes the sizing calculus

Most sizing widgets assume a single, predictable storefront theme. Ecwid breaks that assumption. Because the storefront can be dropped into an iframe, a JavaScript widget, or a Lite version inside almost any host page, a size recommender has to detect its environment and render consistently regardless of the surrounding page's CSS, scripts, or layout constraints.

This matters commercially. Fit uncertainty is one of the largest drivers of size-related returns, and multi-channel apparel sellers are especially exposed because they can't control how every host page is built. An embedded-commerce report from BigCommerce highlights how fragmented storefront environments increase the operational burden of delivering a consistent customer experience — sizing is a direct casualty of that fragmentation if it isn't handled deliberately.

The three environments you need to test

  • Ecwid-hosted storefront — your default my.ecwid.com domain or connected custom domain.
  • Embedded instance — the Ecwid widget dropped into WordPress, Wix, Squarespace, or a custom HTML page.
  • Social and marketplace surfaces — Facebook Shop, Instagram, and similar integrations where Ecwid renders product data inside another platform's UI.

A size recommender that only works on the first environment misses most of the shoppers who never visit your "real" domain at all.

Installing ecwid sizing app functionality without a developer

You do not need to touch Ecwid's API or write custom integration code to get a working size widget live. Most merchants can go from zero to a functioning size recommender in under a day using a script-based install, similar to the process covered in our no-developer widget install guide.

Step-by-step setup

  1. Add the widget script in Ecwid's storefront settings. Under Design or Storefront customization, most Ecwid plans allow a custom HTML/JS injection point that loads on every product page.
  2. Map your product catalog. The recommender needs category and size-chart data — apparel, footwear, or accessories — matched against your existing Ecwid product attributes.
  3. Test on the embedded surface first. Because embeds inherit host-page CSS, verify the widget button doesn't collide with theme styling before testing the hosted domain.
  4. Verify social/marketplace rendering. If you sell through Facebook Shop or Instagram via Ecwid, confirm the widget either renders correctly there or gracefully falls back to a size chart link.
  5. QA on mobile embeds specifically. Embedded iframes on mobile are the most common place sizing widgets break, since viewport and touch-target assumptions differ from a native storefront.

Common embed pitfalls

IssueSymptomFix
iframe sandboxingWidget button doesn't render inside host pageEnsure script loads outside restrictive iframe sandbox attributes
Host CSS collisionWidget styling looks broken or misalignedUse scoped CSS / shadow DOM in the widget script
Multiple embed instancesWidget loads twice or not at all on multi-embed pagesAdd instance-detection logic to the install script
Mobile embed viewportWidget modal cuts off or scrolls incorrectlyTest explicitly on mobile-embedded pages, not just hosted mobile
Social surface renderingWidget missing entirely on Facebook/Instagram shopFall back to a static size chart link for non-JS surfaces

Choosing the right ecwid fit widget for apparel vs. footwear

Not every ecwid fit widget approach works equally well across categories. Apparel sizing typically relies on body measurements and garment fit preference, while footwear sizing depends more heavily on brand-specific last shape and regional size conversion. If you sell both, your recommender needs category-aware logic rather than a single one-size-fits-all input flow.

This is also where the embed complexity compounds: a footwear-specific size table needs to render correctly whether it's on your Ecwid-hosted domain or embedded three levels deep in a page builder. Testing each category on each surface, not just once overall, is the difference between a widget that looks good in a demo and one that actually reduces returns in production.

What good ecwid sizing app data looks like

A functioning setup pulls from three sources simultaneously: your product catalog's size-chart data, category-specific fit logic, and (where available) shopper-provided measurements or past purchase history. The stronger the match between these three, the more confident the recommendation — and confidence is what actually changes purchase behavior, not just the presence of a widget.

Measuring impact after you add a size recommender to ecwid

Once live, track return rate by SKU and by embed surface separately. It's common to see meaningfully different return rates between the hosted domain and embedded instances purely because of rendering inconsistencies, not product fit itself — which is a signal to go back and audit the embed rather than the sizing logic.

If you're comparing this rollout to how sizing widgets install on other platforms, our Shopify sizing widget guide and our Webflow walkthrough are useful references for spotting platform-specific gotchas — Ecwid's multi-embed reality is closer to Webflow's than to Shopify's single-theme model.

Key metrics to watch post-install

  • Size-related return rate, segmented by embed surface
  • Widget engagement rate (opens vs. product page views)
  • Conversion rate on sessions that used the widget vs. those that didn't
  • Time-to-first-interaction, especially on mobile embeds

Frequently Asked Questions

Does a size recommender work inside an embedded Ecwid store, not just the hosted domain?

Yes, but it requires the widget script to be embed-aware, since it inherits the host page's CSS and JavaScript environment. Test the widget separately on your Ecwid-hosted domain and on any embedded instance, because rendering issues that don't appear on one often appear on the other.

Do I need a developer to add an ecwid sizing app?

Most merchants can install a script-based size recommender through Ecwid's storefront customization settings without custom development. Developer involvement is mainly useful if you have complex embed configurations, such as multiple Ecwid instances on one host page.

Will the widget show up on Facebook Shop or Instagram if I sell through Ecwid's social integrations?

Not always by default, since those surfaces render product data inside another platform's UI rather than your storefront's HTML directly. It's common to fall back to a static size chart link on non-JS social surfaces while keeping the interactive widget on your web storefront.

How is fit data different for apparel vs. footwear in an ecwid fit widget?

Apparel sizing generally relies on body measurements and garment fit preference, while footwear sizing depends more on brand-specific last shape and size conversion tables. A single generic input flow tends to underperform for stores selling across both categories, so category-aware logic matters more than it might on a single-category store.

TopicsEcwidSize recommendationEmbedded CommerceEcommerce

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.