Even though you have selected a theme best for your Shopify store, you might still not be satisfied with how your home page looks. Shopify allows you to customize the layout of your home page.
To access the page editor, click Online store on the left sidebar of the admin panel. The Themes page will load. The first thing shown on the page is the Current theme. To edit the home page, click Customize.
The page editor will load, with the Home page loaded as default.
On the left side of the site editor is the list of sections present on the page, which includes the header, images, text, footers, and other sections. The header and the footer are included on the home page by default.
The sections of the body, however, can be added or removed as you please but should contain at least one section.
To add a section, click Add section at the end of the list of sections of the body of the home page. A list of available sections can be added, which includes the following:
- Blog posts
- Featured collection
- Image with text
- Featured product
- Rich text
We would like to add a Featured collection to our home page. To do so, click Add section, then select Featured collection, then click Select.
The sidebar will load a list of options for the featured collection, such as the heading, the collection to be featured, and the number of rows and the products per row of the grid.
To remove an existing section, click that section, then click the three dots on the upper-right portion of the left sidebar, then click Remove section.
For our home page, we want to feature the Wonder Foods lineup. We click Select collection, and a list of collections to choose from will be listed. (To learn how to create a collection in Shopify, click here.)
The right panel, which shows a preview of the page, promptly shows a preview for each change added to the page. We select Wonder Foods, then click Select. To go back to the list of sections, click the left-pointing arrow beside the Featured collection label.
To edit an existing section, click the existing section, and the options will be loaded.
For example, we want to edit the Image with overlay section that we have by adding an image and then change the overlay text from default. To add an image, click Select image. You can either upload your own image or use one from their free library. For our example, we want to add a free image of a sunflower. We select Free images then type the keyword of the image that we want. We select an image from the set of images loaded, then click Select.
We can change the text overlay by scrolling down the left sidebar to access the Heading and Text text-boxes. Type the content on those boxes, and Shopify will update the preview on the right side.
Once you are satisfied with the changes on your home page, click Save on the upper-right corner of the editor.
Our home page now looks wonderful:
The Featured Collection section is just below our banner photo: