Toolbar on Product & Listing Pages
- 1 Minute to read
- DarkLight
Toolbar on Product & Listing Pages
- 1 Minute to read
- DarkLight
Article summary
Did you find this summary helpful?
Thank you for your feedback
This section provides detailed instructions for implementing the Toolbar Enhanced Content Experience on your website. Common implementations include Product Pages on the Hero image and Product Listing Pages (ex category or search results pages).
Following this method will render the 'Toolbar' (also known as Mosaic) wherever the HTML element is placed. The most common location to display the Toolbar is in the upper left corner of the image on which it is being overlaid.
Implementing Toolbar
IMPORTANT
Please ensure our SyndiTag is placed anywhere on your web page. If you have not placed the tag please review section SyndiTag Overview
Wherever you'd like a toolbar to appear, add this HTML element:
<syndigo-mosaic pageid="Page-ID-HERE"> </syndigo-mosaic>
pageid(The content to display; a product SKU or product ID) must be filled in with the desired Page ID or Product Identifier to display in the element.
Available Attributes
There are several configurable attributes:
| Name | Description | Default | Required? |
|---|---|---|---|
| pageid | The content to display; a product SKU or productID. | YES | |
| displaymode | Can be either ribbon or modal | ribbon | NO |
| hoist | When the mosaic is hoisted, it's internal content will be appended to the bottom of the page body in an element named or (depending on which displaymode value is set). This setting is useful when you want to ensure the mosaic content is always on top of content, and the existing place in the page body has a specific z-index set that you can't break out of. It's recommended that you only use this feature when necessary. | FALSE | NO |
| open | Determines if the mosaic is open or closed. | FALSE | NO |
| hidden | whether or not the mosaic should be visible | FALSE | NO |
Was this article helpful?