Skip to content

Title

Display the product title with flexible styling and optional share or print buttons.

Use this block to display the product title and, if needed, add quick utility actions beside it. It helps set the visual priority of the product header while keeping the area easy to scan. For broader context on how theme blocks work, see Shopify documentation on sections and blocks

The source-provided reference for this block is available in Company XYZ documentation on the Title block.

The main settings control how prominent the title appears and whether print or share actions are shown with it. In most layouts, the title should stand out clearly without overpowering pricing, purchase options, or other key product details.

Text size changes how much attention the product name draws. Smaller sizes work well in dense product layouts, while larger sizes suit simpler layouts where the title should lead the page.

Text color should support readability first. A blank, transparent, or default-style value usually preserves the surrounding styling, while an explicit color gives this block a more independent look. Choose a color that stays clear against the surrounding background and does not compete with nearby labels or calls to action.

Print and share are optional utility actions. Enable them when they match how customers use the page, but keep them off if they add clutter without a clear benefit.

Visibility controls when this block appears on different device sizes. This is useful when you are creating alternate product layouts for mobile and desktop.

Hide the block on a device only if the product title is still shown clearly somewhere else in that layout. The source-provided visibility guide is in Company XYZ documentation on visibility settings.

Do not hide this block on mobile or desktop unless another visible title replaces it for that screen size.

  1. Set clear hierarchy. Choose a title size that gives the product name strong visibility without pushing other important details too far down.
  2. Prioritize contrast. Use a text color that stays easy to read in the block’s surrounding layout.
  3. Limit utility actions. Turn on print or share only when those actions are useful to your customers.
  4. Check responsive layouts. Review both mobile and desktop if you use visibility controls, since the title can present differently across breakpoints.
  5. Keep the header focused. Avoid combining too many nearby actions, links, or badges with this block.