Creating custom icons by adding a file element | HCL Digital Experience

You can create custom images for items in the Page Components palette and Web content authoring interface by deploying the image file or multi-scale ZIP file directly into the item in the Page Components palette or Web content authoring interface as an element.

About this task

Note: In CF09, the Content palette was renamed to Page Components palette, and the custom images feature was extended to the Web content authoring interface.
  • Supported image file formats are PNG, JPG, and SVG.
  • If you are using multi-scale icons, the collection of images must be compressed into a ZIP file.


  1. Click the Applications menu icon in the site toolbar.
  2. Click Content > Web Content Authoring.
  3. To assign a custom image to a content item or a site area, select the item and click Edit.
    • You can also do the same in a content template or site area template to make this field available to content authors.
  4. Click the More menu.
  5. Click Manage Elements.
  6. In the Element type dropdown menu, select File.
  7. In the Name field, specify the name of the new element as preview-image.
    • Any content items, including items created prior to CF09, that include an element named preview-image will use the images stored in this element as the icon of the content item in the Web content authoring interface.
  8. Click Add.
  9. Click OK to exit the Element Manager window.
  10. Upload the compressed file or image file for the preview-image resource element.
  11. Click Save and Close.
  12. Clear your browser cache and refresh the page for the changes to take effect.