Skip to main content

Simple SharePoint 2010 Ribbon example

As we all know SharePoint 2010 came with the new ribbon interface. I have not had much time exploring how to add elements to the ribbon, so I decided to have a go at it.


I decided to use a blank site and try to add a ribbon to the main web part page. With god help from the Professional SharePoint 2010 Development book, here is how i did it.


I started by creating two projects in my solution, one to deploy the images and one to deploy the ribbon feature. The reason for this is that I like to use the sandbox solutions as much as possible. As the images are going into the _layouts\images catalog and therefor needs to be a Farm solution and the ribbon with only one feature can be a sandbox solution.


The way the Ribbons are organized are by a path. In my example the path is “Ribbon.WebPartPage.Edit.Controls._children” , here I'm saying that I want my ribbon to be on WebPart pages under the edits controls, _children means that I want it as new child not override an existing one. I found this path in the \TEMPLATE\GLOBAL\XML\CMDUI.XML where all the out of the box ribbons are described.


So with the knowledge of the path of the ribbon controls I was able to add the new icon to the webpart page. Here is the elements.xml used to do that.



<elements xmlns="http://schemas.microsoft.com/sharepoint/">
<customaction id="MyRibbonTab" location="CommandUI.Ribbon" title="My Ribbon icon">
<commanduiextension>
<commanduidefinitions>
<commanduidefinition location="Ribbon.WebPartPage.Edit.Controls._children">
<button id="Ribbon.WebPartPage.Edit.Controls.RibbonTest" alt="Test Button" command="Test_Button" labeltext="Click Me!!" image16by16="/_layouts/images/XMLRibbonEksample/Smile16x16.gif" image32by32="/_layouts/images/XMLRibbonEksample/Smile32x32.gif" templatealias="o1">
</button></commanduidefinition>
</commanduidefinitions>
<commanduihandlers>
<commanduihandler command="Test_Button" commandaction="javascript:alert('Hello world!!');">
</commanduihandler>
</commanduihandlers>
</commanduiextension>
</customaction>

And a screen shot of the icon.
Labels:

Comments

Post a Comment

Popular posts from this blog

Getting the script folder in PowerShell

Today I needed to call another script file in the same folder as the main script. After a little searching on the web I found "$MyInvocation.MyCommand.Path". "$MyInvocation.MyCommand.Path" returns the path to the current script, With that I was able to get the current folder using Get-Item. This is my test scripts: ToRun.ps1: Write-Host $MyInvocation.MyCommand.Path $scriptDirectory  = (Get-Item $MyInvocation.MyCommand.Path).DirectoryName $scriptName = "HelloWorld.ps1" Write-Host calling $scriptName in $scriptDirectory & ($scriptDirectory + '\' + $scriptName) HelloWorld.ps1: Write-Host "Hello word" After running the script the output was: calling HelloWorld.ps1 in C:\scriptFun Hello word Simple but useful.
Post a Comment
Read more

Using azure event gird with a function app

Introduction In this tutorial we will set up a simple azure event grid topic, with an function app as a subscriber to the topic. The function app will just log the messages, so we can se that it picked up the event. Setting things up First step is to create a resource group where we can add all the azure services we need az group create --name  myresourcegroup   --location norwayeast We need to set up a storage account that can be used bye the function app. az storage account create --name mystorageaccount --resource-group myresourcegroup --location eastus --sku Standard_LRS Now that we have a storage account we can make the function app. Here we will set it up to be able to run .Net 6 functions az functionapp create --name myFunctionApp --resource-group  myresourcegroup  --consumption-plan-location eastus --runtime dotnet --runtime-version 6.0 --functions-version 4 --storage-account  mystorageaccount...
Post a Comment
Read more

Separate frontend 1: Trying to separate GUI layer and data business layer.

I have seen in some projects where I have been part of. The dependency injection is done in the presentation part of the application. That can be the API front or the GUI part like in a ASP.Net web application. The way this is done is to have some interfaces to separate the business from the data layers. Often by having the interfaces for them self in a separate project. Then the presentation layer references the business layer, interfaces and data layer, and connects it all together using dependency injection. This makes it easier to test, and change storage or parts of the application. As the injector can just inject new implementations of the interfaces.  But to me that feels like the presentation layer has two large responsibilities,  to present data and connect all the different parts together. What if you needed to change the presentation.  Then you would have to implement the injections also. You can't just switch out the presentation or add new ones. What if the o...
Post a Comment
Read more