Enter your email address:

Delivered by FeedBurner


Sign up to receive a reply:

Powered by MT-Notifier

user-pic

How do I embed a calendar of assignments on my class blog?

Vote 0 Votes

Audience: University of Minnesota instructors

For class blogs, a clever combination of UThink and Google Calendar is to embed a class assignment calendar in your sidebar. Here's what you do:

Creating an Assignment Calendar:
(1) Open your Google Calendar: http://calendar.umn.edu
(2) Create a new calendar. On the left-hand side, under "My Calendars", click "Add". You could call it "PHIL3313W-Assignments" or something like that.
(3) Again, under "My Calendars", choose "Settings."
(4) Click on the calendar you just created
(5) Look for the section "Embed this Calendar"
(6) You will see sample HTML code. Click on the link above that, "Customize the color, size, and other options."
(7) Most of the options are straightforward.
(a) Default View: For readability, I would recommend "Agenda" as the default view.
(b) Width: This should be the maximum width available on the sidebar of your blog. If you are using the "Classic Blog" UThink template, you only have about 190px to work with. The embedded calendar works best at about 450px. Any narrower and you will lose some of the controls on the top. Most of those controls are removable.
(8) Once you have it configured as you want it, click "Updated HTML". You will copy/paste this code later.

Adding the new code to your blog as a separate page:
Given the constraints on width, you might want to embed the calendar on a whole new page that you can link to from your blog page. The following instructions are for those who use the "Classic Blog" template.
(1) Log into UThink and select your blog
(2) Go to Design > Templates
(3) Check the box next to "Main Index"
(4) Using the "More Actions..." dropdown menu, choose "Clone Template", then click "Go".
(5) Click on the new template, "Copy of Main Index"
(6) Change the name to something like "Assignments"
(7) Click on Template Options
(8) Change the Output File to "assignments.html"
(9) Now look at the code. Try to find about four lines that start with "" and ends with "". Delete those tags and everything in between. Now paste your calendar code into that deleted spot.
(10) Save & Publish your blog
(11) Add a link to your new page:
(a) Go to Design > Widgets
(b) Choose "Create widget template". Alternatively, you could clone an existing template to mimic the look of an existing section of your sidebar.
(c) In your new widget template, give it a name like "Assignments Link".
(d) Design your code with simplicity in mind. My example:

<a href="<$mt:BlogURL$>assignments.html"><h3>Assignments Calendar</h3></a>

(e) When you are finished, click "Save"
(f) Go back to Design > Widgets
(g) Do you have a 2-column or 3-column layout on your blog? If 2-column, click on "2-column layout - Sidebar". If 3-column, click on "3-column layout - Secondary Sidebar".
(h) You should be looking at "Installed Widgets" and "Available Widgets". Find your new widget "Assignments Link" on the right-hand side and drag it to the left.
(i) Save Changes.
(j) Re-publish your entire blog


Adding the new code to your blog sidebar:
Instead of creating a separate, linked page (see previous instructions), you could try to add a very narrow calendar to your blog sidebar.
(1) Go back to step 7b in "Creating an Assignment Calendar".
(2) Change the width to 190px.
(3) Change the height to something like 400px (or your preference)
(4) Change the default view to Agenda
(5) Modify the Calendar Title to be short enough to fit
(6) Un-check some of the "Show" features. I would un-check Date, Print icon, Tabs, and Time zone.
(7) If you are finished, click "Update HTML". You'll copy/paste this code later.
(8) Log into UThink and select your blog
(9) Go to Design > Widgets
(10) Choose "Create widget template"
(11) Give the new widget template a name, like "Assignments Calendar"
(12) Paste the embed code from step 7 into the body of the widget template
(13) If you are finished, click "save"
(14) Go back to Design > Widgets
(15) Do you have a 2-column or 3-column layout on your blog? If 2-column, click on "2-column layout - Sidebar". If 3-column, click on "3-column layout - Secondary Sidebar".
(16) You should be looking at "Installed WidgetS" and "Available Widgets". Find your new widget "Assignments Calendar" on the right-hand side and drag it to the left.
(17) Save Changes.
(18) Re-publish your entire blog

Voila! Please submit comments if you find errors in these instructions.

Add a Reply

Forum Groups

Classic Blogs and General Info

29 13

Last Topic: Can I use PHP code in my blog? by Charlie Heinz on Jan 9, 2012

Discussions

Q&A

Be the first to post a topic in this forum

Blogging Principles

Be the first to post a topic in this forum

Other Template Sets

Community Blogs

Be the first to post a topic in this forum

Community Forums

Be the first to post a topic in this forum

Widget Marketplace