Skip Ribbon Commands
Skip to main content
Navigate Up
Give Feedback
Sign In
SharePoint Grind > Posts > A Home-Brewed Mini Calendar in SharePoint 2010
 

 Image Viewer

 
April 08
A Home-Brewed Mini Calendar in SharePoint 2010

So far in working with SharePoint 2010 I’ve seen a LOT of improvements worth getting excited over. I am working on a bunch of branding projects right now and one of them is for a corporate intranet. They want to have a mini-calendar, but being that we’re still in beta, there aren’t many options. So, I decided to play around with the calendar CSS file in 2010 to see what was possible. Basically, I applied a theme and opened up the calendarv4.CSS file in Designer to experiment.

 

Before any customizations, I had a larger (but not nearly as ominous as v3) calendar web part. This is such an improvement over what you got OOTB in v3, but for a fixed-width site, it’s still a little too large.

image

 

After I added my custom CSS, I had a much tinier calendar. Additionally, for this mini-calendar I went ahead and added styles to hide the “Add” link used to create new Calendar items. You could play around with the sizing and go a little larger as well.

 

image 

 

In order to make these changes only apply to the calendar I placed my CSS in a hidden Content Editor Web Part on the page. You wouldn’t want to edit the calendarv4.css file because that will affect ALL calendar web parts, across your site, even in the list view. You can grab the CSS I used in the attached file and test it out on your site. This was just my first time delving in, so I’m interested to hear what anyone else finds :)2010CEWP_miniCal.txt2010CEWP_miniCal.txt

image image

Here it is w/ some events in the calendar. When you hover over, you can still see the full details of that event. Pretty slick for just CSS ;)

hoverMiniCalendar.png

Comments

There are no comments for this post.
 

 ‭(Hidden)‬ Blog Tools