Introduction
Use the Alia SDK to programmatically open a live popup on your store. This can be useful when triggering a campaign from a custom button, link, or other user interaction.
Common Use Cases
You can use the SDK to open a popup when:
A customer clicks a call-to-action button.
A visitor interacts with a banner or promotional element.
A shopper adds a product to their cart.
A customer reaches a specific section of a page.
Opening a Popup
Add the following JavaScript to the action that should trigger the popup, such as a button click, link click, or custom script:
window.alia = window.alia || [];
window.alia.push({
type: "open",
campaignID: 8115,
ignoreTargeting: true
});
Replace 8115 with the Campaign ID of the popup you want to display. The campaign ID can be found from your Campaigns dashboard and beside the campaign title:
Always Show the Popup
The ignoreTargeting parameter controls whether the popup should respect the campaign's targeting rules. Set ignoreTargeting to true to display the popup regardless of the campaign's targeting settings.
Configure the Campaign for SDK Triggering
To ensure the popup only appears when triggered by your custom JavaScript, remove all triggers from the popup. When no triggers are configured, the popup will only display when opened programmatically using the Alia SDK.
Example Implementation
The exact implementation depends on your website platform, page builder, or theme.
Many page builders and website platforms allow you to run custom JavaScript when a button is clicked. In these cases, you can simply add the SDK command to the button's action script, custom JavaScript field, or onclick handler.
Shopify Themes
If you're using Shopify's native Theme Editor, button blocks typically do not support adding JavaScript actions directly. In this case, you may need to add custom JavaScript to your theme that listens for clicks on the button and then executes the SDK command. The exact implementation varies depending on your theme and how the button was created.
If your theme's buttons do not support custom JavaScript actions, you can add a click listener that triggers the popup when a specific button is clicked.
Replace .sf__btn.sf__btn-white with the selector for your button and update the campaignID as needed:
<script>
document.addEventListener('DOMContentLoaded', () => {
document.querySelector('.sf__btn.sf__btn-white')?.addEventListener('click', e => {
e.preventDefault();
window.alia = window.alia || [];
window.alia.push({
type: "open",
campaignID: 8115,
ignoreTargeting: true
});
});
});
</script>
Important Notes
Only live campaigns can be opened using the SDK.
The Campaign ID must match the campaign you want to display.
If
ignoreTargetingis set totrue, the popup will be shown regardless of the campaign's targeting settings.If
ignoreTargetingis set tofalse, the popup will only appear if the visitor matches the campaign's targeting criteria when the request is processed.If
ignoreTargetingis omitted, Alia uses legacy behavior and evaluates targeting based on the visitor's state when the page loaded.When using Shopify's native Theme Editor, custom JavaScript may be required since button blocks do not support JavaScript actions by default.
We recommend explicitly setting
ignoreTargetingto eithertrueorfalsefor predictable behavior.When triggering a popup from a link, remove the link's
hrefor usee.preventDefault()to prevent page navigation from interrupting the popup trigger.