START CREATING
Set up this amazing eCommerce Website, and start making sales! This is the full tutorial, step-by-step.
Questions or Feedback?
Please ask in the YouTube comments.
Discounted Web Hosting
We use Hostgator.
Code: DISCOUNTED (**60% Off & Free Domain**)
Get Online:
We use Hostgator. To get a huge discount:
https://www.hostgator.com/discounted
Use a coupon code at checkout:
Code: DISCOUNTED (**60% off and free domain**)
Code: 1DIRTYCENT (1 cent first month)
Useful Links:
- Finished demo – www.thestoredemo.com
- WooCommerce info – here
- Storefront design info – here
Subscribe for updates:
FAQs
Firstly, check our generic FAQ section here. If that doesn’t help, here are questions specific to only this tutorial:
Is there a newer tutorial available?
The video above is the most up to date tutorial for 2019! If you are watching a different video, it is probably an old one.
How do I subscribe for updates?
Subscribe to our YouTube channel for updates and more useful content:
After adding the Homepage Slider Code my website stopped working
You will need to remove the code manually:
- Login to your hosting cPanel
- Go to File Manager
- Go to Public_html > wp-content > themes > Storefront
- Edit the file called functions.php
- Remove the code you just input, and save Don’t touch anything else!
If it still doesn’t work contact us for help.
How do I make Image Slider full screen on Homepage only?
Go to Appearance > Customize > Additional CSS. Then copy & paste the following code:
/* remove slider internal page */
.ewd-slider-section .slider , .ewd-slider-control{
display:none !important;
}
.home .ewd-slider-section .slider , .home ewd-slider-control{
display:block !important;
}
How do I remove the Search Box?
Go to Appearance > Customize > Additional CSS. Then copy & paste the following code:
/* remove search box */
.site-header .widget_product_search , .site-search{
display: none;
}
How do I Center the Logo, and the Menu?
Go to Appearance > Customize > Additional CSS. Then copy & paste the following code:
/* center logo*/
.site-branding{
width:100% !important;
text-align:center;
}
.site-header .site-branding img {
margin: 0 auto;
}
/* center menu */
nav#site-navigation {
width: 100%;
text-align: center;
margin-right: 0px;
margin-bottom:25px;
}
@media (min-width: 768px){
.woocommerce-active .site-header .site-header-cart {
width: 21.7391304348%;
margin: 0 auto;
float:none;
}
}
Affiliate Disclosure: some links on our site are affiliate links which means we may get paid a commission for purchases through them. While this does not cost you anything, it helps us pay the bills and continue to produce these awesome tutorials for you free of charge! Thanks for supporting.