Supporters of End User
Web

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Item is currently unrated. Press SHIFT+ENTER to rate this item.1 star selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+ESCAPE to leave rating submit mode.2 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.3 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.4 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.5 stars selected. Press SHIFT+ENTER to submit. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.
Categories:MOSS; WSS; 2007; 2010; SharePoint Designer; Workflow; Libraries and Lists; Site Manager/Power User

In my last article, Adding Custom Actions to the List Item Menu in SharePoint 2010 Using SharePoint Designer 2010, We walked through the process of adding custom actions to the List Item Menu using SharePoint Designer 2010, today, we’re going to have a look at the other Custom Action functionality available to us in SharePoint Designer 2010.

This article is going to group the rest of the options within our Custom Actions drop-down in SharePoint Designer 2010 together, as they are all basically doing the same thing, adding an item to the Ribbon UI, just for different forms (View, Edit, New, and Display).

First, let’s open SharePoint Designer 2010 back up. So, let’s go into our 2010 test site, and click on the Edit Site in SharePoint Designer action off of the Site Actions menu.

Now that we have SharePoint Designer open, click on Lists and Libraries, under the Navigation > Site Objects, area on the left-hand side of your window.

Here is a quick little tip while we are here as well, that is new in SharePoint Designer 2010. If you hover your cursor over Lists and Libraries, as well as any of the other Site Objects navigation options, you will see a thumbtack appear on the right.

If you click on this, it will expand your Lists and Libraries, or any of the other options, below the Site Objects on the left-hand side, allowing you 2007-like left-side navigation navigation between your objects.

On with the show… as I mentioned back towards the start of this article, we’re going to look at the remaining Custom Actions we can build into our lists from SharePoint Designer 2010.

Click on any list that you have on the site. In this example, we will be using a tasks list that I had created for demonstration purposes.

Now that we have our Tasks list loaded, we do not want to use the Custom Actions window in the lower-right hand side of our screen. This will automatically create a Custom Action for the List Item Menu if we click on the New… button. No, to create other types of Custom Actions, we need to use the Custom Action menu in the Ribbon UI to do what we are looking to do.

You will however notice, that by clicking here, the Ribbon context at the top of the screen changes from the List Settings ribbon, to the Custom Actions ribbon.

We are going to use the Custom Actions ribbon to create our first of four custom actions for this article. First, we are going to start with the Display Form Ribbon. To start creating one of these, click on the Custom Action button in the ribbon, and select Display Form Ribbon

By doing so, we see the familiar Create Custom Action window pop-up that we saw in my last article on the subject.

For our example, lets fill in a Name, Description, and under the Select Type of Action, we are going to choose Initiate workflow. For this, I just created a simple list-level workflow, which will e-mail the owner of the task, CC’ing the current user, to request them to review and update the task, with a link back to the task (see screenshot below).

Select our workflow from the drop-down next, in this example, our workflow name is Task Review Request.

Next, if we scroll down in our window, we are going to specify a 32x32 image, so that we have a fancy little icon to go with our button. We could sue a 16x16, but, that will be quite small, and since we’re on the ribbon, we want this to stick out a bit. So, I browsed in the layouts folder in the SharePoint root to find an e-mail related icon, and did, at /_layouts/images/centraladmin_systemsettings_email_32x32.png. You could also use the Browse button to find a local image on your computer or network file share to use.

You will also see in the advanced section, that the wizard automatically entered in the Ribbon Location. This location, Ribbon.ListForm.Display.Manage.Controls._children, is great, because, really, were you going to remember that? Here is a listing of what each of these options are:


Form Name

Ribbon Location

Display Form

Ribbon.ListForm.Display.Manage.Controls._children

Edit Form

Ribbon.ListForm.Edit.Actions.Controls._children

New Form

Ribbon.ListForm.Edit.Actions.Controls._children

View Form

Ribbon.ListItem.Actions.Controls._children

I have also created a blog post, just with this information, available here, which I will reference in later articles, as needed: SharePoint 2010 Custom Actions – Default Form Ribbon Locations

Now, below there, there is the options for Rights mask. This allows you to assign permissions of who can actually see this custom action. If the user does not meet the requirements, which are comma separated values from the SPBasePermissions class enumeration, they do not see the custom action. We will not apply any currently to this item, leaving it for all to see. But, the option is there.

You can choose your own sequence number for this as well. Generally, the best practice is to use anything over 10,000.

Once we are set with this, lets click on OK on the Custom Action Wizard, and now lets see this in action! Let’s go back to our list in SharePoint… Let’s use the List Item Menu, and select View Item

We will get a modal dialog window now with the Display Form, that we linked our Custom Action to. As you will see, we now have a new icon in our View Ribbon, which shows our fancy little e-mail icon, as well as the title of the Custom Action:

Clicking on this will then initiate the workflow which we associated with the Custom Action

And once we click Start on the workflow initiation form, the workflow will then start! Very cool stuff.

