06 August 2016

How to Add Google Calendar to your Facebook page?

That is the question, I have been investigating today. I knew that was possible, as I saw calendars posted on different Facebook pages, but did not find any embedded in Facebook option for such integration.

Here are instructions from Computer Genie blog which work:

Step 1: Create Google Calendar, if you need one and you do not have one.
This is usually unneeded step for such integration, as I assume you already have the calendar you are interested to work with.

Step2: Find the embed code for this calendar, which can be used for all purposes: embedding in Blogger blog, stand-alone website, and in Facebook.

ü  Expand the My Calendars column (on the left of Calendar page). 
ü  Hover over the calendar and click on the drop-down arrow, showing a full options menu for customizing your calendar. 
ü  Choose Calendar Settings. Spend some time here making adjustments to your calendar and when you are ready... This step is optional.
ü  Copy the html code that appears in the text box under the heading "Embed This Calendar"

Step 3: Install Static HTML: iFrame tabs app to your Facebook account.

ü  Click the button "Add Static HTML to a Page". 
ü  Choose your page from the drop-down menu and choose "Add Page Tab"
ü  Go to your page and click on the Welcome tab and Edit Page Tab button.

There are a lot of things you can add here and play with, but we want to simply add the html code we copied above.

ü  Notice that you are looking at the "Content" tab. Paste the html code into index.html. There is a paragraph already there giving simple instruction. Delete all the text and PASTE (keyboard shortcut: Ctrl + V). 
ü  Next, click on the "Tab name & image" tab. Simply change the name of the tab here OR wait to do this back at Facebook.
ü  Preview and/or Save & Publish.

Step 4: Review your results and adjust the tab position on the Facebook page.

ü  The code was embedded to the Facebook page: https://www.facebook.com/TherapyDance/
ü  The tab with the name Welcome modified to the desired label appears at the left menu.

ü  To move it up or dawn in the column, use the Manage Tabs button on the bottom of the list.
ü  Now, you can see the Google Calendar properly showing up, when you click on the tab. The same way as you do directly at the Google website, you can choose the proper view – Week Month, Agenda, etc.

No comments:

Post a Comment


Related Posts Plugin for WordPress, Blogger...