Dustin Miller and Heather Solomon contribute regularly to NothingButBranding.com (NBB), a SharePoint resource site dedicated to helping people make SharePoint a better tool for their sites and users. Here are quick links to the articles they have authored:

Mega Menus for SharePoint

In this three part series, Heather Solomon and Dustin Miller will explore the ever-popular “Mega Menu”, and how to create a powerful, styled and functional mega menu for use on your SharePoint sites. In this first part, the focus is on the HTML markup and CSS styling to used to create this oft-requested UI element.

• Part 1
• Part 2
• Part 3

Master pages, who needs them anyways?

A common misconception about SharePoint master pages is that you need several of them. In our SharePoint UI/UX class, Dustin and I meet people who have created several master pages for their SharePoint sites(s) due to branding and site layout needs. Based on design differences, a master page is created for the home page, another master page for the sub pages, and perhaps even another master page for sub site(s) that need different branding and/or layout. There are very few reasons to have more than one master page, and differing home page vs. sub page vs. sub site designs isn’t one of them. Keep reading…

Multiple Sites with Varying Designs in a Single CSS File

Our last article talked about creating your custom designs in SharePoint using only a single Master Page. From the very first delivery of our SharePoint UI/UX Class, our students have excitedly jumped on board – it’s amazing just how much you can do with a single master page!  One student in particular spoke up: “Okay, great, one master page to rule them all. What about one CSS file? Any fancy tricks that will let me keep all my design work for all the sites and site collections in my entire farm in a single CSS file? Even those department sites that want different colors?” It didn’t seem like too much to ask.  Keep reading…

Yes, the SharePoint navigation really can work for your needs

A commonly misunderstood component of SharePoint is the navigation. We are frequently asked in class about how to make changes to the navigation and when we cover it, people are really surprised and honestly, it is pretty anti-climatic! Here are a few things everyone should know about manipulating SharePoint navigation.  Keep reading…

Understanding SharePoint:CSSLink and how to add your custom CSS in SharePoint 2010

CSS is a wonderful tool for branding SharePoint; unfortunately SharePoint 2010 has done a decent job of making things pretty hairy and confusing with working with CSS in a SharePoint site. Something we get asked all the time in our classes is “where do I link to my custom CSS file?” Great question and the answer isn’t just “from your master page”. Keep reading…

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. Continue reading →

This is part three in a multi-part series. The predecessor of this post is Part 2: Creating the Design in SharePoint.

Depending on the customization method you selected (CSS, Theme or Master Page), at this point you have probably managed to alter parts of your SharePoint site. This part of the article series will focus on how to change the look and feel of SharePoint components that you don’t necessarily have direct or ultimate control over. Continue reading →

This is part two in a multi-part series. The predecessor of this post is Part 1: Designing your SharePoint Site.

In the first part of this series we covered some items to help get you started in creating a comp for your SharePoint site design. Now that you have a design ready to go, it is time to determine how you are going to implement your design. Continue reading →

Contents

1. About Themes
2. Designing a Theme
3. Creating the Theme Image Files

1. Create the Overriding WSS Site Image Files
2. Create the Custom Site Header Image

1. SharePoint Styles Commonly Used for Themes

1. Create the Theme Files
2. Add the Theme to SharePoint
3. Apply the Theme to the Site
4. Theme Preview Image

Continue reading →

Overview of SharePoint 2003 and Introduction to the Components of the User Interface Part Two

» Back to Part One

The Components of the SharePoint 2003 User Interface

Within SharePoint, Microsoft has provided several ways to customize the user interface of both SPS and WSS. This is great because we have several options for customization and we can select the method that best suits our needs and skill set. Continue reading →

One of the more powerful tools in user interface (UI) customization is
cascading style sheets (CSS). CSS allows you to control the display of numerous
items from one central location or central group of files.  Through a
series of selectors and corresponding declarations, the display of nearly any
item can be modified on screen. Continue reading →

Through mailing lists and newsgroups I see many issues and questions over and over again, and one in particular is “How do I customize my portal or WSS site?”.

This is a tough question.  I have been in those shoes staring at the sea of information and options trying to figure out how to do it.  I have been frustrated and I understand the pain that happens trying to figure it all out.  Yet after all that, it is still a difficult question to answer.  Continue reading →

By replacing a small handful of image files you can change the background look of the web part title bar and toolbar for portals and WSS sites.

First, design your new titlebar/toolbar, you will need it in two different heights, and replace the images files on the server with your modified files using the same file names. The images are used as a repeating background, so the width of the image can be very small. If you want light text on a dark background, you will have to additionally modify the CSS files to change the text color. Continue reading →