Header: Product info
Product info
The Product info block shows the current product's name and price in the header — but only when the visitor is actually on a product page. On any other page it can show fallback text instead, or nothing. It's handy for a floating header that keeps the product name and price in view as the customer scrolls down a long product page.
What it shows
When someone is viewing a product, this block displays that product's name and price up in the header. Clicking it scrolls back up to the main product area. On pages that aren't product pages (your front page, a category, the cart), there's no product to show, so the block either displays fallback text you've written or stays hidden.
Settings
Setting | What it controls |
|---|---|
Show product name | Display the product's name |
Show product price | Display the product's price |
Show fallback text | On non-product pages, show your fallback text instead |
Fallback text | The text to show when there's no product (for example your store name or a tagline) |
Alignment | Aligns the content left, center, or right |
Text styling
Setting | What it controls |
|---|---|
Product name size | Font size of the name |
Product name color | Color of the name |
Product price size | Font size of the price |
Product price color | Color of the regular price |
Special price color | Color used when the product is on sale |
Layout and visibility
- Padding and margin — spacing around the block.
- Width settings for desktop, tablet, and mobile.
- Custom class and block conditions for advanced styling and show/hide rules.
How it behaves
- It only shows product details on product pages. The detection is automatic — you don't pick which products.
- Clicking the block smoothly scrolls the page back up to the product. If you use a floating header, the scroll accounts for the header's height so the product isn't hidden behind it.
- The special price color only applies when a product is actually discounted, so sale prices can stand out.
Tips
- This block shines in a floating header on long product pages — the customer always sees what they're looking at and what it costs.
- Set fallback text only if you want the block visible everywhere. Leave it off and the block quietly disappears on non-product pages.
- Keep the name size modest. The header is tight on space, and long product names are truncated to fit.