Sitecore 8 for Beginners – Executing Command on Ribbon Button Click

This is the second post in the Sitecore Beginners series.

In Part 1 we have added a new button to the Sitecore ribbon which does nothing yet.

We will start with writing code for the Sitecore command which will listen the button click.

For this, I created an empty “Web Application” project in Visual Studio 2012 (you can choose “Class Library” as well) & named the web project “SitecoreLearnings.Web”.


Commands which ships with Sitecore are defined in the “Sitecore.Kernel” library under below path:
Sitecore.Shell.Framework.Commands

We will also follow the same structure, so lets create a new “Shell” folder under the website root & after that we will create “Framework” > “Commands” folder as well.

Folder Structure

In the “Commands” folder, I created a class named “LaunchSpeakDialog” which has following code:

public class LaunchSpeakDialog : Command
{
    public override void Execute(CommandContext context)
    {
        SheerResponse.Alert("Hello World!", new string[0]);
        return;
    }
}

Code explanation :
Our class  inherits from Sitecore’s “Command” class as it contain some important methods (we would need to add the reference of “Sitecore.Kernel” DLL in our project).

We have overridden the base class’s “Execute” method which is being called when we click the button.

In Sitecore we can use SheerResponse class’s Alert method to show dialog with a message.

Enough code for now :-),but how this code will get executed when we click our button?

Configuring the “command” in Commands.config:
Sitecore provides the configuration for all commands in
“/App_Config/Commands.config” file.

This is an XML file which contain many command tags.

Let’s  define a new command tag in “Commands.config” for our command class:

<command name="custom:showdialog" type="SitecoreLearnings.Web.Shell.Framework.Commands.LaunchSpeakDialog,SitecoreLearnings.Web"/>

Don’t forget to put our assembly “SitecoreLearnings.Web” in our Sitecore website’s “bin” folder.

After configure the command let’s now navigate to the our button in core database.
“/sitecore/content/Applications/Content Editor/Ribbons/Chunks/Custom Chunk/Launch My Dialog”

In “Click” field of the item let’s put the command name we defined in the “Commands.config”.

chunk-button

Save this item & click our button in the ribbon, if you see the below image as I do congratulations we have executed the command successfully.

hello-world

That’s it!!

In next post we will encounter with SPEAK to bind with our dialog.