style-class

Defines a style button to be added to the Content Studio style bar of the rich text field defined by this element's parent field element. This element only has any effect if specified as the child of a rich text field (a basic field where mime-type is set to application/xhtml+xml).

Inserting this element as the child of a rich text field element causes an additional button to be displayed in the field's Content Studio style bar. The icon sub-element defines the appearance of the button, and the description sub-element determines the button's tool-tip text.

Selecting text and clicking on the button displayed in Content Studio wraps the selected text in an XHTML span element with a class attribute set to name.

macro buttons and style-class buttons appear in the style bar in the same order as they appear in the interface-hints resource.

Syntax

<style-class
    name="..."
  >
    <icon>...</icon>
    
    <description>...</description>
  </style-class>

Examples

<field mime-type="application/xhtml+xml" type="basic" name="body">
  <ui:style>span.green { color: green; }</ui:style>
  <ui:style-class name="green">
    <ui:icon>http://my.server/myicon.png</ui:icon>
    <ui:description>Mark text green</ui:description>
  </ui:style-class>
</field>

Attributes

name="...": The name of the CSS class to be associated with the style button. For the button to have any visible effect in Content Studio, the parent field element must also have a style child element where this CSS class is defined.