SharePoint: General

Brand it baby! Buy tickets by Wednesday for my next branding class...

Heather Solomon — Mon, 20 Apr 2009 17:27:58 GMT

Themes? Master pages? CSS? Page layouts? Content customization? All covered next week in my SharePoint Branding Bootcamp in Anaheim, CA. You will get a lot of one on one time with me to work on your plans, designs and issues with your SharePoint sites. Check out more info in this post, or online at: http://www.sharepointbootcamp.com/sharepoint_branding_bootcamp.htm

Thanks!

Learn how to brand SharePoint

Heather Solomon — Mon, 13 Apr 2009 19:23:52 GMT

In two weeks I am headed to sunny Anaheim California to teach my SharePoint Branding Bootcamp. There are still seats available and I would love to have you join me for a week (April 27 - May 1st) learning how to effectively brand the SharePoint interface.

A lot of my materials have been updated to include the latest tips and tricks I have discovered. This class covers more than just where SharePoint CSS files are or how to create a theme, we delve into master pages, WCM page layouts, customizing the content display and how to brand all the various components of SharePoint that are not otherwise caught by a master page change. We also go outside technical aspects and discuss how to start your branding process and gotchas for SharePoint design.

This class is for designers, developers, business managers with technical skills and anyone who needs to understand how to change the SharePoint interface. We use SharePoint Designer (SPD) to complete all tasks so you will additionally get a lot of time and experience with SPD.

Also in Anaheim will be Dustin Miller teaching the Original SharePoint Bootcamp and Matt Passannante teaching the SharePoint Administration Bootcamp. You will have access to both of these great guys to ask random SharePoint questions or just about anything in general. :-) We have a great time together, and hey we are staying inside of Disneyland!

To learn more about our classes, check out the web site: http://www.sharepointbootcamp.com/

Controlling Single Web Parts with CSS Article Posted

Heather Solomon — Wed, 25 Feb 2009 02:19:01 GMT

I often get questions about how can a particular web part be branded separately from all the rest or be branded by type. For example you want every Contacts list to have a green header bar instead of a tan header bar. Or perhaps you want a column of web parts on a page to look different than the main area that contains other web parts.

The latter I have always had a solution for, the former I figured out something today. As with everything that I focus on, these are "no custom development" / "no .NET code" solutions. You can usually build whatever customization you need with custom code. If you would like to just rely on CSS however, here you go....

Controlling Single Web Parts with CSS

SharePoint Online - a solution for SharePoint hosting for small businesses

Heather Solomon — Tue, 24 Feb 2009 16:55:12 GMT

I recently got a question from James in Australia about the challenges small institutions face with using and deploying SharePoint. I know a lot of people are in this position where they want to use SharePoint but don't have the resources to support hosting it internally. You can check out Microsoft Online Services, they offer SharePoint hosting via SharePoint Online. http://www.microsoft.com/online/sharepoint-online.mspx

Hope this helps, thanks James!

Random Design Bits for SharePoint OTW....

Heather Solomon — Mon, 09 Feb 2009 17:01:55 GMT

I often sit and stare at the computer screen wondering what on earth I should blog about. I guess I work with SharePoint branding too much on a daily basis to have particular items stand out to me that say "Hey, blog me!". In an effort to get out helpful bits, I am turning to my blog comments. I unfortunately don't have time to address all the great comments people send me, but I have saved them all. I am going to start picking questions at random to answer here on my blog in hopes of helping out a few people here and there.

Thanks for all of your ongoing support. I can't express my gratitude for all the wonderful things people send me and say to me. You guys are the best... Heather

New SharePoint Training Available

Heather Solomon — Sat, 31 Jan 2009 02:16:34 GMT

At SharePoint Experts we are expanding our training offerings! I am excited about the new sessions we are hosting, the unique learning environment we are creating, and the innovative classes we are in the process of authoring. Starting the week of February 9th, we are hosting five Three Hour Tours highlighting popular SharePoint topics such as...

The Data View Web Part: Deep Dive! - Find out more
February 9, 2009, 1:00 PM - 4:00PM CST

SharePoint Features: What's the Big Deal? - Find out more
February 10, 2009, 1:00 PM - 4:00PM CST