To be sure it is actually doing its thing, let’s check the workflows for that list item, back from the main list page, by selecting the Workflows option from the List Item Menu.

Once the page loads, you will see we have a completed workflow for our Task Review Requestworkflow that we created

To finish up this article, we’re going to add the same Custom Action to the other forms on this site as well. So, back in SharePoint Designer 2010, opened to our list, lets create a new Custom Action for each of the other three forms, and see where they show up.

The only change we are going to make however, for each one, is just in the title. We could have it named the same thing for each form, sure, but, I want to show you where these end up in the SharePoint UI, and to do so, I am doing to insert the name of the form into our Custom Action title.

As you can see, when we choose a different ribbon location for our Custom Action, we get a new Ribbon Location automatically populated for us:

Follow the previous steps in the article if you need to to create these additional actions. When finished, we should have four Custom Actions in total assigned to our list, one for each of the form types:

Now, let’s head back to our our SharePoint site and see where these now appear in the UI.

First – let’s have a look at the List View form ribbon – click on the Items tab under the List Tools ribbon, and you will see a section for Actions. You will also see in here, that our ViewForm Custom Action is available here. What does this allow us to do? Well, using the multiple-item selection functionality in SharePoint 2010, we can run our action against multiple list items!

Well, you would think… but if you attempt to do so, you will get an error, so, only do this on a per-item basis. The functionality is not smart enough to fire up three consecutive workflows by using SharePoint Designer 2010 for each of the items you have selected. It will work fine when going through them one by one.

Next, if we go into the Edit Item view form for one of our tasks

we will see that we have our Custom Action appearing in the Actions area of the form

and the same goes for when we go to create a new Task.

However, until the task is created, you will not be able to run the workflow, as until you hit Save on the new item form, your task does not exist as of yet, so, the workflow has nothing to bind to, just something to keep in mind when creating your Custom Actions in SharePoint Designer 2010. If you do try and run your workflow from your Custom Action – you will get the lovely Runtime Error.

I just wanted to show you where this would appear, and that even though the Edit and New Forms use the same Ribbon Location (Ribbon.ListForm.Edit.Actions.Controls._children), they are actually bound to the individual forms themselves.

I hope this article was informative, and helps shed some light on some of the new functionality available in SharePoint 2010, and SharePoint Designer 2010. Please let me know what you think, or leave any questions regarding this material in the comments, and I will answer them as soon as I can.

Comments

