You are here: Configuration > Attributes and Arrays > HTML Attributes

HTML Attributes

OVERVIEW

You can insert customer HTML in a configuration page by defining an HTML type attribute at any level in the product hierarchy. These attributes can be associated with default or custom templates in the configuration or selection flows. HTML attributes can be used as action attributes in Recommendation and Hiding rules. In Recommendation rules, they must be of forced set type.

Configurable HTML attributes are carried to Commerce like other Configurable attributes. They can be displayed in the Transaction as well as in printer-friendly documents.

ADMINISTRATION

ClosedAccessing the HTML Attribute Editor Page

  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.

  2. Click the name of an attribute with HTML in the Attribute Type column, or create a new attribute.

    The HTML Attribute Editor page appears.


ClosedUsing the HTML Attribute Editor Page

The HTML Attribute Editor page has the following sections under the General tab: Main Information, Properties, and Default Data.

ClosedMain Information Section

  1. Edit the Name of the attribute.
  2. Enter a Description.

    If Help Icon is checked for the attribute in the Configuration Flow Editor, the description appears when the user hovers over the help icon.

    For more information, see Configuration Flows.

  1. Select the Auto Resize option to enable the attribute to fit all of its content on the user side.
    1. If it is unchecked, then you can give the attribute dimensions (in pixels) and it will remain that size. Scrollbars will appear if there is overflow content.

ClosedProperties Section

  1. Notice that the Set Type cannot be edited. It is always a Forced Set.
  2. Select the appropriate checkbox for:
    • Hidden The attribute will not appear to the user. It can be used in rules. By default, HTML attributes are marked as hidden.
    • Hide In Transaction The attribute is hidden within a commerce document.
  1. Choose the Status of the attribute:
    • Active An attribute that is active will appear to the buyer and/or be included in rules.

      All attributes are active by default.

    • Inactive An inactive attribute cannot appear in a rule to the user.
    • Internal An internal attribute will only appear to FullAccess users.
  1. Click Show Start/End Dates to specify how long the attribute will remain in the chosen status.

      If no duration is specified, the attribute maintains its status until the admin changes it.

ClosedDefault Data Section

Click Edit HTML to edit the HTML source for the attribute.


ClosedUsing HTML Attributes in Printer-Friendly Documents

The configuration HTML attributes can be displayed in the printer-friendly document. They need to be looped over the line items for it to be printed per line.

If you are using table structures in configurable HTML attributes and want to render them correctly in the PDF, then your table tags must contain the column attributes which contains the number of table columns and the corresponding widths as follows:

The above is the default structure of the table generated when a table is inserted in the HTML editor. However, if the FullAccess user uses the source code mode in the HTML editor and codes the table tag, they must remember to manually put in the columns attribute. Otherwise, the table would fail to render correctly on the PDF.

The unit of the column width is set in inches in the parser. The table structure received from the configuration HTML editor has inches hard-coded into the table creation window so it does not allow other units for column width.


USE CASES

ClosedChanging an image based on menu selection

Goal: dynamically change an image based on a menu selection.

  1. Create an HTML attribute.
  2. Select the Hidden checkbox under Properties.
  3. Create a recommendation rule. Use your new HTML attribute as the action attribute.
    1. In Recommendation rules, HTML attributes must be of forced-set type.
  4. Create your advanced function designed to return the proper image based on your menu selections.

  1. Return to your configurable attribute and use both HTML and JavaScript to dynamically change the image.

Now that this has all been created, you should be able to see your image/images when you are on the configuration page:


NOTES

Have as few attributes "auto-update" as possible.

RELATED TOPICS

Related Topics Link IconSee Also