Friends2a Google Calendar — Installation & Setup Guide

Friends2a Google Calendar lets you embed your Google Calendar directly into your Shopify store. This document explains how to set up and configure the calendar for a clean, responsive display.

Prerequisites
– A published Google Calendar or Appointment Schedule
– A Shopify store with an Online Store 2.0 compatible theme
Get Google Calendar Embed URL
1. Open Google Calendar
2. Go to Settings
3. Select Settings for my calendars
4. Choose the calendar you want to embed
5. Scroll to Integrate calendar
6. Copy the Embed URL from the iframe src (not the full iframe code)
Example:
https://calendar.google.com/calendar/embed?src=XXXXXXXX

Add App Block to Page
1. Go to Shopify Admin
2. Navigate to Online Store → Customize
3. Select a page (Home, Contact, Booking, or custom page)
4. Click Add section/block
5. Choose Friends2a Google Calendar
6. Position the block on the page
7. Click Save

Configure Calendar Settings
⦁ Google Calendar URL: Paste the iframe src embed URL
⦁ Calendar Max Width: 1000–1400 px
⦁ Calendar Height (Desktop): 1100–1300 px
⦁ Calendar Height (Mobile): 1500–1800 px
⦁ Background Color: Optional
⦁ Border Radius & Padding: Optional

Verify & Adjust
1. Preview the page on desktop and mobile
2. Increase height if inner scrollbars appear
3. Adjust max width if layout feels narrow or wide
4. Test date navigation and appointment visibility
Completion
Your Google Calendar is now embedded inline on your Shopify store. Customers can view availability and schedules without leaving your site.