A WordPress child theme is a theme that inherits the functionality of another theme, called the parent theme. Child themes allow you to modify, or add to the functionality of that parent theme. —WordPress Codex: Child Themes
Homestore is a child theme for Storefront, the official WooCommerce theme. It provides an elegant and modern design with a magazine feel, which provides the right style for stores in the homeware industry.
Homestore is a Storefront child theme, so you first need to install and set up Storefront and then Homestore afterwards.
- Download Storefront for free by at WordPress.org.
- Download Homestore from your WooCommerce.com account at My Downloads.
- On your website, go to Appearance > Themes and click the Add New button.
- Click Upload to upload the Storefront .zip file from step 1.
- Go to Appearance > Themes to Activate.
- Repeat steps 3-5 for the Homestore theme from step 2.
Once installation is complete and the subscription is activated for Homestore, it’s time to configure and set up your theme.
Homestore adds a new menu location titled ‘Homepage’. This allows you to create a custom menu to be displayed alongside the homepage content.
This menu is managed in the same way as any other WordPress menu. More at: WordPress Menu.
To account for high resolution (retina) displays, we recommend the following image dimensions for Homestore as a minimum:
- Catalog Images: 376 x 508 px
- Single Product Image: 600 x 600 px
- Product Thumbnails: 300 x 365 px
WooCommerce Product Image settings are found at Appearance > Customize > WooCommerce > Product Images. More at: Managing Product Images.
More information on WooCommerce image sizes can be found at:
It’s possible to import WooCommerce Dummy Data to populate your site with demo products as a starting point.
Note: We do not supply the exact images you see in our Homestore demo due to copyright restrictions. The WooCommerce Dummy Data instead comes with our own unique unrestricted images that we can redistribute within product import data.
To display the Homepage menu, you need to assign a custom menu to the ‘Homepage’ menu location. By default, the Homepage menu is not displayed, it only shows up if there is a custom menu assigned to that menu location.
The menu is managed in the same way as any other WordPress menu. You can read more about using WordPress Menus here.
Homestore applies some specific styles to elements like buttons and the header layout, so these settings are removed from the designer to avoid confusion.
They are the three first top level (parent) categories as arranged on the product categories screen in your dashboard. You can drag and drop categories there to rearrange.
Install the Homepage Control plugin.
Install the Storefront Product Sharing plugin.
Install the Storefront Footer Bar plugin. Then add a text widget to the newly created widget region via Appearance > Widgets.
To use the footer area as a Call to Action, you can use the following code in the Text Widget:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|<div style="text-align: center; margin: -1.2em 0;">|
|<span style="display: inline-block; margin: 0 1.5em;">Special promotions available!</span>|
|<a class="button" href="#button-link" style="margin: 1em 0;">Go Shopping →</a>|
If you don’t want to display content simply don’t add any. To hide the title you can use this plugin which gives you the ability to hide the page title on any page across your site. Alternatively use the Homepage Control plugin to toggle the display of this component.
You sure can. Take a look at the Storefront Blog Customizer extension to see what’s possible.
You sure can. Take a look at the Storefront Checkout Customizer extension to see what’s possible.
This is powered by the Storefront Product Hero extension and added to the homepage content via shortcode.
A lot of WordPress tutorials will recommend inserting code snippets into a child themes functions.php file. This is to ensure that you’re always able to update the parent theme without losing your changes. As Homestore is already a child theme, you aren’t able to do this. Any changes you add to Homestore’s functions.php file will be lost when you perform an update. Instead, it is recommended that you add any code snippets to a customization plugin. We’ve created a plugin you can use to do just this. Download Theme Customizations.
Have a question before you buy? Please fill out this pre-sales form.
Already purchased and need some assistance? Get in touch with a Happiness Engineer via the Help Desk.