Requirements
1. Use data-onesignal-unique-label
for click tracking
All clickable elements must have a data-onesignal-unique-label
attribute with a unique value. This enables OneSignal to:
- Track click analytics
- Correctly trigger associated actions
HTML
If two elements share the same
data-onesignal-unique-label
, clicks may be logged incorrectly or actions may not fire. 2. Attach event listeners
You must explicitly attach JavaScript event listeners to trigger OneSignal in-app actions.JavaScript
HTML
Available functions
All click actions from the Block Editor are also available for HTML in-app messages.Push permission prompt
Shows the native push notification permission prompt. Click events are automatically tracked. See Prompt for push permissions.HTML
Location permission prompt
Shows the native location permission prompt. Click events are automatically tracked. See Location permission prompts.HTML
Close in-app message
Dismisses the current in-app message. Click events are automatically tracked.html
Tag user
Sets a Tag. Click events are automatically tracked.HTML
Open URL
Opens a URL in the device’s browser and closes the in-app message. Click events are automatically tracked. Supports Deep Linking.HTML
Click name
Assigns a click name that can be read in the in-app message click listener. Click events are automatically tracked. Supports Deep Linking.HTML
Track click
Tracks a click event when you’re not using other clickable API methods.html
Send Outcome
Tracks a Custom Outcome. Click events are automatically tracked.html
Personalizing HTML in-app messages
You can use tag substitution in HTML in-app messages just like in the Block Editor. Tag substitution does not work inside
<script>
tags. - Inline text (
<h1>
,<p>
,<li>
, etc.) <style>
rules:CSS- Attributes with URLs:
href
src
<form action>
<object data>
Using tags in openUrl()
and addClickName()
Since <script>
tags don’t support substitution, use one of these methods:
1. Access all tags with liquidPlayerTags
This global object becomes available after DOMContentLoaded
.
HTML
href
attribute
HTML
Next steps
- Learn more about using liquid syntax for tag substitution
- Explore Deep Linking for URL handling
- Design in-app messages with HTML