The BAM Doc Portal was built to provide a source for both documentation of the BAM web components as well as tools to help reference and work with the components outside of a production site.

Here's a quick overview of the new BAM tools:

Shortcode Tester​

The Shortcode Tester is a tool that allows you to enter any format of shortcode that references a BAM component and get detailed feedback on that component. This tool will provide you with:

• Validation of the shortcode format
• The resulting web component parsed from the shortcode
• A preview of the web component
• A breakdown of the API response to see promotion details included from the server response

Shortcode Table​

The Shortcode Table is a quick reference guide to the most common shortcodes in use with different properties that incorporate BAM on their site.

You can select the property you want to see from the dropdown and each will default to the format commonly employed on that site/framework.

Each shortcode has an icon that will link you to the testing tool in order to see what the web component will look like on the page.

Styling Tool​

The Styling Tool provides an in-browser CSS editor that both acts as a reference for the CSS variables available and a preview tool to see how changing the variables will affect the look and feel of the BAM web components.

The tool incorporates the same editor as VSCode to allow you to see CSS changes in real-time. You can select the type of component you want to preview in the dropdown below the editing area.