Documentation Center

ribbon-normalbutton

The ribbon-normalbutton is a configurable UI element that displays a 16x16 pixel icon and label.

Description

You can add different types of buttons, and button groups using the overlay element in the configuration. The ribbon-normalbutton element is one of five different type of buttons you may wish to configure for your UI.

Namespace

http://xopus.com/2009/lui

Attributes

NameDescriptionType
afterOptional.

The ID of the user interface component where the button is positioned after in the toolbar. If neither before or after is set, then the button element should have a parent with an id attribute, and the button will be appended to the component with that ID.

string
beforeOptional.

The ID of the user interface component where the button is positioned before in the toolbar. If neither before or after is set, then the button element should have a parent with an id attribute, and the button will be appended to the component with that ID.

string
commandOptional.

The name of the command this button is coupled with. See Editor.addCommand element for more details.

string
roleOptional.

The role attribute can be defined as a replacement of the command attribute. The value of this attribute must correspond to a role definition from the node configuration for an element. The will effectively create a toolbar button which acts similarly to the bold button.

iconsrcOptional.

URL for the icon on this button. Relative URI's are resolved from the location of the configuration file.

valid url
overflow-iconsrcOptional.

URL for the icon on this button when shown in the overflow toolbar. Relative URI's are resolved from the location of the configuration file.

overflow icons can only be 16x16 pixels.

valid url
iconoffsetxOptional.

When icons are sprited images, then the x-coordinate value can be defined with this attribute.

overflow-iconoffsetxOptional

When overflow icons are sprited images, then the x-coordinate value can be defined with this attribute.

iconoffsetyOptional.

When icons are sprited images, then the y-coordinate value can be defined with this attribute.

overflow-iconoffsetyWhen overflow icons are sprited images, then the y-coordinate value can be defined with this attribute.
idOptional.

The ID for this button component.

string
availableOptional.

When false the button will no longer be available in the toolbar. See also Command.getAvailable.

boolean
labelOptional.

The alt/title text of the button when the user mouseovers the button.

string
modeOptional

This attribute describes behavior for pressing the button.

When set to toggle (which is default), the current context will be converted to the new element (if allowed by schema) and can be converted back by clicking the button again. 

When set to insert, the new element is always inserted as close to the cursor position as allowed by schema. Clicking this button again does not remove previously added element but rather creates another one.

string

Examples

You can find the complete set of examples for configuring the ribbon-toolbar in the topic for the overlay element.

Adding a button to the ribbon-toolbar

You can add button to the ribbon-toolbar through the overlay element.

Add an overlay in the configuration file (dita-config-custom.xml). The behavior can be based on a role or a command.

<x:config xmlns:x="http://www.xopus.com/xmlns/config" version="1.0">
  <x:overlay xmlns="http://xopus.com/2009/lui">
    <ribbon-normalbutton id="ul" role="unorderedlist" label="Unordered List" after="FindReplaceButton"/>
    <ribbon-normalbutton id="custom" command="CustomCommand" after="FindReplaceButton"/>
  </x:overlay>
</x:config>

Parent element

overlay