Add button in SharePoint 2010 RTE Editing Tools Ribbon

Hi All,

Recently I had a situation to add a custom button on Editing Tools ribbon (SharePoint Enhanced Rich Text Editor Editing Tools Ribbon).

Scenario:

In my project have an application page, where used LFI (List Field Iterator) to add/update a particular list items. There is a Multi Lines of Text field with Enhanced Rich Text Mode. I wanna bring a custom button on SharePoint Enhanced Rich Text Editor Editing Tools Ribbon. See the below snapshot

Solution:

Here, I am going add a new button (or control in general) to an already existing tab (Paragraph) group on the Ribbon using a feature. Create a Empty Element and add the below code.

Code:

<?xml version="1.0" encoding="utf-8"?>

<Elements xmlns="http://schemas.microsoft.com/sharepoint/">

    <CustomAction

     Id="TestButton"

     Location="CommandUI.Ribbon"

     RegistrationId="100"

     RegistrationType="List">

      <CommandUIExtension>

        <CommandUIDefinitions>

          <CommandUIDefinition

           Location="Ribbon.EditingTools.CPEditTab.Paragraph.Controls._children">

            <Button

             Id="TestButton"

             Command="ShowAlert"

             Image16by16="/_layouts/images/actionseditpage16.gif"

             Image32by32="/_layouts/images/actionssettings.gif"

             LabelText="Custom Script"

             Sequence="10"

             TemplateAlias="o1"/>

          </CommandUIDefinition>

        </CommandUIDefinitions>

        <CommandUIHandlers>

          <CommandUIHandler Command="ShowAlert" CommandAction="javascript:alert('Custom Script');" />

        </CommandUIHandlers>

      </CommandUIExtension>

    </CustomAction>

  </Elements>

Result:

Reference Link:

http://aarebrot.net/blog/2010/09/adding-a-custom-button-to-the-ribbon-using-a-feature-in-sharepoint-2010/