Ian Morrish

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Options for the Rights Mask (will hide the custom action if current user doesn't have right) are here
http://www.wssdemo.com/Blog/Lists/Posts/Post.aspx?ID=493

Posted 27-Apr-2010 by Ian Morrish
Thomas

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Hello,

I've tried this to add a "subscribe!" button on a list with internal educations.

We have a problem because normal users do not seem to have rights to start the workflow.. they need edit rights on the list..

How can I control the rights, to give everybody the ability to start the subscribe workflow, without having to give them edit rights?

Posted 09-Jun-2010 by Thomas
Gopalakrishnan

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Hi,

I have a requirement where I need to show a custom Ribbon menu in the View Form of a certain Document Library. The users will choose multiple items and then will click on my custom Ribbon menu. I need to get those selected items and do some custom action.

May I know how this can be acheived?

Posted 11-Jun-2010 by Gopalakrishnan
Jimbo Alba

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Hi Geoff,

I have created two custom actions on the New Form Ribbon, one for each content type available on my list. Now I want to hide the "New Item" menu from the standard ribbon. Is there a way to do this?

Posted 02-Aug-2010 by Jimbo Alba
Matt

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Great post and a useful insight into how this can be done using SharePoint Designer.

Do you have any examples on how this would be done as a feature using Visual Studio 2010 with source code sample.

Thanks

Posted 03-Aug-2010 by Matt
Brian

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Your thoughts...

I am customizing the ribbon's browse buttons on my site, I want to hide and show the top navigation ('#s4-topheader2') when a user clicks on Page (to hide) and Browse (to show). The problem is, when I make a jQuery call when clicking on the Page tab, the Browse tab no longer has it's default link onclick functionality. It is like there is a MS script that changes the class or functionality. So I can hide, but then it does not show again.

Thanks in advance

Posted 24-Aug-2010 by Brian
Charles

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

Geoff,

I noticed customized action item disappears when the list form is customized using InfoPath 2010, how do I keep the customized action item?

Thanks in advance

Posted 28-Sep-2010 by Charles
Christian

Adding Custom Actions to the Ribbon UI in SharePoint 2010 Using SharePoint Designer 2010

I would like to start a Workflow from the item menu but instead of showing a new form with "start" and "cancel" button, just.. start automatically the workflow.... any idea?

Thanks!

Posted 14-Oct-2010 by Christian
Satish Appasani

Hide settings group

Can i use similar concept to hide groups or links in settings page of Lists / Libraries? I want to hide all the settings in the settings page except advanced settings and version settings. Thank you

Posted 12-Apr-2011 by Satish Appasani
Dean

Adding to Wiki Page

Geoff, excellent article. Any idea how the actions can be added to the ribbon of a  wiki page that contains mutiple web parts?
TIA
Dean

Posted 08-Jun-2011 by Dean
Josh

Context Sensative?

Geoff,
 
Is it possible to make the View Ribbon Buttons context sensitive.  So they are only available if a list item is selected.  Like the ViewItem, edit Item, Workflows buttons on list view ribbon?
 
Thanks,
josh

Posted 24-Jun-2011 by Josh
Jürgen

Custom action to export list data to PDF

Thanks Geoff. Great article! Thanks, great article! Here you find another sample to add a custom action to a ribbon bar. The sample adds a "Export to PDF" button to export SharePoint list data into a PDF document using a templating system: http://www.parago.de/2011/04/how-to-export-sharepoint-task-list-data-to-pdf-using-a-templating-system/

Posted 13-Sep-2011 by Jürgen
Vijay

How to Disable "E-mail a Link" from Ribbon using SharePoint Designer

Geoff,
 
Our company policy is not to E-mail any Links and I am having a task to disable the 'E-mail a Link' from the ribbon. I am trying to find some solution using SharePoint Designer or OOTB. Do you have any suggesstions.
 
I will appreciate your thoughts and help.
 
thanks, Vijay

Posted 28-Sep-2011 by Vijay
Colin Cook

Using globally re-usable workflows

Hi Geoff, Nice article, I have succesfully created many custom actions with beautiful icons to keep my users happy, my only question is how can I apply a custom action to start a globally re-usable workflow, the create new action doesnt allow me to select it as an option. I have tried taking the workflow initiation url and replacing the id number with {ItemID} but this doesnt work, is there an easy solution? Thanks, Colin.

Posted 07-Oct-2011 by Colin Cook
Josh

RE: Using globally re-usable workflows

@Colin,
 
Have you associated your globally reusable workflow to the list?  Once you do so I think it should show in the initiate workflow drop down of the custom action.
 
Alternatively, you could use the 'Navagate to URL' option and paste the workflow intitiaition URL in there with {ItemID}, that brings up the initiation form.  I use this to append the {Source} query string so the init form redirects to where I want it to go.
 
The draw back is that the init form needs a {TemplateID} which is the guid of the workflow version and changes everytime you publish the workflow.  This means you have to update the custom action with the new template id everytime you publish a change the WF.
HTH,
Josh

Posted 07-Oct-2011 by Josh
ram

sharepoint

hi ram,
I have the problem how to hide the siteaction, Navigate up and browse in top link bar from my sharepoint site in sharepoint 2010 ..........can any one tel me how to do this ?

Posted 15-Nov-2011 by ram
ram

sharepoint

hi this Ram
can any tel me how to hide siteaction from the toplink bar from my sharepoint site in sharepoint 2010 

Posted 15-Nov-2011 by ram
Dave

Delete custom action

How do I delete a custom action?  I don't see any delete button or icon in SharePoint Designer 2010.

Posted 25-Jun-2012 by Dave
whizsid

Re: Delete Custom Action

Dave, I assume, you would have found this one by now. But if not here is how you do it. In the SharePoint designer, select the Custom Action you would like to delete from bottom right section. Once selected check in the Ribbon (right below File menu) and you will see "Open" , "Delete" & "Rename" buttons right beside "Custom Action" button. Thanks

Posted 03-Aug-2012 by whizsid
Peter

Custom Action is not displayed in List Item Ribbon under Actions

Hi Geoff, I added a custom action by selecting Custom Action->List Item Menu. It got added in the drop down box if an item is selected but it does not show in the List Item Ribbon under Actions like in your screenshots. I also noticed that you have more advance options than mine, I have no 32x32 display menu and ribbon location. Please help

Posted 02-Jan-2013 by Peter
Jordan J

@Peter

A "list item menu" custom action adds items to the drop down menu that shows when you click the Down Arrow Box next to an item's title, I believe. What you wanting is to add a "Display Form Ribbon" custom action which will show up on the ribbon itself. Once you start creating this you'll see an area like this: https://www.nothingbutsharepoint.com/sites/eusp/Photos/2010-02-17-AddingCustomActionsToRibbonUI2010-12_5983.png At which time you can choose where it appears. In the screenshot the icon will be displayed in the "Manage and Edit" section. This is denoted by the line in the text box that reads "Manage.Controls._children" I suspect the other portions of the ribbon would need slightly different code here.

Posted 21-Feb-2013 by Jordan J
lieane

does this solution work on forms customized with infopath

I tried to follow above but doesn't show up on my form that was customized using InfoPath... any suggestions?
thanks,

Posted 05-Nov-2013 by lieane
Mathias

Print Button?

Is there any way using this method to put a print page button? Would love to be able to print the popup DispForm with a ribbon button.

Posted 07-Nov-2013 by Mathias

Notify me of comments to this article

E-mail:
   

Add Comment

Title:

 
Comment:
Email:

   


Name:

 
Url: