liquify.

How to make your Shopify homepage hero stand out

The hero, the big banner at the top of your homepage, is the first thing visitors see. A clear headline and one obvious button do more than any amount of decoration.

Most of what you'll want to change is in the theme editor already.

1. Start with the section settings

  1. Go to Online Store > Themes > Customize. The hero is usually the first section on the homepage (Image banner in Dawn).
  2. Change the image, then adjust the banner height and the overlay opacity so text stays readable.
  3. Open the heading block and pick a larger heading size. Keep the line short: what you sell and why it's different.
  4. Open the buttons block, set a clear label like Shop new arrivals, and choose the solid button style.

Check it on mobile from the device toggle at the top of the editor. Text that fits on desktop often wraps awkwardly on a phone.

2. Go further with CSS

  1. In your Shopify admin, go to Online Store > Themes. On your theme, click the ... menu and choose Duplicate, so you have a backup. Then on the theme you're editing, open the ... menu and choose Edit code.
  2. Find the hero section's file (sections/image-banner.liquid in Dawn) and its stylesheet.
  3. Adjust things the settings don't expose: exact heading size, letter spacing, button size and padding, or text alignment on mobile.
Example: a bigger headline and a heavier button
.banner__heading { font-size: clamp(2.5rem, 6vw, 4.5rem); line-height: 1.05; }
.banner__buttons .button { padding: 1.1rem 2.4rem; font-weight: 600; }

Class names differ between themes; inspect the page in your browser to find yours.

3. Or ask Liquify in one sentence

Liquify is an AI theme editor for Shopify. Type the change in plain words and it edits your theme for you, on a draft copy, with a live preview. Nothing changes on your store until you publish.

“Make the homepage hero bolder, with a bigger headline and a stronger button”

Try it free on a sample store

Free plan, no credit card. Connect a real store whenever you're ready.

Questions

What size should a Shopify hero image be?

Wide images around 2000 pixels across work well for most themes. Use a separate, taller crop for mobile if your theme supports it.

Should the hero be a slideshow?

Usually one strong image and message beats a slideshow: most visitors never see the second slide.

More guides