Embedding is a publishing option that allows you to place your campaign on your own website. This helps to promote your campaign by leveraging the traffic that the website already brings in. In this doc, we'll focus specifically on embedding your campaign as a pop-up:
- When your campaign is ready to be published, click the blue Publish Campaign button in the top-right corner of the Campaign Builder.
- Click the blue Embedded on Website button in the pop-up.
- Next, you'll be asked to enter the URL of your web page where the campaign will be displayed.
When a desktop user visits your campaign's ShortStack-issued URL, we'll silently redirect to the URL you provide here. For a mobile user, we can also redirect to this URL; but if your site isn't optimized for mobile, you may want to try the Show stand-alone page option in the publication settings. You can change both the URL and the mobile redirect setting later if needed.
Once that's complete, click the blue Next button.
- This leads to a page where you can customize the URL for the campaign. Keep in mind that since you're embedding the campaign as a pop-up, the only time any visitors would see this URL is when they're sharing it, or if you set things up to direct mobile visitors to the stand-alone landing page version of your campaign.
A walkthrough of customizing your URL (both subdomain and domain) can be found in our Publishing a Campaign help doc.
When finished, click on Publish.
Note: Customizing the domain (or publishing entirely to a custom domain) is only available on the Pro Plan or higher.
- Congratulations! You've officially published your campaign as an embed! You're not quite done, though. You'll need to grab the embed code and place it on your website; but there are a few options to check out first, depending on how and when you want the pop-up to appear.
Make sure the Pop-up tab is selected, then click open Advanced Settings. Here, you'll see all the available options for the behavior of your pop-up:
Pop up on exit intent: An exit intent pop-up is a technique used to retain visitors who are going to leave the site. With an exit intent pop-up, the visitor's mouse movements are tracked, and when the cursor moves outside the upper page boundary (because the tab bar is usually there) the pop-up is shown.
Pop up after idle timeout: Display the pop-up after a period of time if no feedback--clicks, touches, or mouse movements--is registered from the visitor. You can set the timeout period using the Seconds field.
Timed pop up: Displays the pop-up after a period of time. Set the amount of time using the Seconds field.
Pop up on scroll position: Display the pop-up after a visitor scrolls at least a certain percentage down the page. Set the percentage using the % Scrolled from top field.
Max Width & Max Height: These allow you to set how big you'd like the pop-up to appear on screen. You can use pixel values or percentages.
Once you have your pop-up's behavior selected and the settings in place, click the blue Copy button for the first bit of code under Step 1. Then, paste it into the code of the page on your site where you want the pop-up embed to be displayed.
- If you are planning to have the pop-up triggered by clicking on a link, you then need to click the blue Copy button for the second bit of code, under Step 2. Paste that snippet of code on your site where you'd like the link to appear. Do note that you can edit the text of the link - by default, it will appear as Enter Here.
If you are using any of the pop-up options under Advanced Settings, there's no need to use the Step 2 code at all!
- With that, you're finished! Click the blue Close button.