1.07.2008

Adding Google Calendar to Blogger

Adding Google calendar to Blogger is not as hard as you might think. I just figured out how to do it today so I could tell you! Follow these steps and you will be in business. I tried to include screen shots every step of the way, so click the picture to see examples!

1) Prepare Blogger
From your main blog page, hit "customize" in the upper right hand corner. That will bring you some options. Make sure the "Template" tab at the top left is selected. You'll see a basic page layout with the option to "add page element" at the bottom of the large column AND at the top of the right column. The calendar, due to its size, works best in the large column; however, we'll be learning how to add elements in the sidebar later, so note the location of the link.

Click on "add page element" at the bottom of the page and it will bring up some options to add. Take a second to look at some of the cool things you can add--pictures, surveys, videos, lists, etc. More on those later. Click the "add to blog" button under "HTML/JavaScript."

A simple window will open. Stop there. We need to open Google in a new tab or window and get the information for the box. On to Step 2!





2) Prepare Google Calendar
Open Google Calendar in a new window or tab. Locate the calendar box in the lower left hand corner (see screen shot). Click on the down arrow of the calendar you wish to add to blogger (if it's more than one, we'll get the other later) and choose "calendar settings."

On the calendar settings, you will see the "Embed This Calendar" option. Click the blue link that reads "customize the color, size..." It will open a new window.

3) Format the Calendar
This may look a little scary at first, but you can do it! All of the settings are on the picture from the example on this blog. Feel free to play around with the settings, though. You won't break anything and you can always close the window and go through step two again. Your actual calendar will not change.

Once you're happy with how it looks, choose the "update html" button. Then select all of the text in the box and choose "copy." Now head back to that blank box in Blogger--that's where we're pasting the code!

4) Adding Calendar to Blogger
Back to Blogger. Remember that empty window waiting for some code? Now you've got it. Paste it into the box, add a title, and hit "Save changes."

5) Moving the Calendar
Your calendar is at the bottom of your page now! Nice job! Told you you could do it! Now you might want the calendar at the top, like the example. It's very easy to do (cake compared to what you've accomplished today)! Go back to the template page (see step 1 if you forgot how to get there). There should now be a box representing the calendar (titled whatever you called your calendar). Click and hold on the box and drag it above the "blog posts" box. It is possible to drag it higher if you want it there, but if you do that by mistake, just drag it back down.

Congratulations! You did it! From here on out it should be easier. Nice job!


11 comments:

Unknown said...

My calendar is huge. Can it be made smaller to fit in the column? How?

Gospel Publishing House said...

Hi Greta!

Yes, your calendar can be made to be whatever size you like. If you go to point #3 of this post ("Format your Calendar") and click the picture to the right, it will pull up a larger image with more specific instructions. On the picture you will see two boxes on the left side called "Width" and "Height" in pixels. These boxes are where you would enter a number indicating the size.

Now the question is "how many pixels?" Because every template is different, I can't say for sure, but I'll give you these guidelines: the one on this blog is 450w x 400h. If I were to do one in the right hand column, it would be around 230w x 300h. You can play around with it on Google and it will show you how big it is.

Keep in mind that by making it smaller it is harder to see what is actually ON the calendar. Bummer, I know, but free isn't perfect :)

Glad you're having success setting up your own page. I hope you encourage others to do the same. We will be doing a follow up this Spring with information on training parents on the Internet and what they need to know to guide and protect their kids. Stay tuned!

Betsy

Unknown said...

Thanks for your help Betsy. I have been encouraged, maybe even taunted, by my fellow ministers to start blogging these past few months. I didn't want to do it because of the upkeep. I also have been trying to think of ways to connect with parents, volunteers, and children better. I have been thinking of a web sight linked to our churches, but it seemed daunting. Then your e-newsletter came out and I was curious. I went ahead have have started the set up. I love learning new stuff. So it has been a blast. Now I need to refine and strategize. If you could pray for me and those of us that are trying to do the right thing and do it well, that would be appreciated. Thank you for your blog on setting up a web page on a blog sight.

By the way, I got the calendar resized and I love it. :-)

Chana Leib said...

Thank you very much for the clear explanation- I was able to do it very easily!

Ms. MacKay said...

Thank you so much for this helpful (and desperately needed) information!

Jennifer Zoe Lewis said...

Thank you thank you thank you! I finally got this up with your help! Blessings~

Unknown said...

Both my sister-in-law and myself have been trying to figure this out for weeks!!! Thanks so much for your very clear explanation!!!!

KrisZ0213 said...

I was able to embed my google calendar into my blogger page, but when I try to view the calendar in the blog not logged in to my google account it prompts me to either sign-in my google account or create one. I don't want everyone who views the calendar to have to set-up a google account. Is this fixable or a requirement of using google calendar? Any suggestions?

Gospel Publishing House said...

Hi Kris! It's hard to say for sure, but my guess is that you haven't shared the calendar yet. If that is the case, it's an easy fix. See this post for how to do that. Hope that helps!

KrisZ0213 said...

Thank you so much for the suggestion! I got it to work!!

Ms. Connor said...

I'm a high school teacher, and having my calendar of upcoming assignments and events online is going to make things a LOT easier. Thanks for the great instructions!

Upcoming Events