Suggestion Pills Row | Integrated Elements | Website UX Elements | Implementation

The Suggestion pills row is an integrated launch component that shows a short row of clickable suggested prompts on your site. Each pill opens Nobi with a contextual question so visitors can start faster.

Preview:

Dashboard setup

Set up the Suggestion pills row from the Website UX Integrated page before copying code into your site.

Go to Website UX > UX Elements > Integrated.

Select Suggestion pills row to preview the element and review where it works best.

Use Add to site to copy the implementation snippet.

Use Try it out in the playground, or open Website UX > UX Elements > Playground, to test the element before adding it to your storefront.

How It Works

Add the suggestion pills row element to your page and Nobi automatically generates relevant prompts based on the page context, available products, and indexed site content.

When to Use a Suggestion Pills Row

Detail pages - Show prompts like "What financing options are available?" or "Show me similar items" near product or listing details

Homepage - Engage visitors with prompts like "Show me new arrivals" or "What's trending?" near your hero section

Category pages - Guide discovery with "Help me find the right fit" or "Show me bestsellers"

Anywhere you want to prompt engagement - Pills work as conversation starters that show visitors what they can ask Nobi

Suggestion pills work particularly well when placed high on the page, before visitors have started browsing or searching. They suggest ways to use Nobi that visitors might not think of on their own.

How Pills Are Generated

Pills are created by Nobi's AI based on:

The current page (product, collection, homepage)

Product details (title, description, attributes)

Common visitor questions and use cases

Your catalog and available products

The prompts are designed to either help visitors get their questions answered using available product and page context, or discover related products and items. Pills adapt to any vertical - ecommerce, automotive, real estate, and more.

What Visitors See

Pills are contextual to where they appear:

On an ecommerce product page:

"What sizes are available?"

"Show me similar products"

"Does this run true to size?"

On a collection page:

"Find running shoes"

"Show me bestsellers"

"What's on sale?"

On the homepage:

"Help me find a gift"

"Show me new arrivals"

"What's trending?"

On an auto dealer vehicle page:

"Compare similar SUVs"

"What financing options are available?"

"Schedule a test drive"

On a real estate listing:

"Show similar homes nearby"

"What are the school ratings?"

"Request a showing"

Mobile Experience

Suggestion pills adapt to mobile screens automatically. On narrow screens, the single-row carousel works particularly well because visitors can swipe through prompts without scrolling.

Styling

The Suggestion pills row uses Nobi's standard pill styling: compact rounded prompts, a small prompt icon sized to the text, consistent spacing, and responsive wrapping when space is limited. You can still customize colors, fonts, borders, spacing, and hover effects with CSS.

For complete styling options, see the Suggestion pills technical reference.

Suggestion Pills Row Launch Component Dashboard setup How It Works When to Use a Suggestion Pills Row How Pills Are Generated What Visitors See Mobile Experience Styling