Skip to content

Setup Markup Insertion Requirements

clock Avg. 2 min read

Setup Markup Insertion Requirements

This page is part of the Manual Setup guide. See the main page here. If you are building a Single-Page Application and do not use Hello Retail rendering, you can skip this guide.

Recommendation boxes

Hello Retail recommendation boxes are rendered by adding container divs with specific IDs to your site’s markup. Learn how to find the correct IDs for your site here.

If you are building an extension, provide a UI to configure the IDs of the container divs in your platform. This lets users change the mapping between container divs and loaded content without code changes.

To support Hello Retail Search, do the following:

1: Provide a dedicated page to display full search results. In addition to your normal layout (navigation, header, etc.), add a container div where Hello Retail will insert the results.

<div id="hr-search-results"></div>

2: Add an id to your search input for Instant Search. Prefer updating the existing input rather than replacing it, so the current behavior continues until Hello Retail takes over.

<input id="hr-search-input"></input>

Unsupported platforms:

Guides

Main page