Skip to main content

Opening the Measmerize Widget 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.

Important: 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.

Prerequisites

Before implementing this, you must have completed the standard Measmerize integration. The measmerize.modal.open() method is only available once the Measmerize script is loaded on the page and <div id=’measmerize-button’></div> is present 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.

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].

Did this answer your question?