Embedding a Calendar Widget

Customize Your Site!

A calendar widget is an online tool directed to student's personal calendar the helps serve variety of purposes: manage appointments, keep track of events, and much more. The purpose of this file is to input student's personal calendar in their Penn State blogs as a widget.  A widget is a tool that helps customize a website. In this file, it specifically refers to embedding the calendar in the bottom right corner at the homepage. In order to complete the task, a Google account and a blog website are needed. It takes approximately 3 minutes to complete this task.

Screencast Tutorial

View the full screen video version here.

3. Under My Calendars, click on the small blue link called Settings.

4.    On the new window titled "calendar settings", click on the gmail address in blue (english202cjn@gmail.com for example).

 5.    Highlight and copy the code in the white box.

2.    After logging in, at the top of the window there is a tab called Design. Click on the drop box and click on the middle tab called Widgets. A new page titled "widgets" containing widget sets and widget templates should appear.

3.    At the middle of the page there is a link called Widget Template. Click on the small blue link underneath it that is called Create widget template.

4. This will open a new window called "create widget" with a blank document. In the giant white box, paste the code that was copied from the Gmail window calendar in step 6.

5. Click the right A that is black (not the first A that is orange). The display of the calendar should appear.

6. Now, click on the left A (the orange one) and continue the next steps.

7. Change the width from 800 to 300, and the height from 600 to 400. This will resize your calendar widget, making it small enough to view on the blog widget.

8. After changing the code, type Calendar in the rectangular box above the drop box where it says insert. This titles the widget.

9. Click on Save at the bottom of the page.

Now that widget was successfully created, the final step is to place this widget in the sidebar.

2. Now under widget sets, click Main Sidebar (third link down).

3. To add the newly created widget, simply drag the calendar tab from the available widgets column over to the installed widgets and scroll it to the bottom of the window and then click save change.

4. To verify this addition to your sidebar and save your change, click the publish icon on the top of the window. The icon looks like two arrow forming a circle, and is located next to the tools icon.

6. Publish to verify the successful addition of the widget.

Mission accomplished! To view the calendar widget, go to the personal Penn State blog. The calendar widget should be at to the bottom right side!