Ways and Locations to add a custom action to a Ribbon in SharePoint 2010

There are different ways of adding your own custom actions to the ribbon in SharePoint 2010. The ribbon is made up of tabs and groups. Each tab consists of Groups. So when we want to add a custom action we need to identify the correct tab and group.

This is referenced by Tab.Group ID.

1. SharePoint Designer

Using SPD 2010, open the list that you want to customize. You can see the Custom Actions section on the page.

In the Ribbon, click on Quick Step and you will get 5 options to choose from.

Revolutionize Your Business With Generative AI

From product design and software development to virtual agents, content creation, and reporting, GenAI is transforming business. Our AI experts help you unlock GenAI’s full potential and drive growth.

Let’s Get Started

If you select Edit Form Ribbon, you will see a screen where you can specify the url for the icon, url for the application and the location.

If you scroll down,

Now if you refresh the list screen in the internet explorer.

2. Features

To add a button using a feature, create a feature file as specified below.

<?xml version="1.0" encoding="utf-8" ?>
<Feature Id="{a49bc1a4-e324-47fb-bdf2-3441117cd364}"
Title="My Own Action"
Description="Description of the Feature."
Version="1.0.0.0"
Scope="Web"
xmlns="http://schemas.microsoft.com/sharepoint/">
<ElementManifests>
<ElementManifest Location="manifest.xml" />
</ElementManifests>
</Feature>

Create a manifest file specifying the button and its location.

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
<CustomAction Id="Ribbon.ListForm.Edit" Location="ViewToolbar" RegistrationId="100" RegistrationType="List" Title="Add a Button">
<CommandUIExtension>
<CommandUIDefinitions>
<CommandUIDefinition Location="Ribbon.Library.Actions.AddAButton.Controls._children">
<Button Id="Ribbon.CustomCommands.NewRibbonButton" Command="NewRibbonButtonCommand" Image16by16="/_layouts/images/FILMSTRP.GIF" Image32by32="/_layouts/images/PPEOPLE.GIF" LabelText="New Button" TemplateAlias="o2" />
</CommandUIDefinition>
</CommandUIDefinitions>
<CommandUIHandlers>
<CommandUIHandler Command="NewRibbonButtonCommand" CommandScript="javascript:alert(‘This is a new button!’);" />
</CommandUIHandlers>
</CommandUIExtension>
</CustomAction>
</Elements>

Install and activate the feature. This will make a button appear on the Toolbar of a list. This approach has been explained in the technical documentation for SharePoint 2010.

In my next blog, I have some code snippets to add buttons to the Ribbon using code.