Skip to main content

Sections: Heros

How to build content using hero sections.

Updated over 10 months ago

Hero sections are pre-designed elements for adding content to your online store pages. A hero section can present the main message of the store and capture visitors’ interest visually. They are excellent for the main image on the store’s homepage and for promoting campaigns and new products.

Hero sections always cover the full width of the section and may include an image/images, text, button, timer, or carousel. Generally, it’s best to use heroes sparingly on a page to maintain their marketing impact.

You can find these sections in Online Store > Edit Theme.

Large Image Heroes

Hero, Hero Carousel, and Hero with Two Images sections work best at the top of the page or to divide page content.

Adding Images

First, click the Add Image button.

In the file browser, click Upload Image File and select an image from your computer. Upload the largest, highest-quality version available.

Alternatively, choose from thousands of professional, free images under Browse Free Images.

Select your uploaded image and click the Select button.

If the image appears blurry in the store, it may be due to low quality or small size. In that case, upload a higher-quality image.

Hero with Timer

Hero Timer sections are ideal for promoting current or upcoming campaigns.

Create a campaign through marketing and provide information about it or notify customers about, for example, the arrival of a new collection. The timer encourages customers to make purchases.

You can set a date for the timer to count down to, displaying the time remaining.

Adding a Link

Add a link from the ad’s Button section. Click Add Link to see a list of possible link targets.

If there are many options, type a keyword in the search field to find your target more easily.

If you don’t want a button over the image but still want a link, simply leave the button text blank (remove the Shop Now text).

If needed, remove the link by clicking the X icon.

Publishing or Discarding Changes

The Save button will appear highlighted when there are unsaved changes. You can publish the changes to your store by clicking the Save button.

Before saving, you can also discard changes. Go back one change at a time using the left-facing arrow or discard all changes to the previous save point using the Draft button.

Related Instructions


Please note that different themes may have different features, and these instructions may not apply to all themes.

Did this answer your question?