Each attribute in the meta definition file for a component type has a type assigned
to it. The attribute's type determines how the merchant sets its value in the Page Designer
visual editor. For example, an attribute of type file displays a file
selection modal window that the merchant can use to browse the library files. An attribute
of type enum displays a single select box where the merchant chooses one of
the allowed values.
This table describes the type options for component attributes and how those options are displayed in the Page Designer visual editor.
| Component Attribute Type | Attribute Semantics | Visual Editor UI Control |
|---|---|---|
| boolean | Boolean | Check box |
| category | String representing a catalog category ID | Category picker |
| cms_record | Record from the Salesforce CMS (Content Management System) | User is presented with a modal window to select the CMS record. After the user selects the CMS record, the edit panel displays the UI controls necessary to configure the attributes of the slected CMS record. |
| custom | String enclosed in curly brackets {} that represents a JSON object | Text area or custom UI control |
| enum | Enumeration of either string or integer values. | Select box (single select) |
| file | String representing a file path within a library | File picker |
| image | String representing a configurable image JSON | Image picker that lets users select an image and specify a focal point on that image. The image dimensions are also stored and can be accessed, along with the image name and focal point, using the Image API |
| integer | Integer | Input field |
| markup | String representing HTML markup | A rich text editor that allows semantic formatting options to produce HTML markup |
| page | String representing a page ID | Page picker |
| product | String representing a product SKU | Product picker |
| string | String | Input field |
| text | String | Text area |
| url | String representing a URL | URL picker |