Professional SharePoint® 2010 Branding and User Interface Design

354

❘

CHAPTER 12 PAGE EDITING AND THE RIBBON

This may not be useful for everyone, but maybe there are some edge cases for which creating your

own HTML element would be benefi cial.

Styles

Styles is similar to markup styles except without the added HTML markup. The following example

adds a new style to the ribbon named

CustomStyle:

.ms-rteStyle-RandysStyle {

-ms-name:”CustomStyle”;

color: lime;

font-size: 200pt;

}

When CustomStyle is clicked, the selected text will have the color lime and a font size of 200pt

applied to it.

ADDING CUSTOM BUTTONS TO THE SHAREPOINT RIBBON

In the fi rst section, we talked about adding styles to the ribbon to help enforce a consistent style

throughout the SharePoint content. The ribbon provides a central place on every page that users can

reference to make whatever changes they need to make. But the ribbon is also a good place to add

buttons to perform custom functionality that might be required to solve specifi c business problems.

In this section, we’ll discuss extending the ribbon to provide other options to content authors to

improve usability in your SharePoint site.

In many ways, this topic and those that follow through the rest of this chapter may dive deeper into

code, perhaps outside of many designers’ comfort zone. While it’s not critical that you completely

understand these topics, as a designer you may be asked to be involved with assisting developers ...