How to customize your homepage
Your homepage is built from sections in the Store Editor. Its titles and SEO live on the homepage entry in Store > Pages.
Sections: the Store Editor
Go to Design > Editor. Your homepage opens first. Its sections are listed on the left and your store shows on the right. Click a section in the preview to open its settings.
You can add, remove, reorder, duplicate and hide sections. On the homepage they include the hero, content sections, highlight boxes, the offer box, testimonials, and featured products, categories and articles. Nothing reaches your visitors until you press Publish.
🔗 Store Editor feature guide
Hero section
The hero shows on your homepage under your logo and menu. Its heading and the line under it are your homepage Title and Subtitle, set on the Titles tab (see below). Click the hero in the Editor preview for everything else.
Layout
- Columns: text and image side by side.
- Overlayed: text on top of the image.
- Products: product images instead of your own image.
Text Position and Text Colour
Text Position places the text at the top, middle or bottom, on the left, centre or right. Text Colour is Light, Dark or Accent.
Button
Button Text and Button Link set the hero button. The Choose button on the link searches your own store, so you do not type the address by hand.
Hero Image
Upload your picture in the Hero Image field. Build it at 2400px by 1200px. It is shown cropped to fill the space, and the Image Fit and Image Focal Point settings below change how. FreshStore makes the phone and desktop sizes from your upload.
Text baked into a wide banner gets cropped on phones. Add a square version of the picture in Mobile Hero Image (below). Better still, leave the words out of the picture and use the hero Title, Subtitle and Button, which resize to fit every screen.
Mobile Hero Image
Optional. Upload a second picture in the Mobile Hero Image field, and phones show it in place of your Hero Image. Build it at 1080px by 1080px. Use it when your main picture is very wide or has words in it. Leave it empty and phones show your Hero Image.
Height
Set the overall height of your hero section. The sizes below are the desktop height, and phones show a shorter hero:
- Default: Fits the content automatically
- Small: 400px
- Medium: 500px
- Large: 600px
- Extra Large: 700px
- Huge: 800px
Image Fit
Choose how your hero image fits inside the hero section:
- Cover: Crops the image to fill the whole section. Best when you want the hero to be edge-to-edge with no empty space.
- Contain: Shows the whole image without cropping. Any empty space around the image is filled with a background colour (see below).
Background Colour
When Image Fit is set to Contain, this option sets the background colour that fills the space around your image. Useful for matching your store's branding or creating a clean letterbox effect.
Image Focal Point
When Image Fit is set to Cover, choose which part of the image stays in view after cropping: the centre, one of the four sides, or one of the four corners. This is useful when a face, product or object needs to stay in view on mobile as well as desktop.
Other homepage sections
- Content: a title and text for longer store copy.
- Highlight boxes: three boxes with a title, subtitle and link each. See Homepage Highlight Boxes.
- Offer box: a title, text, button and background image.
- Testimonials: a title and your testimonials, each with its text and author.
- Featured products, categories and articles: pick what each one shows. See How to change the featured products, articles and categories on your homepage.
Titles and SEO
From your store's Dashboard, go to Store > Pages. Look for the Homepage on the list and click Edit:
The page shows a notice, This page is built in the Store Editor, with an Open the Editor button. The tabs under it hold the homepage titles and SEO.
Titles
The Titles tab holds your Title, Subtitle and Link Title. The Title and Subtitle are the heading and subheading in your hero. AI can generate each one with a click.
SEO & Meta
The SEO tab has the Slug, Meta Title, Meta Description, and Meta Keywords for your store homepage:
Settings (Page)
The Settings box on the right of the page has options for showing the page in your sitemaps.
Info
The last tab shows when the page was created and when it was last modified.
Show your categories page or an article instead
Your homepage does not have to be the page you build in the Store Editor. It can show your categories page, or one of your articles, such as a pillar post.
- Go to Store > Pages.
- Click Homepage at the top of the page.
- Choose what to show:
- Your homepage: the homepage you build in the Store Editor. This is the default.
- Categories page: your categories page, with the SEO title and description from your homepage.
- An article: pick the article from the list. Only enabled articles are listed.
- Click Save.
The change shows on your store straight away.
Good to know
- The homepage you built in the Store Editor is kept. Switch back to Your homepage at any time and it shows again.
- Your categories page still opens at its own address, so menu links keep working. Search engines are told your homepage is the main address for it.
- An article shown on your homepage has one address, your homepage. Its old article link redirects there, and it is left out of your sitemap.
- If that article is later disabled or deleted, your store shows your built homepage again, so your homepage never goes blank.