How do I add a Google calendar to a page?

[bellam]

I can't for the life of me work out how to add a google calendar to a page. I've followed all the steps in multiple videos and articles and still can't seem to do it. On the page it just comes up with the link. Any help would be greatly appreciated! Thank you.

[r8r]

@bellam - what do you want the Google calendar to do?

Mario

[bellam]

Hi! 
I’d just like for customers to be able to see what dates have been taken for weddings etc. 

thanks in advance

[lucas05021]

Have you solved this problem now?

[bellam]

1. Not yet 

[r8r]

@bellam – so you've got a regular Google Calendar embed code?

 

I just tried it with a page template – works for me without a hitch:

Is that what you need?

All the best – Mario

[adtastic]

How? I added Google Calendar imbed code to a shopify page and it just shows the code on the page. When I look at the pages non html version it seems to have stripped the html. Doesn't seem you can do this so how did you?

[adtastic]

Actually was able to solve my own problem so if anyone else is trying to figure this out. I used the template customizer. made a new page template. inserted an html block. Put the code in that block. Used that page template for my page. (content will be blank when you are editing the page from within the shopify admin but no worries the code is still there if you added it from within the customizer) Voila'.

[r8r]

I was just going to ask whether you set up a new template (correct way) or just added the code in to the page content.

Glad you figured it out.

[ShopForeverFive]

Hello @r8r

I embedded my calendar onto a page but when I check it via mobile mode it displays cut off vs complete calendar size.   I'm not sure where to look to correct this part on the back end of my site. Is there a way to correct it?

https://forever-five-jewelry.myshopify.com/pages/partnerpink

Thank you,

Heide

[adtastic]

First, make sure the page itself is it's own fresh template, not a default one. Secondly, the only way I know of to make it work is custom css code. See this thread: https://thomas.vanhoutte.be/miniblog/make-google-calendar-iframe-responsive/

[r8r]

@ShopForeverFive I haven't tried this myself yet, but @adtastics approach seems promising.

Mario

[babysoftluke]

Hey - realize this thread may be a bit old. But I run The Shop Calendar app (https://apps.shopify.com/the-shop-calendar). I've built a Google integration directly into the app so all you have to do is upload the public .ics URL that Google gives you. 

May be a little easier than having to install the Google calendar using the embed link. Happy to help as well.