By convention, WellWell pages use the suffix .itl to indicate they contain ITL code. If a page with suffix .itl is not found, Interchange will look for .html, but you should not rely on this behavior.

The basis of all WellWell-enabled pages is the tag. Basically, it just elegantly loads the specified template and components, and fits components' output into the appropriate slots within the template.

Page body can, but doesn't have to be present. For example, the Login functionality is implemented completely within the Login component (including the supporting text and error any reporting), so an ITL page login.itl doesn't have anything to do but call the component.

Components rely heavily on CSS and try to avoid any hard-coded HTML. This allows you to re-use the same components (i.e. the Login component) in multiple contexts (i.e. small, boxed display and whole-page display). You only need to adjust the CSS, and options exist to auto-wrap the components in appropriate CSS <div>s that you can immediately use them as selectors in your CSS files.

Here's an example of page index.itl that fits two components into container named "RIGHT", and two components into container named "BODY". Also, options are passed to two of the components, product_info and products_list:

[compose
  components.right="login create_account"
  components.body="product_list product_info"
  
  attributes.product_info.sku="1"
  attributes.product_list.category="2"
]

(Body text goes here, but none needed in this context.)

[/compose]