Defining Custom Content Type Icons

In most places where content items are listed in CUE, the name is accompanied by an icon. In general, the idea is that the icon represents the content item type - so stories are represented by document icons, pictures by image icons, and so on. Only a small number of generic icons are supplied with CUE, however, so in publications with many content types, different types will end up being represented by the same icons. You can, however, define your own icons and associate them with the content types defined in your publication.

To define an icon for a content type, you must add a ui:icon element to your publication's content-type resource, as a child of the appropriate content-type element. Suppose, for example, that you want to add an icon for your Gallery content type: you would then need to insert a ui:icon element as a child of the <content-type name="gallery"> element.

For general information about the ui:icon element, see here. You will see that the ui:icon supports a number of built-in icons. These icons are, however, only for use in Content Studio, and cannot be used in CUE. Instead you must:

• Make your own icon as a PNG image.

• Put it in a location on the network that will accessible to CUE.

• Supply the absolute URI of the PNG file in the ui:icon element. For example:

  <ui:icon>http://my-company-server/icons/custom-gallery.png</ui:icon>

The icon images you create must have the following characteristics:

• PNG format

• Monochrome: black on a transparent background. CUE automatically inverts the colors where necessary.

• 32x32 pixels in size