InfoPath and SharePoint: A Primer - Find out more
February 12, 2009, 1:00 PM - 4:00PM CST

SharePoint Planning: The Business Comes First - Find out more
February 13, 2009 - 1:00 PM - 4:00PM CST

And then my personal favorite (gee, wonder why ;-)...

Brand It!: SharePoint Branding, from Start to Finish - Find out more
February 11, 2009, 1:00 PM - 4:00PM CST

During this session, Heather Solomon will show you how to brand your SharePoint sites, from start to finish. Combining master pages, page layouts, CSS and content types, you'll see how to take a design comp and basic taxonomy information and apply it to a MOSS 2007 site.
•    Critically examine design wireframes to determine if there are any SharePoint "gotchas"
•    Create custom master pages from a base master page definition
•    Create a custom theme
•    Design CSS variations so that your web site's departments/sections can have their own color scheme
•    Use publishing workflow features to avoid publishing unfinished pages, and allow non-designers to create new content on your sites

In this 3-hour session I cover key branding concepts and brand a site from start to finish. It is a whirlwind of branding activity that is a both great intro to or refresher for how to brand a SharePoint publishing site.

Also, be sure to sign up for our mailing list. We will soon be announcing new classes exclusively taught online, and I am cooking up a class that you won't find at any other SharePoint training house. :-)

Cheers everyone!

My Site Profile Picture Not Showing in Custom Master Page

Heather Solomon — Mon, 29 Sep 2008 20:56:32 GMT

I made an update to my Base Master Page today that moved the PlaceHolderLeftNavBarTop content placeholder from the hidden ASP Panel at the bottom of the file to an appropriate place in the left navigation area.

The content page (\12\Templates\SiteTemplates\SPSMSITE\default.aspx) that controls the profile/public page of My Sites adds the profile picture of the user to the left navigation bar via the PlaceHolderLeftNavBarTop content control. To show this profile picture in your custom mater page, you need to include this content placeholder in your code.

To Breadcrumb or not to Breadcrumb?

Heather Solomon — Thu, 21 Aug 2008 21:02:51 GMT

User Interface Engineering has posted an article about breadcrumbs, and why they feel that breadcrumbs are a design cop-out. It is a good read, especially for people using SharePoint for external facing sites.

» Design Cop-out #2: Breadcrumbs

Personally, I only utilize page breadcrumbs when working with administering lists and settings. The breadcrumb provides a quick way back to list screens and other setting screens where otherwise no navigation is provided. For that purpose I think they can be useful. The article brings up some valid points on whether or not to use breadcrumbs at all.

SharePoint Breadcrumbs - Sample of differences, chart of uses and resources

Heather Solomon — Wed, 13 Aug 2008 21:43:44 GMT

I don't think I am alone when I say "I hate the page level breadcrumb in SharePoint". While dead useful for users, it becomes a bit nightmarish for devigners. For this post I am going to ignore the Global Breadcrumb that appears in the upper left of a SharePoint site by default, because honestly most people hide it and it doesn't cause near the heartburn as the page level breadcrumb.

Some background.... the page level breadcrumb (from this point forward just called breadcrumb) is included on the master page. It is wrapped in a content placeholder. So the master page is providing the default content for that content placeholder. Page layouts have the power to trump that default content and specify their own content for any content placeholder. Including not specifying any content at all, which effectively wipes out whatever is in the master page and displays nothing on the screen.

Some of the default page layouts in a publishing site move or hide the breadcrumb. What you set in your master page won't necessarily be what you get as you move from page to page in your site. You can avoid this completely by using your own master page and your own page layouts. If you choose not to use only custom page layouts, you will probably need to tweak the OOTB page layouts to get the breadcrumb to show how you want it across the entire site.

You may be tempted to stick the breadcrumb code in the master page and not wrap a content placeholder around it. I would recommend against this, as you are stopping the ability to hide the breadcrumb on choice pages, like the home page.

Here is a breakdown of what the OOTB page layouts do in regard to the breadcrumb. I color coded the rows to show which page layouts do the same thing/use the same code:

