Updated – 7th January, 2020
The WooCommerce Storefront theme comes with a home page template that automatically brings your products and categories into a page.
You’ll typically start with the following headings
- Shop by Category
- New in
- We recommend
- Fan favourites
- On sale
- Best sellers
It’s great because it’s automated, however the downside is that you are then stuck with the order and layout of the page.
But don’t worry there is a really easy way for you to customize your WooCommerce Storefront home page.
To customize your Storefront Theme home page just follow the following steps
- When viewing the home page click edit page
- Change the template from ‘home page’ to default or full width. This is found over on the right.
- Now add your blocks (shown in my tutorial below)
Below you can see a much more exciting WooCommerce Storefront Home page
Click here to see a live demo of the WooCommerce Storefront home page I built
This was built using the three plugins listed below and the new WordPress block editor :)
- Storefront Pro – a plugin that lets you customize the WooCommerce Storefront theme
- Storefront Blocks – beautiful WooCommerce blocks (products slider, masonry grids, carousels)
- WooCommerce Blocks – show WooCommerce products within your pages
Storefront Pro and Storefront Blocks are optional but using them will help you take your designs to the next level.
Video tutorial
The finished result
This is what it looks like in the block editor
If you have any questions, please feel free to leave a comment below,
When I try and add products, it tells me there is an addon for Woocommerce, then gives me the error:
Sorry, you are not allowed to access this page.
Hi Robert,
That’s now part of Pootle Pagebuilder Pro,
Kind regards,
Jamie
Dear Jamie, I just bought the Pootle Pagebuilder (Premium), I have installed it successfully.
But this option still is not working? I still get the error. What to do?
Am I doing something wrong?
I got this plugin just for to display products on the main page.
Hope to hear from you as soon as possible!
Greetings, Tiffany
Hi Tiffany,
Could you raise a support ticket with login details to your site and we’ll take a look for you :)
Here’s the link pootlepress.com/support-form
many thanks
jamie
ok !
Hello, how i can remove the footer colunns ? i only need one
how to make this page appear on the homepage.
Hi, just go to settings / reading
and set it as your front page ;)
So we cannot add products without Pro version?
That’s absurd that we have to find that out after hours of installing and building… major turnoff to this product and company.
Hi Tom,
Yes you can by just adding WooCommerce shortcodes into rows https://marketpress.com/2015/woocommerce-shortcodes-list/
The pro version gives more control however
Hope that makes sense,
jamie
Hardly absurd, they guy has to make a living!
Thanks Alex :)
And I have three growing daughters to feed,
Jamie
Hi Jamie, I have the pro version for my own website but I can’t seem to use it on my staging site to trial a new shop. Do I need a licence for the staging site even though it won’t be published? I can’t seem to activate the free version on my staging site because it thinks I have a pro account so its all getting a bit circular!
Any help would be gratefully received. Laura
Hi Laura,
You should be able to use 1 licence on 1 production site and 1 development site, but it sounds like you may have a glitch.
Even though it hasn’t activated it should still work however,
If not, could you raise a support ticket with login details https://pootlepress.com/support-form
Many thanks,
Jamie
Thanks for the speedy response.
Hi Jamie, sorry to barge in here but I am having a similar issue. Production site OK, staging site says I need to activate??
Hi Jamie, I am not sure if I have the correct place for my question. I have storefront for my collegiate business. I love it, but am not sure how to manage the front page. For example, I just want to list schools names ( not too large) and a small picture for each school and a link to the page of their respective products. Also, I did not want the “new in” and “best sellers.” Can you please help me. Thank you so much, Bebe in Marietta, Ga.
Heyo!
Installing this plug-in and then using the edit function doesn’t show the same layout of adding rows like yours does. Did i miss a step after installing and activating the plugin?
Hi Jamie
Did you create a new pagebuilder page to start with?
jamie
No i missed that part. I’m just trying to edit the static homepage. The product sections in there do not apply so trying to re-create the sections with relevant headers and sort the products accordingly.
No i missed that part– i didnt see that in the video?
First of all: nice plugin! I really like using it.
Is there a way to make the blocks from the “Triple Trouble” Pootle Cloud template to become links? I can make the text inside each block to behave as a link, but I would like to make the whole block to be a link, is this possible?
Thanks in advance!
Regards
how to download Pootle Pagebuilder free version?
Hi there, Is there any way to hide product price and add to cart from homepage? All the documents just mention how to hide them in shop page, product page etc but not in homepage.
Hi
Yes you can do this with storefront blocks and storefront pro :)
Hi Jamie, is there any possibility of adding a product slider on the storefront homepage?
Yes :)
If you use our storefront pro plugin, it’s part of that.
Or you could use our storefront blocks plugin – that has a product slider block :)
jamie
Hello,
It is possible to add the headings (Shop by Category, New in, We recommend, etc) without on Default template?
hello
great video
how can we enable infinite scrolling on that page?
Hi,
You’d probably need some custom development or find a plugin (like our storefront pro plugin) that has it built in.
jamie
thank you!! !