GetDotted Domains

Freeola Guides

 

Embedding a Google Calendar

If you use a Google Calendar to keep your customers, visitors, or members up-to-date with events related to your website, the RQS Snippet feature allows you to include this directly onto your webpage.

This calendar section will automatically update every time you add an event, is fully interactive and even provides an option for visitors to save your event into their own Google Calendar.

Due to restrictions put in place by Google, you can only obtain the codes required from the desktop website, not the mobile or app version of the Calendar.

Embedding the Calendar onto your website

To start, open your Google Calendar then select the Settings (Cog Icon) from the top-right corner then Settings again. In the left-hand pane, click the Calendar you would like to embed.

RQS Embed Calendar

In order for your Calendar to appear for all visitors to your site you will be required to make this Public.

To do so, click Access Permissions For Events on the left-hand pane (or scroll down to the section headed the same thing in the main content area) and tick the box next to Make Available to Public.

RQS Embed Google Calendar

Next, click Integrate Calendar (or scroll down to that section) then Customise. This will open a new tab allowing you to set certain aspects of your Calendar for when it displays on your page. This page allows you to customise what displays on the calendar, the colour and size of the calendar and also allows you to incorporate other calendars within your Google account, if desired.

RQS Google Calendar Embed

Once you have designed your calendar either manually copy the code within the Embed Code field, or click the Copy Icon to automatically copy this code into your clipboard.

RQS Embed Google Calendar

Now login to your RQS builder. Select the page you wish to add this content on from the Manage Pages menu item then using the Right-Click Menu, use the Edit Content option (or Add a Content Section) within the area you would like the Google Calendar to display.

When editing the Content Area, right-click again and select Add Page Element, then Add Snippet. Next move your mouse cursor to your desired location, and click to Save.

In the example below we are placing our Google Calendar at the top of our content area.

RQS Snippet Placement

Now either Double-Click the Snippet Area or select Manage Snippets from the Website Tools menu to open the Manage Snippets window. Select Create a New Snippet then enter your chosen Snippet Name in the relevant field.

We would advise you choose a Name that you can later identify, such as Google Calendar, or Events Calendar.

If you have created a Snippet previously that you would like to edit, simply select the Edit Icon next to the Snippet Name to open this window.

RQS Google Calendar Snippet

Now paste your code from Google into the Snippet Content field.

If your browser does not allow you to Right-click>Paste, then you can use the keyboard shortcut of 'CTRL+V' to add this information.

RQS Google Calendar Snippet

Click Finish once done.

You will be returned to the Manage Snippets window, from which you will need to select your new Snippet by selecting the radio button on the left. Once you have done so, click Finish (or Select Snippet).

RQS Select Snippet

Your Snippet Element will now update to show your Snippet Name and will allow to you change placement again, if required.

Due to the width of the Google Calendar information you will need to increase the width of your Snippet to 20 columns to see information for every day.

RQS Google Calendar Embedded

Let site visitors save a calendar event

You can also add a Google Calendar button to your website so visitors can quickly save your event on their own Google Calendars.

To let anyone save your calendar event you'll need to make your calendar public, if you haven't done so already. If you are following this guide you will already have done this. If required, you can return to this part of the guide here.

To create this link on your site create your calendar event (or navigate to a previously created event) then select Options.

RQS Google Calendar Event

From the menu that opens click Publish Event then Copy next to the HTML Code field on the Publish Event window.

RQS Publish Event

Once the code has been copied return to the RQS Builder and create your Snippet - as we explained above.

In order to see the entire Google Calendar Button a Snippet width of 3 columns is required.

In the example below we have added some text, placing the button underneath.

RQS Google Calendar

Click Finish to save your changes and return to the builder. Your event button will now appear for all visitors allowing them to add your event to their own Google Calendar.

RQS Google Calendar Event


Did you find this article helpful?


Freeola & GetDotted are rated 5 Stars

Check out some of our customer reviews below:

Thanks for that...
Worked like a charm, again proof why i continue using you guys for our ADSL connection and web hosting. Fixed in 10 mins flat!
These days we are often quick to criticise and slow to praise...
... but I just wanted to say that the service from Ross this afternoon was excellent. He was polite, cheerful and very helpful - keeping me informed throughout the process Well done indeed.

View More Reviews

Need some help? Give us a call on 01376 55 60 60

Go to Support Centre
Feedback Close Feedback

It appears you are using an old browser, as such, some parts of the Freeola and Getdotted site will not work as intended. Using the latest version of your browser, or another browser such as Google Chrome, Mozilla Firefox, Edge, or Opera will provide a better, safer browsing experience for you.