Configuration 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.
Configuration HTML attributes are carried to Commerce like other Configuration attributes. They can be displayed in the Transaction as well as in printer-friendly documents.
Administration
Accessing the HTML Attribute Editor Page
-
Navigate to the Attributes Administration List page.
-
Click Admin to go to the Admin Home Page.
-
Click Catalog Definition in the Products section.
The Supported Products page opens.
-
In the Navigation column, select Attributes and then click List.
The Attributes Administration List page opens.
-
Click the name of an attribute with HTML in the Attribute Type column, or create a new attribute.
The HTML Attribute Editor page opens.
Using the HTML Attribute Editor Page
The HTML Attribute Editor page has the following sections under the General tab: Main Information, Properties, and Default Data.
Main Information Section
- Edit the Name of the attribute.
-
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.
-
Select the Auto Resize option to enable the attribute to fit all of its content on the user side.
If it is unchecked, then you can give the attribute dimensions (in pixels) and it will remain that size. Scrollbars appear if there is overflow content.
Properties Section
Set Type |
Notice that the Set Type cannot be edited. It is always a Forced Set.
|
Hidden |
This attribute will not appear to the user. It can be used in rules.
|
Hide In Transaction
|
This attribute is hidden within a commerce document.
|
Status
|
-
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.
-
Show Start/End Dates: Click to specify how long the attribute will remain in the chosen status.
If no duration is specified, the attribute maintains its status until the administrator changes it.
|
Default Data Section
Click Edit HTML to edit the HTML source for the attribute.
Using 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.
Adding an HTML Attribute Watch Video
Editing an HTML Attribute Watch Video
Use Cases
Changing an image based on menu selection
Goal: dynamically change an image based on a menu selection.
- Create an HTML attribute.
- Select the Hidden checkbox under Properties.
-
Create a recommendation rule. Use your new HTML attribute as the action attribute.
in Recommendation rules, HTML attributes must be of forced-set type.
-
Create your advanced function designed to return the proper image based on your menu selections.
- Return to your configuration attribute and use both HTML and JavaScript to dynamically change the image.
HTML Script:
Sample JavaScript code:
Now that this has all been created, you should be able to see your image/images when you are on the configuration page:
Notes
Note: Customers should not use any of the following names for Configuration attribute variable names. Using these values may cause issues with customer configurations and could possibly alter site functionality.
- action_id
- bm_cm_process_id
- _bom_
- bs_id
- commerce_doc_url_params
- commerce_list_id
- document_id
- document_number
- folder_id
- formaction
- from_config
- scrollTop
- shopping_cart_id
- step_id
- token
- version_id
-
Ill-constructed HTML can break Configuration Layouts, so the FullAccess user must be very careful about setting values for HTML fields.
-
HTML attributes cannot be used as a rule condition or in configuration arrays.
-
Date and HTML attributes cannot be menus.
-
HTML attributes cannot be used in an array.
-
Have as few attributes "auto-update" as possible.
Notes:
-
HTML attributes are used as strings when debugging Recommendation rules.
-
HTML attributes are marked as 'hide in transaction' by default, for performance reasons. Deselect this if you need to use them in Commerce or the Document Engine.
-
Content of the HTML attributes is rendered as unparsed text in the Commerce sub-document.
-
Using CDATA tags in a Configuration HTML attribute will prevent Pending Configurations from saving, if saving Pending Configurations is enabled on the site. CDATA tags are automatically added to the default of the attribute if a <script> tag is used when editing via the Edit HTML window. Whether the HTML contains a CDATA tag because of this, manual addition in the default, or being set by a rule, the CDATA tag should not be used if Pending Configurations are required to be saved.
Related Topics
See Also