Add a Google Calendar to your HugoFox website
Keeping your community’s diary front‑and‑centre makes it easy for visitors to see what’s on—and even easier for them to save events straight to their own calendars. Below you’ll learn how to connect a Google Calendar to any page on your HugoFox site in a few quick steps.
1 Gather your Google Calendar link
-
Sign in to Google Calendar and hover over the calendar you wish to share.
-
Select the three dots ► Settings and sharing.
-
Scroll to Integrate calendar and copy either the Public URL to this calendar or the Embed code.
Tip: The public URL lets visitors open the calendar in their own Google account; the embed code is perfect for showing a live agenda right on your website.
2 Add a calendar block to your page
When you build or edit a page in the HugoFox site builder, you’ll find a Calendar block alongside Text, Image and Gallery blocks.
-
Open the page where the diary belongs.
-
Choose Calendar from the block list.
-
(Optional) drag the block to the exact spot you want—HugoFox’s grid makes alignment simple on desktop and mobile.
Note: You can add multiple Calendar blocks on different pages—handy if you run separate diaries for a parish council and village hall. Each block can pull from a different Google Calendar so every audience sees only what’s relevant.
3 Paste your Google Calendar code
-
In the new Calendar block, paste the Public URL or Embed code you copied in Step 1.
-
Hit Save or Save & close
That’s it! HugoFox renders the calendar responsively, so it scales from large desktop screens down to narrow phones without extra work. Even better, the block syncs with Google every few minutes—any change you make in Google Calendar (new event, time tweak, cancellation) appears on your site automatically.
Important: Never paste the “secret iCal” address. It grants full edit access to anyone who finds it. Stick to the public link.
4 Adjust visibility and permissions
Back in Google Calendar, make sure the calendar is set to Public (or at minimum “See only free/busy” if you’re sharing sensitive details):
-
Open Settings and sharing.
-
Under Access permissions, tick Make available to public.
-
Decide whether to show full event details or free/busy slots only.
If you need tighter control—say for a members‑only sports club—leave the calendar private and grant access to each member’s Google account. The Calendar block will respect those permissions: only logged‑in members will see the content.
5 Test the calendar on your site
Open the page in an incognito browser window. You should see the calendar load within two seconds and today’s date highlighted. Click a few events to confirm titles, times and any description text appear correctly.
Tip: Add a test event for five minutes in the future. After saving in Google Calendar, refresh your HugoFox page. The new event should display instantly—proving the sync is live.
6 Encourage visitors to subscribe
To help supporters keep up to date:
-
Add a short line beneath the calendar: “Want these events in your diary? Click this link to add them to your own Google Calendar.” (link to the same public URL you copied earlier).
-
Mention the calendar in your next newsletter and social posts—remind readers they’ll get automatic updates when events change.
7 Keep your events tidy and up to date
A shared calendar is only useful when it’s current. Set a monthly reminder to:
-
Remove past events older than six months.
-
Double‑check recurring meetings still take place.
-
Update start/end times if agendas shift.
Consistent housekeeping means your audience can rely on the information—and Google likes fresh content too (a subtle SEO boost).
Conclusion
A live Google Calendar turns your HugoFox site into a real‑time “What’s On” hub—saving you repetitive emails and helping visitors save the dates that matter.
Need a hand? Our support team is here 24/7:
-
Email us at team@hugofox.com
-
Use the contact page
-
Silver or Gold customer? Call us on 01635 888 442