If you are using the out of the box SharePoint blog site and want to change the look and feel away from the ‘boxy’ SharePoint look this post is for you.
During the process of customising this blog I have created a master page and two CSS files that can be used to give a SharePoint blog a ‘cleaner’ look and feel. At the moment it looks like this:
All that is needed to transform an existing SharePoint blog to the above is one master page file and related CSS and image files. I have provided these files in a zip folder for download so you can apply this design to existing blogs. I have also created a site template file (.stp) that can be installed so new blog sites can be created with the design already applied.
Installing the design on an existing blog site
To get the site up and running on an existing blog site simply copy the sample files to the master page gallery of your blog site.
This can be done by selecting site actions > site settings > galleries – master pages > upload multiple files and selecting the five files contained in the zip folder.
Note that this will overwrite the existing master page and customise the site from the site definition. If you ever want to return the site back to the original state simply select site actions > site settings > reset to site definition > reset all pages in this site to site definition version. You can also delete the leftover image and CSS files in the master page gallery to completely remove all the custom template elements.
Installing the site template
To install the custom blog template so that you can create new blog sites with this design you need to add the site template file (.stp) to the site template gallery.
This can be done by navigating to the top level site in the site collection and selecting site actions > site settings > galleries – site templates > upload and selecting the .stp file contained in the above zip folder.
To create new sites based on this template simply select site actions > create > sites and workspaces, then enter a title, description and url and click on the custom tab under template selection and select Blog – Simple Gradient.
About the design
To create this design I have customised the default.master by removing all style/layout information and then adding in div tags to mark-up the elements. I have then used a style sheet named styles.css to style the elements contained in the master page. I have also used another style sheet named sharepointstyles.css to override the style sheet provided by SharePoint (core.css).
In a later post I will provide detailed instructions on how to recreate and extend your this template. You can also expect a much richer set of blog features with the release of an enhanced blog edition by the CKS:EBE team that I am part of. We are hoping to get something out early next month so watch this space…