Customise the SharePoint 2010 Ribbon: View Format Group for Document Libraries (Ribbon.Library.ViewFormat)

Posted by GeorgeH on November 16, 2011

The SharePoint 2010 Ribbon architecture allows new tabs, groups and controls to be added to Extend the built-in controls for managing sites, lists and items/content in SharePoint 2010.
This article demonstrates how to include an additional control in the existing "View Format" group in the Library tab on the Ribbon for Document Libraries in SharePoint 2010. The View Format group for Document libraries generally contains button controls that can be used to switch the current view from Standard to a Datasheet view. If you have custom views associated with a Document Library that need to be easily accessible, new buttons can be included in the View Format group to open these views for the current library. As the Ribbon in SharePoint 2010 provided a common area for the majority of functionality available for Document Libraries, adding additional functionality such as the above example to the Ribbon maintains consistency, allowing users to more easily become familiar with the location of various features and using the Ribbon in general.

You can add custom actions / controls to the Ribbon using SharePoint Designer 2010, or by creating a site feature that contains the Ribbon extensions that it installed and activated on sites.

The following is an example Custom Action with a CommandUIDefinition which adds a new control to the existing View Format group on the Ribbon for Document Libraries. Information about the values included in attributes and the behaviour/result that is achieved by each is also provided below.

<CustomAction Id="Ribbon.Library.ViewFormat.Controls.CustomLink"
Location="CommandUI.Ribbon"
RegistrationId="101"
RegistrationType="List"
Title="Add to the Existing View Format Group on the Ribbon">
<CommandUIExtension>
<CommandUIDefinitions>
<CommandUIDefinition
Location="Ribbon.Library.ViewFormat.Controls._children">
<Button
Id="Ribbon.Library.ViewFormat.CustomLink"
Sequence="95"
Command="Library.ViewFormat.OpenCustomLink"
Image16by16="/_layouts/$Resources:core,Language;/images/formatmap16x16.png"
Image16by16Top="-32" Image16by16Left="-88"
Image32by32="/_layouts/$Resources:core,Language;/images/formatmap32x32.png"
Image32by32Top="-160" Image32by32Left="-448"
LabelText="View Format Group : Custom Link"
Description="Open Custom Link"
ToolTipTitle="Custom Action in View Format Group"
ToolTipDescription="Opens a Custom Link via a control added to the existing View Format group on the Ribbon under the Library tab"
TemplateAlias="o1" />
</CommandUIDefinition>
</CommandUIDefinitions>
<CommandUIHandlers>
<CommandUIHandler
Command="Library.ViewFormat.OpenCustomLink"
CommandAction="http://www.master-sharepoint.com/" />
</CommandUIHandlers>
</CommandUIExtension>
</CustomAction>



Example Details:

CommandAction Element
Location: "CommandUI.Ribbon"
Required when extending the Ribbon interface

RegistrationId: "101"
Corresponds to a Document Library in SharePoint

Registration Type: "List"
Set as list to indicate that the Custom Action is applied to a list, or type of list

The CustomAction element has a child element CommandUIExtension, which contains two child elements:
1. CommandUIDefinitions
Contains one or more CommandUIDefinition elements.
2. CommandUIHandlers
Contains one or more CommandUIHandler elements that define the behaviour of controls when executed/clicked.

CommandUIDefinition Element
Location: Ribbon.Library.ViewFormat.Controls._children
The location of the View Format group on the Ribbon for Document Libraries. The "_children" component of the CommandUIDefinition Location indicates that we are adding an additional components (controls) to the existing Ribbon.Library.ViewFormat.Controls location in the command interface for the Ribbon

The CommandUIDefinition element includes child elements for the components that are being added to the Ribbon. In this case, we are adding a Button control to the Ribbon.

Button Element
The Button element is the control that we are adding to the View Format group.

Id: "Ribbon.Library.ViewFormat.CustomLink"
A unique identifier for the button control.

Sequence: "95"
The sequence, or order that the new button will be added in relation to other controls in the same group.

Command: "Library.ViewFormat.OpenCustomLink"
The identifier for the CommandUIHandler that is used when the button is pressed. This value must match the value of the Command attribute of the corresponding CommandUIHandler element.

Image32by32: "/_layouts/$Resources:core,Language;/images/formatmap32x32.png"
The address of the image used on the button face. This is the address of the smae image used for many of the built-in controls on the Ribbon. A separate version containing graphics for a 16x16 px button is also included in the Button element. We are adding a large (32x32 px) button to the interface in this case, which is determined by the template and layout.

Image32by32Top="-160" Image32by32Left="-448"
The position in the image to use. (In this case, a hyperlink graphic is included with this positioning in the image).

LabelText: "View Format Group : Custom Link"
The label or text displayed on the button.

Description: "Open Custom Link"
A description of button functionality.

ToolTipTitle: "Custom Action in View Format Group"
The title of the tool tip displayed when the mouse is hovered over the button.

ToolTipDescription: "Opens a Custom Link via a control added to the existing View Format group on the Ribbon under the Library tab"
The description or body of the tool tip that is displayed when hovering over the button. This would usually contain a more detailed description about the functionality of the button.

TemplateAlias: "o1"
The alias of the template to use when rendering the button. As the View Format group uses the Ribbon.Templates.Flexible2 template with "LargeLarge" as the size, "o1" is the alias that corresponds to the larger sized button in the layout.

CommandUIHandler Element
Command: "Library.ViewFormat.OpenCustomLink"
The Command attribute contains a value that corresponds to the Command attribute of one or more child controls in the CommandUIDefinition element. In this case there is only one, so the value is the same as the value of the Command attribute for the Button element.

CommandAction: "http://www.master-sharepoint.com/"
The URL or javascript to be opened or executed when the button is clicked. In this case, the website http://www.master-sharepoint.com/ is opened when the new button is pressed. This could be a url to a specific View in the list, and can contain a number of tokens that are converted to various values based on the context (eg. is transformed into the GUID of the Document Library).

Related:
SharePoint 2010: Extend the Document Library Menus, Ribbon and Settings Interface
This article contains an example similar to the one above, as well as a number of other examples of adding new controls to the Ribbon for Document Libraries in SharePoint 2010. A table containing some of the RegistrationIDs for common types of Libraries in SharePoint 2010 is also included.

Add Custom action to the New group on the Ribbon for Document Libraries in SharePoint 2010
In this article, a new custom action is added to the New Group on the Ribbon for Document Libraries similar to the example in this article.

Tutorial: Add Custom List actions using SharePoint Designer 2010
In this tutorial, functionality from SharePoint Designer is demonstrated to add custom list actions to lists and libraries in SharePoint using SharePoint Designer. Although you may not have as much control over extending the Ribbon using SharePoint Designer, it allows you to add buttons to open a form associated with the list or library that the action is being added to, open links/pages and start workflows associated with the list/library with ease.

Add Custom Links to the SharePoint 2010 UI as a Feature with or without using Visual Studio
This tutorial explains two methods for implementing custom actions as a site feature in SharePoint, either using Visual Studio, or by manually creating the Feature XML and Element manifest containing the Custom Action definition.

Rating

5/5

Reviews

There are currently no comments or reviews.

Submit a review:

Login required.