AdvancedSearchLayout.aspx	Breaks the inheritance from the master page. Specifies unique code that does not include the breadcrumb.
ArticleLeft.aspx	Breaks inheritance from the master page. Specifies breadcrumb code that includes a DIV tag with a class of "breadcrumb".
ArticleLinks.aspx
ArticleRight.aspx
BlankWebPartPage.aspx
DefaultLayout.aspx	Breaks the inheritance from the master page. Does not specify any code in the breadcrumb content placeholder, thus blanking out the breadcrumb set in the master. Sets up the breadcrumb in a table in the PlaceHolderMain content placeholder. The table cell uses a CSS class of "ms-pagebreadcrumb".
NewsHomeLayout.aspx
PageFromDocLayout.aspx	Breaks inheritance from the master page. Specifies breadcrumb code that includes a DIV tag with a class of "breadcrumb".
PageLayoutTemplate.aspx	N/A - This is used as the starting point to create new page layout files.
RedirectPageLayout.aspx	N/A - This is used to redirect pages.
ReportCenterLayout.aspx	Breaks the inheritance from the master page. Does not specify any code in the breadcrumb content placeholder, thus blanking out the breadcrumb set in the master. Sets up the breadcrumb in a table in the PlaceHolderMain content placeholder. The table cell uses a CSS class of "ms-pagebreadcrumb".
SearchMain.aspx	Breaks the inheritance from the master page. Specifies unique code that does not include the breadcrumb.
SearchResults.aspx
TabViewPageLayout.aspx	Breaks inheritance from the master page. Specifies breadcrumb code that includes a DIV tag with a class of "breadcrumb".
VariationRootPageLayout.aspx	N/A - This is used when provisioning a site for variations. More info.
Welcomelayout2.aspx	Breaks inheritance from the master page. Specifies breadcrumb code that includes a DIV tag with a class of "breadcrumb".
WelcomeLinks.aspx	Puts the breadcrumb code inside of the PlaceHolderMain content placeholder. Wraps the breadcrumb in a DIV tag with the CSS classes of "ms-pagebreadcrumb" and "removeMargins". Note that it does not break inheritance for the breadcrumb content placeholder from the master page.
WelcomeSplash.aspx	Breaks inheritance from the master page. Does not specify any code, thus blanking out the breadcrumb from the web page.
WelcomeTOC.aspx	Puts the breadcrumb code inside of the PlaceHolderMain content placeholder. Wraps the breadcrumb in a DIV tag with the CSS classes of "ms-pagebreadcrumb" and "removeMargins". Note that it does not break inheritance for the breadcrumb content placeholder from the master page.

As you can see, there is a lot of variety going on with the OOTB page layouts. It is possible to modify the styles used in the various breadcrumb instances to all look nearly alike, giving you a uniform look and feel for breadcrumbs across your site. You just need to specify the same styles for "ms-breadcrumb" and "breadcrumb". Or you can choose to go in and alter the page layouts that you need to in order to create uniformity. Either route, just test the dickens out of it to make sure no pages show up odd.

If you are working only with WSS sites, note that default.aspx (used for the home page) breaks the inheritance from the master page and does not specify any code, thus blanking out the breadcrumb from the web page. Most other ASPX files that WSS sites use do not specify anything, so they inherit the breadcrumb from the master.

The next challenge with the breadcrumb is the site map provider it uses. There are several available in SharePoint, and two that are used predominantly for WSS and MOSS sites in the breadcrumb. The problem is the WSS one is great for lists and libraries, and the MOSS one is great for publishing pages. But they each are not great for the other.

Breadcrumb with site map provider best for WSS:
<asp:SiteMapPath SiteMapProvider="SPContentMapProvider" id="ContentMap" SkipLinkText="" NodeStyle-CssClass="ms-sitemapdirectional" runat="server"/>

Breadcrumb with site map provider best for MOSS (publishing sites):
<asp:SiteMapPath ID="siteMapPath" Runat="server" SiteMapProvider="CurrentNavSiteMapProviderNoEncode" RenderCurrentNodeAsLink="false" CurrentNodeStyle-CssClass="breadcrumbCurrent" NodeStyle-CssClass="ms-sitemapdirectional"/>

The main issue with the WSS site map provider is it will show directories you don't want it to (mainly the Pages library) in the breadcrumb, and on some pages it will show ".aspx" on the end of the page name. The MOSS site map provider is more graceful, it just doesn't show the list or library name in the breadcrumb.

