Skip to main content

Opening the Size Hub to a Specific Tab

Control which tab — Size Advisor, Size Chart, or Measurements Guide — opens when a shopper clicks your CTA, using the tabToOpen parameter.

⚠️ Developer article. This feature requires a custom JavaScript implementation and is the responsibility of your development team. Measmerize does not provide support for custom theme code.


Overview

By default, clicking the Measmerize CTA opens the Size Advisor tab. Using the tabToOpen parameter, you can control which tab is active when the modal launches — useful if, for example, you want a "Size Chart" button to open directly on the size chart, bypassing the size advisor flow.

⚠️ Prerequisite: Measmerize must be installed and active on your store. The measmerize.modal.open() method is part of the Global Object API, which becomes available once the Measmerize app is active on the page.


Available Tab Values

tabToOpen value

Tab opened

'widget'

Size Advisor (default)

'size-chart'

Size Chart

'how-to-measure'

Measurements Guide


Implementation

Call measmerize.modal.open() with your chosen tabToOpen value on any click event — a button, a link, or any interactive element:

// Opens the Size Advisor (default behaviour)
window.measmerize?.modal.open({ tabToOpen: 'widget' });

// Opens directly on the Size Chart tab window.measmerize?.modal.open({ tabToOpen: 'size-chart' });

// Opens directly on the Measurements Guide tab window.measmerize?.modal.open({ tabToOpen: 'how-to-measure' });

You can attach the above Measmerize Global Object methods to any existing interactive element in your theme.

Note: measmerize.modal.open() applies to the Standard Shopify integration only. If you're using the Modal Integration, the Size Hub opens when your code calls modal.mount()modal.open() does not exist in that setup.


Tab Availability

Tab availability depends on your product configuration in the Measmerize dashboard. If the requested tab is not enabled for the current product, the modal will open on the default available tab instead. No error is thrown.

Tip: If you are unsure which tabs are active for a given product, test by opening the widget manually on that product page and checking which tabs are visible.


Troubleshooting

If the modal is not opening as expected, verify that:

  • The Measmerize main script is correctly loaded on the page

  • The tabToOpen value matches exactly one of the supported strings above (case-sensitive)

  • The target tab is enabled in your Measmerize dashboard for the relevant product

For further assistance, contact [email protected].


Related articles

Did this answer your question?