You can display your customiser in a modal (also known as a pop-up) using any of our integration options.
Shopify
Edit your theme within Shopify (Sales Channels -> Online Store -> Customise Theme)
Find the page you would like to display the modal
Add the "Sign Customiser Modal" app where you want your button to appear. This will add an unstyled button to your page.
Optionally change this buttons text and add the proper CSS class names to ensure your button is styled to match your theme
Enter the ID of the customiser you want to show in the modal
Save your changes
Universal
Add the mode="modal" and modal-trigger="#your-trigger" attributes to your Sign Customiser element. The modal-trigger attribute should contain the CSS selector of the button that should open the modal.
<script src="https://integrations.signcustomiser.com/sign-customiser-embed.js"></script>
<!-- This button can be anywhere on the page -->
<button id="customiser-trigger">Open Customiser</button>
<sign-customiser-embed
customiser-id="YOUR_CUSTOMISER_ID"
integration-id="YOUR_INTEGRATION_ID"
driver="YOUR_INTEGRATION_DRIVER"
mode="modal"
modal-trigger="#customiser-trigger"
>
</sign-customiser-embed>
Wix
Login to your Wix site and click "Edit site" to enter the theme editor
Ensure you have "Dev Mode" enabled. You can enable this by clicking on the "Dev Mode" toolbar option at the top of the theme editor and then clicking "Turn on Dev Mode". We need this enabled in order to get the ID of your trigger button
Add a button somewhere on your site which will open the customiser when clicked
Take note of its ID by clicking on it and looking at the # above it. In the image below the ID is
button3
5. Add the Sign Customiser app to your page (Add elements -> App Widgets -> Sign Customiser)
6. Fill out the required settings (customiser ID, integration ID)
7. Set "mode" To "Modal" and "Modal Trigger" to the ID of your button including the hash symbol. For example, given the image above we would enter #button3
8. Publish your site