This image shows examples of both site map providers being used on the same pages and the differing results: view image. Please note that for these samples, I directly added the breadcrumb code to the master page, outside of a content placeholder. That is why it appears on all pages.

So which one should you use? It really depends on the type of site(s) you are running and what you personally want to use. Luckily it doesn't end there. There are a host of resources for how to modify and use the breadcrumb:

How to: Customize the Appearance of SiteMapPath Web Server Controls on MSDN
How to: Add Simple Site Navigation on MSDN
Custom site map provider that has best of both worlds by Tombo
Adding Breadcrumb Navigation to SharePoint Application Pages, The Easy Way by Jan Tielens
Assorted posts about working with the breadcrumb by Andy Burns
Manage Layouts Site Map Feature on CodePlex
Modify the default SharePoint content placeholders on Office Online (if you are new to messing with content placeholders)

Hope this helps!

A Bit More About Disabling Themes in Master Pages

Heather Solomon — Wed, 13 Aug 2008 17:40:13 GMT

Randy Drisgill came across a great challenge and weird issue with SharePoint in regards to disabling themes on custom master pages. I wanted to expand a bit more on what he has posted about.

Themes can wreck havoc on master pages since by default theme styles are called after regular SharePoint styles. Depending on your changes, themes may leak through via changing styles you did not, or if you used the Alternate CSS property in Master Page Settings to call your custom styles. The Alternate CSS is called along with those regular SharePoint styles (via the CssLink tag in your master page) and the theme is called after that.

When you have a custom master page, the master page is stored in the content database. When you add a theme, SharePoint adds a meta tag to the master page right before the closing HEAD tag, thus rendering any styles you specified as defenseless against the applied theme. The meta tag looks like this:

If your design requirements include creating a matching theme for your site, you can create the theme and master page in tandem so you don't have conflicting styles. But if you have to create the theme after the fact, you will spend extra time fixing issues the theme causes for your site with the custom master page. And if you do create them in tandem, your theme may cause you extra grief, and you may want to follow this solution anyways to avoid that.

If the theme is only there to brand application screens (_layouts) you can choose to remove the Theme tag from the master page, then the theme will only apply on application screens and your custom master page and site will not be affected. Doing this will work, and will bring you to the issue that Randy discovered. Randy mentions using a Feature to deploy the master page to the server, and I certainly agree with that recommendation. But if that is not feasible for your situation, you have some options.

First, the order of how you do things. If your theme causes issues:

Open the custom master page in SharePoint Designer (SPD).
Go to the site and apply the theme.
Return to the master page in SPD and remove the theme tag (<SharePoint:Theme runat="server"/>). If you have been messing with applying themes, go ahead and check for a theme meta tag right before the closing HEAD tag. If you find one, remove it.
Save the master page.
Go the site and check it out, you should have themed application screens and non-themed site pages.

If you have to mess around and try out different themes, be sure to open up your custom master page first in SPD. As you mess around your site pages will be affected. Once you settle on a theme or finish your testing, go back to SPD and save the master page. No need to make any changes. SPD will re-save the clean version of the master page in the content database and wipe out any meta tags SharePoint added for the theme.

Going forward you will still face this potential issue if anyone has rights to update the theme. You can avoid this by removing the other themes from the theme picker screen (if you need help with this, check out this section of this post and instead of adding template blocks, remove all the ones you don't want). This works because SharePoint will only add the meta tag if you change a theme. Once set and no options for change, your master page will be preserved.

If this isn't an option for you, really restrict who has access to change themes, go back and make your theme compatible with your master page, or deal with what may happen when the theme changes. Sorry I don't have a better answer. It may be possible to create a Feature that requires moderation for theme changes.

In case you are wondering, you can move the Theme tag in the master page above the CssLink tag, but that will only help you stop a theme from changing your stuff if you remove the meta tag SharePoint places in the master page. Moving the theme tag doesn't bypass this issue.

My ending advice would be, while in development keep your master page open in SPD before and while you mess with themes so any saves you do will remove that meta tag. And if you can, use a Feature to deploy custom master pages on production servers.