Custom SharePoint Site Title Bar using jquery

One of the new items we wanted to add to our dashboard front pages was a site name and description bar across the top of the pages for our dashboards. Each of our dashboard sites was created using a Powershell export of a site we configured exactly the way we wanted, making it our template site, and then importing the site with a new name.

This gives us 100s of sites with the same configuration, page layout, and webparts named the same, but content is specific to each site such as financial data and other reports.

The approach to solving this issue was to use a bit of css, jquery, and a content editor web part. The content editor web parts will allow you to either enter free text and decorate it any way you like, or you can create your layout and copy the script and paste it into notepad and then save the file to a document library at the root of your site that has read access for any of your visitors. We also keep a copy of jquery 1.8.3 in this same document library called scripts. The newest version of jQuery breaks some of our functionality, so be sure to use the earlier version.

One requirement in building this was it had to be easy to update, so by keeping our code for the content editor web part in a single text file stored at the root of our site and then configuring each web part to point to this file we can now update hundreds of web parts with a single bit of code.

The end results were that I needed to have this yellow Title banner web part on each of my sites, the title banner is basically using jQuery to find some class tags on the page that contain the current site's title and description, two items already on the page, but not very easy to read.

You can see when we view the web part properties that the values have been set by our script, note the Content Link field, it points to my root document library where the web part reads the script that all the web parts will read, if we need to make a change to the web part this is where it will be done.

Each of these sites in the drop down need this dynamic web part added to it's Dashboard.aspx web part page.

Another example of the web part on a different site

Site Title - Site Description

Now that all that is working we need a way to automatically inject this web part onto all of our sub sites at once, this is where Powershell will prove its self once more. My previous post of Add/Update a web part with Powershell should be all you need to sort out the automation part.