Turning a Master Page into a Theme

I got asked a question I have never heard before, so I decided to post a reply here.

Q: Can you turn a SharePoint master page into a theme?

A: Depends. I know, awful answer, but it really does depend on what you have done in your master page.   Master pages control more design elements than a theme does.  So depending on how you created those changes, they may or may not translate over to a theme.

SharePoint uses a set of CSS styles.  Some of those styles are referenced in the user controls like Search.  Some of the styles are referenced in the navigation, like CssClass in the the AspMenu control.  Other styles are assigned to HTML table tags that contain and organize elements in the SharePoint web page.

If you created new styles to override existing SharePoint styles for the user controls or the navigation, those can easily be transported over to a theme.  If you created new styles to override existing SharePoint styles for the container tables, then those can easily be transported over to a theme as well.   But if you used different HTML and CSS styles in your master page to layout your web page, then that is where you may run into a problem taking that into a theme.

A theme merely re-skins a master page. Note I didn’t say re-skins SharePoint. It can update the colors and images used in the master page, no matter if the master page is one that ships with SharePoint or a custom master page you created.

So you can essentially create a custom master page with all your own styles, then create theme(s) for your custom master page that changes colors and images.  Nice thing about themes is that it bleeds over and affects the application (_layouts) screens as well.

So ultimately, the answer to whether or not you can take your master page and create a theme really depends on what is in that master page and what master page will be assigned to the site when you apply the theme.  Don’t forget that whether you want to use a master page or not, the SharePoint site will use one no matter what, be it the default one it ships with, or a custom one you create.

Here are a few scenarios to help illustrate what we are talking about.

Scenario 1:  You made edits to Core.css or created a custom CSS file and tweaked the look and feel of the default SharePoint site.  Maybe you added a few custom elements in the master page, but for the most part the master page being used is largely based on default.master.   Now you want to create a theme for the changes.
Can you do it? Yes, you can create a theme out of your image and CSS changes.  Keep your master page changes in the master page.

Scenario 2: You created a custom master page and it doesn’t look anything like default.master.  You have new HTML, new CSS classes, and some edited SharePoint styles to change the branding of the user controls.  Now you want to create a theme that recreates these changes that you can then use on other SharePoint sites.
Can you do it? No, this will not work! You will only get a piece of the branding transferred over to the theme.

Scenario 3: You created a custom master page and it doesn’t look anything like default.master and you want to create variations of this design by changing colors and images (maybe for departmental or divisional areas of a site). You think a theme can create that variation.
Can you do it?  Yes! Themes are a great way to create color and image variations for a master page.

5 thoughts on “Turning a Master Page into a Theme”

  1. This is very useful information, Heather and a great website.Do you have a particular article on customising Master Pages, in Sharepoint 2007?I am using Sharepoint Designer but, I have some difficulty in terms of customising the Master Page .e.g. menu-bars, moving the search-box up to the Top area etc.I would really appreciate if you have any article on customisation.Regards,Dan

  2. Dear Heather, thanks for replying to my question, I really didn’t expect this :)My scenario is more or less the first one. But when I wanted to activate my masterpage with the css, it gave an error for the masterpage (not the css).So today I put everything that defines the page in the css (you can do so much with it, it doesn’t even look like sharepoint anymore). I specified my CSS file to be used by the publishing sites and all the subsites and it worked!Couldn’t have done the css without your blog though!

  3. Thanks for another great article, Heather. I can’t imagine how lost I would be without your wonderful site.Cheynne, You may want to read these articles:http://www.cleverworkarounds.com/2007/10/11/sharepoint-branding-how-css-works-with-master-pages-part-2/http://www.cleverworkarounds.com/2007/10/13/sharepoint-branding-–-how-css-works-with-master-pages-–-part-3/Toward the bottom of the article, it addresses advantages/disadvantages of different ways to apply CSS. It shows which option can’t change _layout pages. (If you have time, you may want to read the whole series -as of October 24, 2007 there are 4 articles on customization. They’re very helpful.)Personally I went through Master Page Setting method.Dan, I’m having EXACTLY same issues! I created a new CSS file to override Core.CSS to place new colors, font, images, etc. Now I have to get back to master page/aspx page to move up the search box, move down the text box, etc and it’s not working. If I ever find an answer, I’ll definitely post it.

  4. I’m having an issue with master pages – whenever any user who is not a site admin logs in, they see a completely different layout?

Comments are closed.