XHTML Editor Image CSS Classes


Prerequisites:
  • User groups must exist for administrators to configure the Group option. See Creating Groups for details.
  • The Custom CSS file that contains the image CSS classes must exist and be specified. See XHTML Editor Custom Content CSS for details.

Administrators can customize CSS image selectors (i.e., classes) available to users in the XHTML editors. Specify image classes to make available by default or on a "per group" basis.
To set available XHTML editor image CSS classes:
  1. Navigate to Administration > System Options > CMS > XHTML Editor > Image CSS Classes.

    Select Option

  2. Choose one of the following steps:
    • Select the Default option to customize image classes for all users.
    • Select the Group option to customize image classes on a "per group" basis, and select the group from the drop-down list. The image class set only applies to the selected group.
    Additional Information
    Caution
    If you configure multiple options, save your changes after configuring each option. If you switch from one option to another without saving, you lose your changes.

    If groups have image class sets, a checkmark (☑) displays next to the group. To reset all the group's image classes, hover over the checkmark and select the Restore Defaults minus (-) icon.

    Restore Defaults

    If you configure image class sets for the Default option and the per individual Group option, each group's image classes automatically override the Default option for applicable users.

  3. Choose one of the following steps:
    • Add image classes to the option set.
      1. Click Add.

        Add XHTML Editor Image CSS Class

      2. Enter the image class friendly name in the Display Name column. This name identifies the image class for users.
      3. Click the corresponding cell in the CSS Class column. Enter the CSS class name. This name identifies the image class in the CSS.

      Enter Image Selector Display Name and CSS Class Name

      Additional Information
      For example, if you add an image class with the Display NameImage Thumbnail and the CSS Classthumbnail, and save your configurations to only the Authors group, the XHTML editor's Insert/Edit Image dialog displays Image Thumbnail in the Class drop-down list to only Authors group members.

    • Delete image classes from the option set.
      1. Select the image class.
      2. Click Remove.

      Remove XHTML Editor Image CSS Class

  4. Click Save.