Tuesday, November 13, 2007

Google Calendar / Myspace Hack


*UPDATE -- Read the comments -- somebody came up with a better solution. =)

This hack allows you to display the upcoming events from your Google calendar on Myspace ala Google Calendar Agenda.

I realize that Google calendar has an agenda feature that can be placed in a website; it's very nice. However, the [iframe] code is not practical for sports teams/artists who exist only on Myspace. I write this so that they can easily manage and display their upcoming events utilizing the power of Google Calendar.

Google Calendar works great for my rugby team who is controlled by a board of directors, we all have power to edit the calendar events. Through this technique, we can make sure everyone, including the other team, knows when and where to be.

The Embeddable Springwidget will display the title of your event, the date and its description. Clinking on any event takes the user to the Google Calendar-event-details page. Please see the Caveats at the bottom of the post before proceeding

How did I come across this hack?
I actually run the marketing for the San Francisco Fog Rugby Club website and before they hand over access to the server, I put together the best of my Web 2.0 research for the club's Myspace. Please visit and sign the guest book.

Requirements

Google Account with Google Calendar
Feedburner account
Springwidgets account (technically optional, but mandatory for editing widget)

Your Google calendar should be public with some future events for testing.
Have your Google Calendar, Springwidgets, and Feedburner account open. Hopefully in Firefox.
Getting the Calendar's XML to Feedburner
  1. Find the name of the Calendar you wish to share and select "share this calendar" in the drop down panel.
  2. Select: Calendar Details>Calendar Address>left click "XML" > copy hyperlink
  3. Go to Feedburner>"my feeds"
  4. under Burn a feed right this instant. paste the copied hyperlink into the textbox and click "next".
  5. Congratulations, you now have a Feedburner feed.

Setting up the Feed in Feedburner

  1. Click the Optimize tab
  2. Click "Event Feed"
  3. Check the box for "Only include items that represent future events"
  4. If you wish, Check the box to add the date in the title . I don't like it.
  5. Click "Save"
  6. Select the "Publicize" tab
  7. Click the "Create new" under headline animator heading.
  8. You'll find Clickthrough URL, that's where your new Feedburner feed is located.
  9. Copy the address.
Almost done... Springwidgets
  1. Go to the Springwidgets website.
  2. Click express widgets
  3. Paste your feed into the text box and click submit.

Play around with the settings until you have a custom agenda. The hard work is done, all you have to do now is make it pretty.

Caveats
Why not put the calendar XML straight into springwidgets?
It doesn't work, it only displays past events, or if it does, the future events are so buried down by previous events, that they're not shown.


Feedburner has an excellent animated GIF image, why not use it?
It doesn't have the look or interactivity of the Google agenda.

Feedburner, with the future events checkbox toggled on, will not display reoccurring events.
Bummer I know, It still achieves the goal of being a way to easily publish events on Google Calendar and have them show up on Myspace.


21 comments:

Don said...

This is Don from SpringWidgets.

Keep your eyes on the springwidgets site, I might have a better solution for you very soon!

-Don

Josian said...

Nice work!! I played for a big while with this calendar thing. Instead of using feedburner, I prefer using 30 boxes. You can subscribe your google calendar as a web calendar. Just replace the "http://" with "webcal://" and insert the rss feed to SpringWidget. This solution deals pretty well with recurring events plus lets you publish in facebook as well.

Josian said...

Nice work!! I played for a while with this calendar thing and it work pretty well in myspace. I prefer 30boxes instead of feedburner. It manages the recurring events issue pretty well. Instructions are mostly the same. Just change the following:

1. On 30boxes, add your google calendar as a webcal. Go to Settings/Web stuff, and at the bottom you will have the option to insert your web calendar. copy and paste the public ical link from your google calendar page and replace the "http" with "webcal". Remember to make your google calendar public!

2. Add the 30boxes rss feed to Springwidget

Daro said...

If you are having trouble getting your calendar events in the correct order you can append the URL from Google with;
?orderby=starttime&sortorder=ascending&futureevents=true&singleevents=true&­max-results

I found this on another site and it works like a charm.

DB

Genesis said...

I did everything as you said, and it turned out beautifully...BUT I ammended an event and it won't refresh on my MySpace page. Can you help me?

Voodoo Logic said...

It takes time for the RSS feed to refresh in the springwidget widget. I don't know the frequency of their refresh rate but it can't be more than a day.

Dartanion said...

The 30 Boxes feed looks the best, but for some reason it shows up as 3 hours off in the SpringWidget.
This doesn't happen in the direct feed. Any ideas?

Pastor Mike C. Northrup said...

Great tip. THANKS!

Pastor Mike C. Northrup said...

upon further review, I prefer 30 boxes as well for this hack.

Redguitar said...

Damnity damn damn, this looked so good until it turned out Springwidgets only works with pc and has no mac version.
Why on earth is myspace such a pain in the nether regions?

Voodoo Logic said...

spring widgets has two components, the software and the web embeded service. my hope is that you might be confusing the two. http://www.springwidgets.com/express/ <-The link is currently broken, but that's where you want to be.

Olde Hickory Tap Room said...

Posting on an old thread...

I'm using myspace's 2.0 profile which is making gobblegook out of it's own calendar module. Set up a google calendar and then learned myspace doesn't like iframes (arg), & in my bumbling around the net I found this blog/post. :) I'm not terribly internet savvy though, and the springwidgets site seems to have changed. Any hints on which widget/where in the site I should check?!? Thanks much!

Don said...

@Olde Hickory Tap Room,

Don (formerly) from SpringWidgets. SW is currently in limbo. FIM shut us down in January. I've been working with FIM to attempt selling the assets. DOn't have anything to report yet.

The calendar solution that we were working on will probably not happen anytime soon, if at all.

Best,

Don

Voodoo Logic said...

@Olde Hickory Tap Room

Try this alternative.
http://www.widgetbox.com

Olde Hickory Tap Room said...

Thanks Don & Voodoo Logic
I'll check out the alternative. Wish me luck. :)

Nick said...

I'm using widgetbox and I'm not sure if I'm doing this right. Can you please advise. This is what I do.

1. blog/feed
2. Blog/Feed URL: (which URL is this? myspace or 30Boxes?
3. New Blidget
a. Blog / Site:
b. RSS Feed:
This is where I'm stuck. What are these?

Thanks.
Nick

Nick said...

How do you RSS feed the 30Boxes
"webcal" link? This is the ICAL file, not the XML.
Thanks.

Voodoo Logic said...

A lot has changed since this blog post. all the software involved has undergone some alterations.

You want the RSS feed of your google calendar.
Menu - Calendar Details>Calendar Address>left click "XML"

That's (above) the RSS that needs fixing. we put that into feedburner to convert it into an RSS that widgetbox likes.


Feedburner still works. I put my new feedburner feed into Widgetbox.com and came out with a usable result. http://tinyurl.com/nzll6h

Sorry for the delay.

I researched 30boxes and found that they have NO integration with Google calendar. It does allow your shared ".ics"/ICAL google URL to be placed in a 30boxes calendar.

Vic Wong said...

Hey gang, I came up with a free Flash script to do just this:

http://myspacegcal.blogspot.com/

It's a bit simpler to set up, just enter your gcal ID and it will generate the code for you.

However, the feedburner method works as well. I used it for quite a while. I just wanted to come up with something that looked a little nicer integrated with myspace.

Nick said...

Is there any way to put an actual Calendar View into myspace instead of the list of events?

beth said...

@ vic wong
DUDE! You just saved me my sanity!
You script is easy and works great! Thanks so much for sharing!