You are here: Configuration > Attributes and Arrays > Using Images with Attributes

Using Images with Attributes

OVERVIEW

In CPQ Cloud, you can display images next to an attribute, as well as show menu values as images instead of text. This allows users to choose a menu value by clicking on the image. Image Menus are available for both array and non-array type single-select and multi-select menus.

If you populate a menu with images, you can display them either as a Grid or as a drop-down.

ClosedExample of a Grid Menu


ClosedExample of a Drop-Down


ADMINISTRATION

Before you being using Image Menus, update the Configuration stylesheet.

ClosedUpdating the Configuration Stylesheet

  1. ClosedNavigate to the Regular Stylesheets List page.

    1. Click Admin to go to the Admin Home Page.

    2. Click Catalog Definition in the Products section.

      The Supported Products page appears.

    3. In the Navigation column, select Stylesheets and then click List.

      The Regular Stylesheets List page appears.

  2. Edit the stylesheet.

    For more information about stylesheets, see Stylesheet Manager.


ClosedAdding Image Menus in the Menu Properties Section

  1. ClosedNavigate to the Configurable Attributes Administration List page.

    1. Click Admin to go to the Admin Home Page.

    2. Click Catalog Definition in the Products section.

      The Supported Products page appears.

    3. In the Navigation column, select Configurable Attribute and then click List.

      The Configurable Attributes Administration List page appears.

  1. Click the name of a Single Select or Multi Select Menu attribute to which you want to add images.

    The Attribute Editor page appears.

  2. Select Yes for the Image Menu option.

    The Image Menu Properties section appears.

    1. If you leave this option as No, you can still add images to the menu, but they will display next to your configurable attribute. Using the Image Menu Properties section gives you additional flexibility and options for your menu images. For more information, see Using the Image Menu Properties Section , below.
  3. Choose the Display Type: Drop-down Menu or Grid. See the examples above.
  4. In the Menu Population section, click Entry Manager.

    If you get a message about saving attributes, click OK.

    The Menu Items List page appears.

  5. For each Menu Item, click Browse to search the File Manager and select the image you'd like to correspond with your menu value.

    Click Clear to clear an existing image.

    1. Make sure your images have already been uploaded to the File Manager.
  6. Enter values in the Image Menu Properties section, described below in Using the Image Menu Properties Section .
  7. Click Apply or Update to save your changes.
  8. Click Back to close the Menu Items List page.

ClosedUsing the Image Menu Properties Section 

Enter the following values in the Image Menu Properties section:


NOTES

RELATED TOPICS

Related Topics Link IconSee Also