Publish Unsaved Changes to Your Quiz
Step 1: To being promoting your quiz, from your dashboard click Share & Embed on the quiz you would like to promote.
Step 2: If you have any unsaved changes to your quiz, you will be prompted to publish these changes in order to continue. Click Publish Changes to continue.
Install the Interact Promotions Script on Your Website
Step 1: On the next screen, you will see all of the promotion methods that Interact offers. Click Use as announcement bar on your site to continue.
Step 2: In order to use the announcement bar on your website, you will need to install a code snippet on your website. Click Copy code to clipboard and paste the code into your website immediately before the closing </head> tag. Or click Email code to developer if someone on your team is responsible for updating your website.
Customize Your Announcement Bar
Next, you will be able to customize the design and settings of your announcement bar. We support the following settings:
- Announcement Text - This is the message that displays next to the button in your announcement bar. By default this is your quiz title.
- Button Text - This is the text that displays on the button in your announcement bar. The button links to your quiz.
- Background Color - Click on the color picker to change the color of the announcement bar background.
- Font Color - Click on the color picker to change the color of the text that is displayed on the announcement bar.
- Button Color - Click on the color picker to change the color of the button that is displayed on the announcement bar.
- Button Font Color - Click on the color picker to change the color of the text on the button that is displayed on the announcement bar.
- Timer Delay - This is the delay from when the user visits your web page to when the announcement bar is shown. This number is in seconds.
- After announcement bar is shown, don't show again for - Once a website visitor is shown the announcement bar, they will not be shown the announcement bar again for the amount of time your specify here. This number is in days.
- Push website content down when announcement bar is visible - You can choose whether you want the announcement bar to push your existing website content down or whether you want the announcement bar to show up overlaid on your existing website content.
Selecting which pages the popup shows on:
Interact supports various rules to decide what webpages to show or not show your Announcement Bar. These settings are located under the Edit Announcement Bar Visibility section.
Step 1: Check the checkbox labelled Show announcement bar only when visitor is on certain pages to enable this setting.
Step 2: Your first step will be used to determine if ALL of the rules must be true in order for the announcement bar to be shown to a visitor or if only ONE of the rules must be true for the visitor to see the announcement bar. This depends on what webpages your want your visitors to see your announcement bar. Under Show to visitors Select either who match all these rules OR who match any of these rules.
Step 3: You now have the ability to add specific URL paths from your website to create rules about which visitors see your announcement bar. Each rule is structured in the following way:
Show when the URL path [exactly matches/does not exactly match/contains/does not contain] YOUR_URL_PATH
For example, if you only wanted visitors to see your announcement bar when they are on the your store homepage with the URL: https://example.com/my-store, you would create a rule that says:
Show when the URL path [exactly matches] /my-store
Another example, if you only wanted visitors to see your announcement bar when they are on ANY page of your online blog, including the URLs: https://example.com/blog and https://example.com/blog/post-title and https://example.com/blog/category/marketing, you would create a rule that says:
Show when the URL path [contains] /blog
Step 4: You can add as many rules as you need by clicking Add a Condition. You will then repeat Step 3 to add additional rules.
Activate Your Announcement Bar
Activating the current quiz
If this is your first time activating an announcement bar for a quiz, turn the switch ON by clicking on the switch. Once you see the switch turned green and ON, your quiz will begin to be promoted with an announcement bar on your website.
Switching which quiz is being promoted
If you are already promoting a different quiz in an announcement bar on your website, you will see this warning when you try to activated the current quiz:
You have two options in this scenario: (1) Switch the quiz being promoted to the current quiz you are viewing or (2) Turn off the announcement bar for all quizzes which will stop the announcement bar from being shown on your website at all.
To switch the quiz being promoted to the current quiz, just simply turn the switch ON by clicking on the switch. Once you see the switch turned green and ON, your new quiz will begin to be promoted with an announcement bar on your website.
Troubleshooting Your Announcement Bar
Once you have installed the script on your website and activated your quiz as described above you will be able to see your new announcement bar on your site.
If you do not see your announcement bar showing up on your site, you will want to make sure that you have installed the code properly on your website. It can be helpful to have your developer check to ensure it is installed correctly. You will also want to be sure that the activation switch is turned ON for the quiz you want to promote.
Why is my announcement bar covering my website header?
To prevent your announcement bar from covering your website header you will want to check the box under the setting Push website content down when announcement bar is visible.
If this setting is checked and it is still covering you website header, this is most likely because your website header has fixed positioning. Because of this type of header positioning the announcement bar will show up covering your website header.