Slide Prompt
OneSignal Slide Prompt Details: Customizations, Triggering, and FAQ
The OneSignal Slide Prompt displays top-down center of the browser on desktop and bottom-up center on mobile. This is the most attention-grabbing prompt offered by OneSignal and is shown before the required Native Browser Prompt.
This prompt is used to gauge user interest and add Data Tags. It cannot replace the Native Browser Prompt.
- Desktop (Firefox/Chrome) and Android Chrome versions of Slide Prompt
Slide Prompt Customizations
Customization | Details |
---|---|
Icon | Recommended size 256 x 256 pixels |
Text | Character Count: - Action Message: 90 characters - Buttons: 15 characters Text color, size, font and links currently not available. |
Category Tags | 10 Max Categories/Tags. Can be triggered anytime. |
Delayed Prompts | Set Delay for: - Total Page Views - Time on page Prompts can be triggered programmatically as well for more control. |
Color, Size, Font, Add Links, Localization | Coming Soon |
Add Slide Prompt Icon
Set the icon in your OneSignal Dashboard > Settings > All Browsers configuration > Default Icon URL. You can upload an image or paste a URL to the icon file.
Icon file must be .png
or .jpg
and at least 80x80
pixels (Recommended size is 256x256
pixels for Safari's requirements).
If you do not have a Default Notification Icon URL set, OneSignal will show a generic bell icon. This can always be changed later
Category Tags
The Category Slidedown works just like the regular Slide Prompt except it also allows subscribers to opt-in or out of notification categories set as Data Tags.
There is a maximum 10 categories/tags that can be set within the prompt. Users will be opted-in to all categories by default unless they uncheck the appropriate boxes. Unchecking certain boxes by default is not currently supported.
See Category Prompt for more details.
Setup Slide Prompt
Typical Setup (click to expand)
Navigate to **Settings > All Browsers > Permission Prompt** and select **Push Slide Prompt**. If you don't see it, select **Add Prompt > Push Prompt** to select it.
Customizable options for Slide Prompt.
Option | Details |
---|---|
Customize slide prompt text | Allows editing the message and button text. Not currently supported: Changing Font, Bold, Italicize, Color, adding links. |
Auto-prompt | Show the prompt without additional code. Adds a delay on showing the prompt based on both time and/or number of page views. |
Page Views | Amount of times the user visits a URL of your site with the OneSignal code.0 or 1 page view is the first time they visit the site. |
Seconds | Amount of time that needs to pass while the user is on the page of your site with the OneSignal code for the prompt to show.0 seconds means show as soon as possible (after the site loads).300 seconds means show after 5 minutes. |
Categories | Turns on Category Slidedown feature. See Category Prompt for more details. |
You can combine Page Views and Seconds together. For example, if your common user visits your home page, another page and a 3rd page, you can set: 3
page views and 30
seconds. The prompt will show on the 3rd page and after 30
seconds has passed.
When ready, press Done and Save on the next page to update the settings.
WordPress Setup (click to expand)
Currently you will need to add some Javascript to the site to customize the prompts.
See WordPress Customizations for details.
Custom Code Setup (click to expand)
The Custom Code Slidedown option schema change
As we add new slidedown types, we want you to be able to customize each prompt individually. Moving forward, you will have the ability to set text and delays for each specific prompt.
Note that previous schemas will always remain backwards compatible.
Slidedown configuration is now passed in via an array of options named
prompts
. Each element in the array corresponds to a specific slidedown type:"slidedown": { "prompts": [{...}, {...}, {...}] }
If you list multiple options of the same type, the first one in the array of that type will be used.
Slide Prompt Options:
OneSignal.init({
// Your other init options here
promptOptions: {
slidedown: {
prompts: [
{
type: "push", // current types are "push" & "category"
autoPrompt: true,
text: {
/* limited to 90 characters */
actionMessage: "We'd like to show you notifications for the latest news and updates.",
/* acceptButton limited to 15 characters */
acceptButton: "Allow",
/* cancelButton limited to 15 characters */
cancelButton: "Cancel"
},
delay: {
pageViews: 1,
timeDelay: 20
}
}
]
}
}
// END promptOptions, continue with other init options
}
Category Slidedown with Custom Code
See Category Prompt for more details.
Triggering the Prompt
The Slide Prompt can be shown to users automatically with Delayed Prompts.
You can also trigger these prompts programmatically if you want more control of when they are shown. Toggle off the Auto-prompt switch in Typical Setup or remove the delay code from Custom Code Setup. Then use the following functions to show the prompts:
Prompt | Function |
---|---|
Show Slidedown Prompt method | OneSignal.showSlidedownPrompt() |
Note: If you need to override back off behavior to prompt the user again you can do so by passing {force: true}
example: OneSignal.showSlidedownPrompt({force:true})
. To provide a good user experience however ONLY do this from an action taken on your site to avoid unexpected prompts.
Slide Prompt FAQ
How many times does the slide prompt show?
Please follow this link for more details.
How do I show the prompt in different languages?
This will require the Custom Code Setup. When you detect the browser language with your own setup code, you can initialize OneSignal with the language you want to show.
Why isn't my Slide Prompt showing up?
Non-HTTPS domains are no longer supported
Sites hosted on HTTP are no longer supported. If your site uses our os.tc domain for HTTPS support, please update your code to use your HTTPS domain. Sites that continue to use this domain will no longer be able to prompt for push notifications; however, existing subscriptions will continue to receive notifications. Please contact our support team if you need further assistance migrating from the os.tc domain.
Even if you trigger showSlidedownPrompt()
, it may not always show the message. The message will not be shown if any of the following are true:
- The user previously dismissed the message by clicking the "No Thanks" button
- HTTP sites: The user has blocked notifications for your-label.os.tc
- The user is already successfully subscribed to notifications
- You have manually opted out the user via our
setSubscription(false)
method- If you've intentionally disabled a user's permissions by calling setSubscription(false), you must manually opt the user back in by calling
setSubscription(true)
our drop-down prompt will not show.
- If you've intentionally disabled a user's permissions by calling setSubscription(false), you must manually opt the user back in by calling
If the prompt is not shown, the showSlidedownPrompt()
method returns a Promise that resolves to a string value briefly describing the reason the prompt was not shown. You may also enable debug logging for the SDK via OneSignal.log.setLevel('trace');
to see explanations of why the prompt is not shown.
How to track Slide Prompt Events?
The OneSignal Web SDK has the Slide Prompt Event Methods to detect when it shows on the screen, when it is closed, and the "Allow" or "Cancel" action.
Updated over 1 year ago