Event Alerts is an automated, 'set it and forget it' statement which gives information about an upcoming (or happening now) event. This innovative tool drives conversion and saves you time. You can customize when and where to display the event highlight based on different settings, and you won't have to manually update – the highlight will disappear once the event is over!
NOTE: You can set up as many Event Alerts as you wish. HOWEVER...
Only one alert will display at a time. The display order is by date. In other words, any later event alerts will be overlain by the most current event alert.
See an example in this video:
HOW TO GET TO THIS ITEM
After logging in to Revisual...
Step 1: If you do not see the dropdown menu under Widgets, click on Widgets to open the menu.
Step 2: Click on Event Alerts.
Your dashboard will open. You will not have any items, since this is your first event alert.
Step 3: Click on the purple Create new button (top, right-hand corner in image above, closeup below).
To create a new alert, click on the blue +Create new button.
To work with an existing alert, click on the 3-dots in the Action column and choose Edit from the pop-up menu.
HOW TO USE THIS ITEM
DESIGN:
SETUP
1. Choose the website on which this event alert will display. If there are no websites to choose from, it means that you have not told Revisual about your website(s), please do it now: https://help.revisual.io/en/articles/9046252-revisual-io-managing-your-websites
2. Tell Revisual on which page(s) to display your event alert.
If you choose a specific page, we will ask for the URL.
Please note: Revisual is unable to check the accuracy of URLs. Please double check your data so as to avoid issues later.
3. Now you will organize your main filtering. You use the connectors 'and' + 'or' to mix and match. This filtering logic is powerful (and a little complex). So we have given it its own article: https://help.revisual.io/en/articles/8985913-revisual-io-setup-events-filtering-options-and-logic
4. Give your event alert widget a name and choose the Google Calendar integration.
5. Click on the purple Update button to confirm your changes.
NOTICE
At the bottom of the page there is a line which says: Events matching filter criteria.
Click to open a list of events which match the conditions you chose with your filters.
DESIGN: CONFIGURATION
Location
Position: Where on the page the alert will display.
Choices: top or bottom of the page.
Placement: Whether the banner will stick to the position (not move)
or scroll with the page.
Behavior
Show after: When should the alert first appear.
Allow user to hide the banner: Whether the viewer can dismiss the alert
or not. Toggle on or off.
Show banner again after: When the alert should display again.
Messaging
Type in your opening and closing messages.
DESIGN: DESIGN
Some of the items begin with the word 'initial'. What does that mean?
COLORS
There are many styling options for your Event Alerts. One group is colors. You can match your organization branding. Or perhaps you want to match the color scheme of an event.
Let's look at an example...
The two views below show the Revisual default color settings.
Here is how the Event Alert looks at the start:
Then it changes to:
Before we begin, here is more info about the colors
Initial background color: The color of the banner background when it first appears.
Background color: The color of the banner background after a second or two.
Initial text color: The color of the text when it first appears.
Text color: The color of the text after a second or two.
Close button color: The color of the 'x' in the second view. [You cannot change the
color of the 'x' in the initial view.]
Close button color on hover: The color of the 'x' on hover.
DEFAULT SETTINGS (See how this looks in the images above this table) | CUSTOM COLORS (See the changes in the images below this table) |
|
|
If you are not yet familiar with using our custom color picker, check out this helpdesk article: https://help.revisual.io/en/articles/11204387-custom-color-picker
Using custom colors...
Here is how the Event Alert looks at the start:
Then it changes to:
And hovering over the close button:
TYPOGRAPHY
Font Family
Choose the font for all your text and numbers EXCEPT the numbers in your countdown timer (if you choose to show one).
Default
This is the choice of Revisual.
Inherit
In this option, the font is inherited from your website or other embeddable component.
Custom
Step 1: Click on Custom. It will show the default or inherited font. Click on the X (brown box below) to erase this choice.
Step 2: If you click on the capture line, you will see the message, "No options" (brown box below). There are many options, but you need to start typing to see them.
Step 3: Begin typing on the capture line (brown box below). As you can see (blue arrow below), a dropdown list of options is populating. If you know the name of the font you wish to use, type in the name. If not, scroll down the list, choose fonts and experiment with how they change the look of your calendar and/or events list.
SIZE
Click and drag to choose the size of your text.
DESIGN: CALL TO ACTION
SETUP
Show Call to Action button: Toggle this on to show a button; toggle off not to show one.
Open links in a new tab: How the links should behave.
CTA action: What the button should link to. NOTE: If Revisual does not have the correct information to correctly perform the CTA action you chose, the CTA button will not display.
Use default CTA button label: The text appearing on the button. Use the Revisual default or type in your own text. If you toggle off this option, CTA button label appears. Type in your name in the space given. We have typed in 'Learn more'.
DESIGN: DESIGN
In this section, you will choose the colors of your CTA.
Default: The choice of Revisual.
Custom: Your own preference.
If you are not yet familiar with using our custom color picker, check out this helpdesk article: https://help.revisual.io/en/articles/11204387-custom-color-picker
DESIGN: COUNTDOWN TIMER
On all day events, the Revisual default is NOT to display the countdown timer . However, you can override this default. Just toggle on Show countdown timer for all day events.
SETUP
Show countdown timer: Toggle this on to show a countdown timer; toggle off not to show one.
Show countdown timer for all day events: Toggle this on to show a countdown timer; toggle off not to show one.
TYPOGRAPHY
Choose the font for your countdown timer numbers. WorkS in the same way as Typography in the Design Section.
SIZE
Click and drag to choose the size of your numbers.