{"id":18249,"date":"2019-11-18T12:46:59","date_gmt":"2019-11-18T17:46:59","guid":{"rendered":"https:\/\/www.boldgrid.com\/support\/?p=18249"},"modified":"2020-03-12T14:39:18","modified_gmt":"2020-03-12T18:39:18","slug":"how-to-embed-a-google-calendar-in-your-page-content","status":"publish","type":"post","link":"https:\/\/www.boldgrid.com\/support\/troubleshooting\/how-to-embed-a-google-calendar-in-your-page-content\/","title":{"rendered":"How to Embed a Google Calendar in your Page Content"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<?xml encoding=\"utf-8\" ?><html><body><p>Using a Google Calendar in your website is a great way to keep your users informed about upcoming events and schedules.&nbsp; This guide will demonstrate how you can embed a Google Calendar in your BoldGrid website.<\/p>\n<p>The first thing you will need to do is to make sure that the Permissions settings for your calendar are correctly configured to make it available to the public.&nbsp; Locate the calendar you want to embed on your website using the Google Calendar interface and select the three vertical dots and open the settings for that calendar.<\/p>\n<p><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-01.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-18250 aligncenter\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-01-300x104.png\" alt=\"\" width=\"300\" height=\"104\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-01-300x104.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-01-250x87.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-01.png 315w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-02.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-18251 aligncenter\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-02-300x232.png\" alt=\"\" width=\"300\" height=\"232\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-02-300x232.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-02-250x193.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-02-233x180.png 233w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-02.png 387w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>Make sure that in the Permissions settings anyone can view the event details for your calendar.<\/p>\n<p><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-03.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-18252 aligncenter\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-03.png\" alt=\"\" width=\"225\" height=\"193\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-03.png 225w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-03-210x180.png 210w\" sizes=\"auto, (max-width: 225px) 100vw, 225px\" \/><\/a><\/p>\n<p>Once the permissions are set correctly copy the Embed code under the Integrate calendar section.<\/p>\n<p><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-18253 size-full\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04.png\" alt=\"\" width=\"647\" height=\"352\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04.png 647w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04-300x163.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04-610x332.png 610w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04-250x136.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04-550x299.png 550w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04-331x180.png 331w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-04-551x300.png 551w\" sizes=\"auto, (max-width: 647px) 100vw, 647px\" \/><\/a><\/p>\n<p>Navigate to the Page you want to embed the calendar on in your website&rsquo;s Dashboard.&nbsp; The embed code copied from Google is formatted for HTML, so switch your editor to Text mode to ensure that the code is entered correctly.<\/p>\n<p><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-large wp-image-18254 aligncenter\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-1024x290.png\" alt=\"\" width=\"1024\" height=\"290\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-1024x290.png 1024w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-300x85.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-768x217.png 768w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-610x173.png 610w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-250x71.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-550x156.png 550w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-800x226.png 800w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-637x180.png 637w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05-1061x300.png 1061w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-05.png 1319w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<p>Paste the embed code into your content and save your changes.<\/p>\n<p><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06.png\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-18255 size-large aligncenter\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-1024x293.png\" alt=\"\" width=\"1024\" height=\"293\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-1024x293.png 1024w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-300x86.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-768x220.png 768w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-610x175.png 610w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-250x72.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-550x158.png 550w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-800x229.png 800w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-628x180.png 628w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06-1047x300.png 1047w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-06.png 1277w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<p>You should now see your calendar embedded in your page content when viewed from the front.<\/p>\n<p><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-18258 size-large\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-1024x665.png\" alt=\"\" width=\"1024\" height=\"665\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-1024x665.png 1024w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-300x195.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-768x499.png 768w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-610x396.png 610w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-250x162.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-550x357.png 550w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-800x520.png 800w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-277x180.png 277w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-462x300.png 462w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07-769x500.png 769w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/11\/gcal-07.png 1465w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>Using a Google Calendar in your website is a great way to keep your users informed about upcoming events and schedules.&nbsp; This guide will demonstrate how you can embed a Google Calendar in your BoldGrid website. The first thing you will need to do is to make sure that the Permissions settings for your calendar [&hellip;]<\/p>\n","protected":false},"author":880,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"bgseo_title":"","bgseo_description":"","bgseo_robots_index":"index","bgseo_robots_follow":"follow","footnotes":""},"categories":[74],"tags":[],"class_list":["post-18249","post","type-post","status-publish","format-standard","hentry","category-troubleshooting"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/18249","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/users\/880"}],"replies":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/comments?post=18249"}],"version-history":[{"count":3,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/18249\/revisions"}],"predecessor-version":[{"id":18259,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/18249\/revisions\/18259"}],"wp:attachment":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/media?parent=18249"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/categories?post=18249"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/tags?post=18249"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}