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, not suitable for use as content type icons. Instead you must:

• Make your own icon as a PNG image.

• Save the icon in a folder on the same server as CUE, or else in a location on the network that will accessible to CUE.

• Supply the URI of the PNG file in the ui:icon element. if you have placed the icon on the same server as CUE then you can specify a relative URI, for example:

  <ui:icon>icons/custom-gallery.png</ui:icon>

  If you have placed the icon somewhere else in the network, then you will need to specify an absolute URI, 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