This walkthrough will guide you in embedding your Revisual widget on your website via the standard install.
Sometimes, new embeds do not show up in on builder pages until published. We suggest using a test page or private mode to set things up. Once things are set as you want them, you can update the actual page or make your private page public.
Part I: Make sure you have a widget to embed
You will need a Revisual widget (Calendar or Event Alert). If you have not already created one, please do that before continuing this process: https://help.revisual.io/en/articles/9046289-revisual-io-creating-your-first-calendar-or-event-alert
Part II: Make sure you have a website to display it on
Did you tell Revisual about your website(s)? If not, please do that now: https://help.revisual.io/en/articles/9046252-revisual-io-managing-your-websites
Part III: Embed your widget
After you log 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 Calendars or Event Alerts.
Your dashboard will open.
Step 3: Inside your chosen category, open the item you wish to work with.
Step 4: Make sure your item is published. If not, please do that now: https://help.revisual.io/en/articles/11208113-revisual-io-install-overview
Step 5: Click the purple Install button.
You will see the following display:
CALENDARS
[OR]
EVENT ALERTS
Step 6: Click on the Standard install button.
Step 7: Then click the blue Next button. You will see the following display:
EVENT ALERTS
EVENT ALERTS:
Copy and paste the code snippet into the <head> of your website.
Once you have done this, you are finished. Do not do any of the further steps below. They are for calendars.
This is a one-time deal for your first event alert.
You do not have to repeat this process for other event alerts. Once you have installed the script, all event alerts will be displayed on your website.
CALENDARS
We recommend the Default Installation.
However, if you do not have access to the <head> section of your website, please choose the middle one: Alternative Installation (Limited Website Access).
Continue your Default installation with the steps below.
DEFAULT INSTALLATION (FOR CALENDARS)
(1) INCLUDE THE SNIPPET
Click on the "Include the Snippet" Copy to copy the snippet. Paste it into the <head> of your website. This is a one-time action.
(2) EMBED THE CALENDAR
Click on the "Embed the calendar" Copy to copy the snippet. Paste this HTML5 object in the location on your webpage where you want your widget to appear.
Step 1 is a one-time setup that enables your website to display your widget . Once you've completed Step 1, you only need to repeat Step 2 to place your additional calendar widgets wherever you’d like on your webpage.
USING THE ALTERNATIVE INSTALLATION
This installation method is intended for users who are unable to access the <head> section of their website as discussed in the recommended installation. However, please note that this approach is not ideal, especially if you plan to use multiple calendar on the same webpage. Using this method repeatedly can negatively impact your website's speed and the performance of your widgets.
Click on the "Use the Code" Copy to copy the snippet. Paste it into the relevant section of your website.
USING THE EXPERIMENTAL INSTALLATION (FALLBACK METHOD)
This is a fallback method to use if your website theme employs an aggressive stylesheet that prevents the calendar from displaying properly. While this option may help embed the calendar effectively, it’s important to note that it may not offer the same visual integration as the recommended methods. Note: This method will embed your widget in the iframe on website.
(1) INCLUDE THE SNIPPET
Click on the "Include the Snippet" Copy to copy the snippet. Paste it into the <head> of your website. This is a one-time action.
(2) EMBED THE CALENDAR
Click on the "Embed the calendar" Copy to copy the snippet. Paste this HTML5 object in the location on your webpage where you want your widget to appear.