If you’re using our Storefront theme for WooCommerce, you’ll be excited to learn that version 2.0 has just become available for download. If you’re not using Storefront already, now would be a great time to take a look at our flagship WooCommerce theme!
Storefront 2.0 is a major release and brings various new features including a greatly improved handheld experience, a refreshed design, a new product section on the homepage, full compatibility with the upcoming WooCommerce 2.6 and more!
Here’s a closer look at what we’ve added to this update.
Storefront looks better on smartphones
Since releasing version 1.5 last year, we’ve made significant improvements to the responsive design in Storefront 2.0. The first thing we did we completely redesign the entire header section to use space more efficiently.
In Storefront 1.x, the header section took up roughly half the screen’s height, pushing the main content way too far down the page.
We’ve now reduced the header height by ~60%, which brings the main content further up the page and makes it the focus. To do this, we’ve moved the search, cart link and account link into a convenient navigation bar at the bottom of the screen which sticks as you scroll.
This not only saves space, but also ensures that folks are always able to see how many items they have in their cart and can quickly access the checkout from anywhere.
In addition to this, we’ve added an animation to the navigation toggle. This replaces the instantaneous effect seen in Storefront 1.x and makes it clear exactly what is happening when the menu button is clicked. As a secondary effect, the icon on the menu button transitions into an
X to illustrate that the menu can be closed by clicking the button again:
Finally, we’ve improved the mobile cart display to create a richer experience on one of the most important pages on your store.
A typography refresh adds to clearer, cleaner design
The typographical scheme in Storefront has seen a complete refresh for version 2.0. Helvetica has been replaced by Source Sans, a Google font which offers a wider variety of weights and allows us to provide greater depth and cohesion.
The additional font weights allow us to create more intuitive content regions. We’ve also made use of these new font weights in sections like the blog post meta area.
As well as the typographical tweaks, we’ve made subtle alterations to the design to provide a much cleaner aesthetic overall:
- Borders have been largely removed so that pages don’t feel quite so broken up.
- The breadcrumb and the main navigation are now wrapped in their own content regions, cementing them as unique components.
- Product reviews and comments have seen tweaks to make them cleaner and more scannable.
- Blog post meta has been redesigned to include the author Gravatar.
Feature best selling products & more on your homepage
In addition to product categories, recent products, featured products, top rated products and on sale products on the homepage, we’ve introduced a “best sellers” section so that visitors now have immediate access to your best selling products.
These homepage sections now also have friendlier titles. “Recent Products” has become “New In” while “Featured Products” has become “We Recommend.”
Various improvements to design add to the user experience
We’ve made many other smaller tweaks throughout Storefront that improve the overall appearance and experience for your visitors:
- Styles have been prepared for WooCommerce 2.6’s tabbed “My Account” section and the average rating widget, so these sections will be properly styled when the next version of WooCommerce is released 🙂
- Tables have a “softer” design treatment (the colors of which are based on the main background color).
- oEmbeds have been styled to match the rest of Storefront (including typography, padding, colors and so on).
- We’ve integrated with WordPress 4.5’s custom logo feature so that you can now add your logo to Storefront without using a plugin.
We believe all of these changes help make Storefront a better theme for your online store.
Give 2.0 a try and let us know what you’d like to see next
Ready to try 2.0? Update via your WordPress Dashboard, or (if you’re new around here) download the theme to give Storefront a try.
A few things to keep in mind as you prepare for the upgrade:
- Having trouble with the theme? Think you’ve found a bug or extension conflict? Visit our support page to open a ticket.
- Thought of a particular feature or product you’d like to see developed for Storefront? Submit it on our Storefront ideas board.
Each of the Storefront extensions and child themes have had minor releases over the last few weeks that provide compatibility with Storefront 2.0. If you’re using one of these products but haven’t updated yet, we recommend doing so before updating Storefront itself.
Please note that we are not able to diagnose or solve potential issues via blog comments. The fastest way to get in touch with us is via one of the methods listed above. But we are always happy to read your feedback in the comments.
Have any questions or comments for us? We’d love to hear from you. Thanks for following the development of Storefront!