Setting Up Size Guides on Squarespace

Squarespace Makes Pretty Pages — Sizing Is Up to You

Squarespace is a favorite for fashion brands that care about design, and it shows: the product pages look great out of the box. What they don't do out of the box is help a shopper pick the right size. There's no native size guide system, so most Squarespace stores end up with a sizing image pasted into the description or nothing at all. For apparel, that's a problem, because uncertainty about size is one of the leading causes of abandoned carts and wrong-size returns. The platform gives you enough flexibility to solve this cleanly — you just have to do it on purpose.

Using the Product Description and Additional Info Fields

The lowest-effort approach is to put a size chart directly in the product description or additional info area. You can paste a table or an image, and Squarespace will render it on every product where you add it. For a tiny catalog with one consistent fit, this is a defensible starting point.

The trade-off is the same one every static chart carries: the shopper has to measure themselves, read the table, and translate the numbers into a size. Many simply won't, and the ones who try are the ones most likely to make a mistake. It also gets unwieldy as you add products with different measurements, because you're maintaining the same chart in many places. Keep a master spreadsheet so your pages never drift from reality.

Adding a Pop-Up Size Guide With a Code Block

A cleaner experience uses a Squarespace Code Block to add a "Size Guide" link that opens a modal near the size selector. This keeps the product page tidy while putting the chart one tap away at the exact moment the shopper is deciding. Code Blocks accept HTML and CSS, so you can style the modal to match your theme.

The detail that makes or breaks it is placement. The trigger has to sit right next to the size dropdown — not at the bottom of a long page. Shoppers commit to a size in the seconds before they add to cart, and a guide they can't see at that moment doesn't get used. The same logic underpins our size chart best practices.

Embedding a Size Recommendation Tool

The highest-impact option is to embed a tool that asks a few short questions and returns a specific size, rather than handing the shopper a table to interpret. Squarespace Code Blocks support iframe embeds, which means a recommendation widget like YourSizer can live directly on the product page.

This is the real distinction between a size chart and a size recommendation: a chart documents the garment, a recommendation makes the decision with the shopper. For clothing, the recommendation approach reliably does more to reduce wrong-size orders, because it removes the step where most mistakes happen — the moment a shopper guesses which column they belong in.

Designing It to Fit the Squarespace Aesthetic

Squarespace merchants chose the platform for its look, so a size guide that clashes with the design will feel broken even if it works. Match the typography, spacing, and color of your theme. If you're using a modal, keep it clean and uncluttered — a single readable table beats a cramped grid of every measurement you could think of.

This matters beyond aesthetics. A guide that looks like part of the store earns more trust than an obvious third-party bolt-on, and trust is part of what converts. Our piece on trust signals that convert explains why polish and credibility move the needle on fit-related hesitation.

Get It Right on Mobile First

Most Squarespace fashion traffic is on phones, and a size guide that's only usable on desktop is a guide most of your shoppers will never use. Test the trigger and the modal on a real device. A tiny table that requires pinch-zooming is barely better than nothing.

If your audience is international, show multiple measurement systems, because a shopper in the US and one in the EU read entirely different numbers off the same garment. Small mobile frictions stack up fast, as we cover in optimizing mobile checkout. Make the fit help effortless on the device most of your buyers actually use.

Keep the Chart Honest and Current

The fastest way to manufacture returns is a size guide that doesn't match the garment. If your chart and your product disagree, you've actively misled the buyer. As your Squarespace catalog grows, accuracy gets harder to maintain by hand.

Build a habit: measure each style, record the real garment measurements, and tie the displayed chart to those numbers rather than a generic template. When a style runs small or large, say so on the page. Shoppers forgive a clear "this runs snug — size up" far more readily than a chart that quietly misled them. Honest fit notes also reduce the return anxiety that suppresses conversion.

When to Upgrade From a Static Chart

A clean pop-up chart is a fine start for a new store with a small, consistent range. But once returns show up as a real line item, or once you're spending meaningfully on ads and watching wrong-size orders erode the margin, a static chart is leaving money on the table. The shoppers who need help most are exactly the ones who won't measure themselves and decode a table.

That's the point where an embedded recommendation tool earns its keep: it scales across the whole catalog, behaves the same on mobile, and removes the interpretation step. The ROI of a size recommendation tool lays out the math for when the upgrade makes sense.

Where YourSizer Fits

YourSizer embeds on a Squarespace product page through a Code Block iframe, so there's no platform migration or store rebuild. Shoppers answer a few quick questions and get a specific size instead of a table to decode — which is what actually reduces wrong-size returns. See how it behaves on a live page in our product overview, explore the merchant side on the for brands page, and check pricing for what it costs at your scale.

Frequently Asked Questions

Can I add a size guide to Squarespace without changing my template?

Yes. You can add a static chart through the product description or additional info field with no code at all, or use a Code Block to add a pop-up guide or embed a recommendation tool. None of these require editing your template's underlying code.

Will an embedded sizing tool slow my Squarespace site down?

A well-built recommendation widget loads asynchronously, so it shouldn't block your page from rendering. Test your page speed before and after, and place the embed so it doesn't delay the size selector or add-to-cart button. Site speed affects conversion, so it's worth verifying rather than assuming.

Do I really need more than a static chart?

Not always. For a small, consistent catalog with low traffic, a clean pop-up chart is a reasonable start. Once returns become a visible cost or you're spending on ads, a recommendation tool usually pays for itself by removing the interpretation step where most wrong-size orders originate.