ShopWired’s new Version 5 themes are a game changer when it comes to building your online store.
An intuitive drag-and-drop function sits at the core of Version 5 themes, allowing greater control over your website’s layout. Simply select a section, drag it around, and drop it where you want to get your store looking and functioning exactly the way you want it.
Version 5 themes also introduce an array of additional features and settings to help you further customise your website. Say goodbye to frustrating support chats with web developers and hello to user-friendly design with intuitive features straight ‘out-of-the-box.’
Our Version 5 themes are available to both new and existing ShopWired merchants and are free to use as part of any plan.
In this guide, we’ll look at the features of our new Version 5 themes and how you can use them to build the online store of your dreams.
Table of Contents
Over the years, ShopWired’s well-loved themes have laid the foundations for thousands of successful online stores.
With each new version release, we listen to feedback from merchants to ensure ShopWired provides the best experience for building and growing an online business. We also look at ways to improve your store from your customers’ perspective too.
ShopWired’s Version 5 themes are the next generation, bringing fundamental changes, innovative improvements and exciting new features. Version 5 themes have been created to give merchants maximum customisation with minimal effort or disruption to workflow.
Our intuitive new themes have changed the way you build a ShopWired store, making it easier and faster. The combination of the new drag-and-drop editor, as well as a host of new features and functionalities gives you greater control from the start.
All of ShopWired's themes are also responsive, meaning your online store will look great and function smoothly on any device, whether your customers are shopping on a desktop computer, laptop, tablet or mobile phone!
There are plenty of Version 5 theme templates to try out, including some of our most popular themes like Vivify, Axiom, Ocean Avenue and Themia. In time, more of ShopWired’s classic themes will be released as Version 5.
*When viewing available themes within your ShopWired account, you can see if the theme is Version 5 with the indicator shown next to the theme name (see below):
Each theme has its own style and character, so you might want to experiment with them before deciding which one will become the foundation of your website. You can install up to eight themes at one time, so you can customise different themes to see which will work best with your products, colours and branding.
We do offer bespoke website setup packages too if you’d like support setting up your new website. We offer tailored advice and can give more information about our Version 5 themes to help you decide which is best for you. We can also help you customise your chosen theme to get it looking and functioning exactly how you want. Visit our setup packages page for more.
But what exactly makes Version 5 themes better?
Let’s take a look.
ShopWired’s Version 5 Themes: Features
Drag-and-drop layout tool
With Version 5, each page on the theme consists of a number of interchangeable sections. Some of these sections are made up of content blocks.
In total, there are 20 possible sections for your website. Here’s a quick look at some of them:
Hero Image Slider
One of the coolest new features of V5 is the addition of the new Hero Image Slider. The feature displays a full-sized banner of images and/or videos. Content added to hero slider sections fills the width of the website. You can see a Hero Image Slider section in the screenshot above.
The Hero Image Slider isn’t just for images, you can also upload video content too by simply entering the embedding code into the field. Once you’ve decided what you want to showcase, you can set the Hero Image Slider to ‘autoplay’ and it will automatically cycle between your slides. You can also toggle the progress indicator if you want to display progress circles at the bottom of the section to show how many slides there are and which one is currently displaying.
You can now easily add a new embedded section on most pages of your website. This lets you add custom sections to enhance the appearance and functionality of your website. Version 5 themes let you embed the following onto your website’s pages:
The ‘embedded products’ section lets you display specific products on the page.
Simply choose which products you want to show or select your ‘Featured Products’ and they will display on the webpage. You get to choose how many products you want to display on the page, as well how many per row. You can also add text, such as a title and description to introduce each product.
The 'embedded categories' section allows you to display specific product categories on your website's pages. You can choose which categories you want to show and customise how many categories are displayed per row. The embedded categories feature is useful if you want to highlight a particular category or set of categories on your website.
The embedded brands section lets you show a selection of brands that you sell. This feature can be particularly useful if you want to highlight specific brands or partners that your website works with.
Finally, the 'Embedded videos' section allows you to add videos to your website's pages. You can embed videos from platforms such as YouTube or Vimeo. This can be a great way to showcase video content, such as product demos or promotional videos, on your website.
To add the video, simply enter the full embedding code for the video. You will then be able to see the video in the live preview editor.
By being able to easily add embedded sections to your website’s pages in Version 5 themes, you can truly take your website’s look and feel to the next level with no need for coding or added stress!
V5 themes let you add new text sections to your website’s pages without the need for additional coding.
The ability to add a new text section in your preferred place is great for organising your content and providing a clear structure to your webpage. Text sections with valuable and relevant content are also useful for SEO, potentially boosting your chances of being ranked on search engines for queries related to your niche.
With some keyword research and a few SEO fundamentals, your new V5 text sections could help build the perfect website that attracts more organic traffic with engaging and visually appealing content.
Testimonial sections in Version 5 themes let you easily add and configure customer testimonials to display on the page.
You can add a new block for each testimonial and choose how many you want to display. With features like autoplay and scrolling arrows, the testimonial section is an effective way to showcase customer reviews and enhance your brand’s credibility.
The developer section can be used to add custom sections from ShopWired developers. If there is a section that you would like adding to your theme, please contact us.
(You can find a full and more detailed list about each V5 section and what it does here).
Sections are easily interchangeable using the drag-and-drop function in the sidebar menu. You can use this feature to easily rearrange the content on your website’s pages. How you structure the layout is completely up to you.
In the screenshot below, you can see the sections for the homepage.
To rearrange the sections, simply drag and drop them into a new position. That section will now display on the corresponding part of the page.
In the example below, the Hero Image Slider section has been moved to the top of the page.
You can now see that the ‘Toy cars’ section (Hero Image Slider) has moved above the welcome Text Section.
This simple tool gives you greater control over the creative aspects of your website.
Want your brand’s welcome message at the top of your homepage? No problem.
Rather have your products taking centre stage in all their glory? Easy.
Version 5 themes make it easy to rearrange the layout of your pages. Within no time, you’ll have your website looking exactly how you want it. That’s without the need for coding or complicated web design.
Many sections are comprised of blocks (like a Hero Image Slider or Testimonial Section). In the example screenshot below, there are 2 content blocks added to the section.
Just like you can change the order of sections, you can also adjust the position of blocks within a section by rearranging them. This allows for even greater flexibility in customising the layout of a webpage.
Adding a new section
You can also add new sections to your website’s pages by clicking the ‘Add a new section’ button.
To add a new section to a theme, click the 'add a new section' button, as shown in the screenshot below.
A list of available options for new sections will then be shown for you to select from. Select a new section to add it to your theme. You'll then be able to configure the settings for the section and add content to it.
Want to get rid of a section? No problem.
Simply select the section and click ‘Remove.’ You can also hide sections by clicking the eye icon. Hidden sections will be greyed out and won’t appear on your website. However, you can easily re-enable these sections by clicking the eye icon again. This feature is handy if you want to experiment with your website’s layout in real-time using the preview function.
V5- Greater control
In older Version themes, rearranging, adding and removing sections of the page can be more complicated, with layout changes often requiring additional coding.
But Version 5 themes remove these problems to provide enhanced customisation and greater control over how your website looks and functions. No coding. No need for extensive web design skills. Just simple drag-and-drop.
Harness the full potential of your online store with V5’s new Settings
In the Settings for our new Version 5 themes, you’ll notice 4 settings tabs. These are Theme Settings, Header, Page Settings and Footer.
Each settings tab has a bunch of options for you to configure. Let’s take a look at some of the cool new settings and features in Version 5.
Being at the top of the page, the header is one of the most important parts of any web page.
V5 themes give you some great options for the Header Section. For example, you can now change the alignment of your logo to either be centre or left, depending on your preference. You can also easily change the sizing of your logo and use the device preview buttons to see how your logo looks on different devices (see screenshot below)
Our V5 themes also give you some other handy options for your website’s header. Want to display a button to take users to their wishlist? Want to show an account menu to let users easily sign in? No problem, simply toggle them off or on in the Menu Options section of the Header tab. Here's a full list of the new header settings available on Version 5:
Wishlist Button: Choose whether to display a wishlist button in the website's header.
Account Menu: Decide whether to include a button in the website's header that directs customers to their account page.
Off-Canvas Basket: Enable this option to display the contents of a customer's basket in a popup overlay instead of taking them directly to the basket page when they select the basket icon.
Brands Link: If you have the brands app installed, choose whether to include a link to the brands page in the category menu.
Blog Link: If you have the blog app installed, decide whether to include a link to the blog page in the category menu.
Sticky Category Menu: Enable this option if you want the category menu to remain visible at the top of the page as users scroll down.
Category Menu Alignment: Select whether to align the category menu to the left, center, or right of the page.
Category Menu Font Size: Use the slider to adjust the size of the text in the category menu.
Space Between Menu Items: Use the slider to adjust the amount of space between each item in the category menu.
You can the Menu Options in Header Settings in the screenshot below:
The Header settings tab also lets you add navigational Breadcrumbs to your website.
Breadcrumb navigation shows users the navigational structure of how to get to the page they are currently viewing. For example, a user on a product page would see breadcrumbs leading back to the homepage from the current page.
So, if a user was looking at a ‘Plain White T-Shirt’ in the ‘Men’s Clothing’ category the breadcrumb navigation would show as: Home > Men’s Clothing > T-Shirts > Plain White T-Shirt.
If you want breadcrumb navigation on, simply tick the box in the ‘Breadcrumbs’ section of the Header settings tab. If you don’t want breadcrumbs, untick the box.
The Footer tab lets you add important information to the bottom of your website’s pages such as payment card logos and payment gateway information.
Including payment information in the footer of your website can help establish credibility and trust with customers. It also tells them right away whether or not you accept their preferred payment method.
The Footer tab also lets you add some Additional Settings too, including your phone number, email address, company address and a newsletter sign up function.
One of the most exciting things about Version 5 Themes is the new Page Settings feature.
The Page Settings tab lets you configure additional settings for certain pages on your website. Many of these settings require additional coding on previous themes, but V5 does away with that to give you control.
Simply go to the page you want to edit in the live preview editor and you’ll get a list of options for that page. From simple text snippet settings to advanced product, category, blog, and brand card settings, you have complete flexibility to configure your pages in a way that best suits your needs and takes your store to the next level.
Here’s a selection of some of the useful things you can do with the Page Settings tab.
The new ‘Cards’ settings let you configure aspects of the display of your products, categories, brands and blog posts on your website.
So, what exactly can you do with the new cards settings? Let's take a closer look:
- Add an 'add to wishlist' button on your product cards: One of the most popular features of the cards settings is the ability to add an 'add to wishlist' button on your product cards. This allows customers to easily save products they're interested in for future reference, making it more likely that they'll come back to your store and make a purchase.
- Add image effects for when a user hovers over an image: Another cool feature of the cards settings is the ability to add image effects when a user hovers over an image. This can be a great way to make your products or categories stand out and give your website a more professional look.
- Enable the 'quick view' option for your cards: If you want to make it easier for customers to view product or category information without having to leave the page they're currently on, you can enable the 'quick view' option for your product cards. This will allow users to view a popup with all the necessary information about the product, without having to navigate away from the page. This can also be useful on blog cards to give a brief excerpt from the blog.
It's important to note that the cards settings do not affect your product pages directly, unless you've added other sections to those pages. Product cards simply affect how your products are displayed wherever they appear as cards on your website’s other pages, such as your category pages or search results pages. By customising your product cards, you can make it easier for customers to find products in your store without having to find the exact product page.
There are four types of cards that can be made using a Version 5 theme, they are:
- Product Cards- display your products and add features like quick view.
- Category Cards- showcase your categories and choose how many.
- Brand Cards- take visitors to your branded products by using brand cards.
- Blog Cards- create blog cards to showcase your blog posts.
Any changes you make to your card settings will be implemented in every place the cards display on your website.
For a full list of the settings you can change for each card type, please check out our Version 5 Help Guide here.
The Page Settings tab also lets you configure the following settings for your product pages. For example, you can:
- Add tabbed descriptions to products (app installation required).
- See additional product images as thumbnails underneath your main product image.
- Add a ‘roll over zoom’ function that gives a magnified view of product images when the mouse is hovered over it.
- Add an image lightbox to let users see a magnified view of the product images when they move their mouse over them.
- Add a quantity box to let customers add more than one product to their basket.
- Add a stock indicator to show remaining stock levels.
- Add a social sharing button to let users share your products to their social pages.
You can organise your category pages to your liking with the ‘products per page’ setting. This setting lets you choose how many products display on your category pages and search result pages.
When the number of products on one page exceeds the number entered in the box, excess products will transfer onto a new page and users will have to select the next page to continue browsing. Entering a lower number here can result in faster load times for your category and search results pages.
Version 5 also gives you some additional features for blog posts. Here are some useful things you can do:
- Show blog archives to let users view and select blog posts by the month/year they were created.
- Show blog categories on your blog’s main page if you’ve set them up.
- Show the date of each blog post.
- Enable a social sharing button to let viewers share your blog posts to their social media pages.
- Enable blog comments using the Disqus app integration.
You can now toggle on or off a range of settings for the basket page.
- Disable checkout if you need to prevent customers from using the checkout.
- Use the button settings to configure text snippets for your basket page.
- Add delivery rates as radio buttons instead of in a drop-down menu.
- Add a Voucher Code box to let users receive discounts on your products.
The Theme Settings tab lets you make more general changes that affect your whole theme across the website.
These settings include:
You can now change the fonts used in your theme with the ability to have a different font for the headings and for body text. Simply choose a font from the list and preview how it looks on the website in the preview editor.
Theme Colour Scheme
The 'Colours' settings lets you change your theme's colour scheme. Colour settings can be changed at the global level across the whole website or at an individual level affecting only the pages and page elements that you wish to change.
The 'Theme Width' setting lets you change the maximum width at which the theme will display. If you want to change the maximum width, simply drag the slider.
To return the theme width back to default settings, simply select the option.
Configure a welcome popup to greet new visitors when they enter the website. Welcome popups can be great for gaining new sign-ups to newsletters or offering incentives like discounts and competitions.
You can change the icons that display on your website.
Got a Font Awesome account? You can replace your website's icons with Font Awesome's library in the 'Icons' settings section.
To use Font Awesome’s icons, you will first need to create a free account with them. You'll also need to add some simple code to your website, you can see how it's done here.
Lazy Load Images
Lazy load images can boost page speeds by only loading images when they are in view. This setting can now easily be turned on to reduce any potential performance slowdown from too many images loading at once.
The features and settings above display just some of the things you can do with a Version 5 theme. For a full comprehensive list of Version 5’s features and settings, please read our introduction to Version 5 themes and the corresponding pages that follow.
How do you install a Version 5 theme?
Installing a new theme for your website is easy.
To view ShopWired’s theme offerings, select Themes > Available Themes from the menu. Click on a theme to view more information and explore a number of demos. To install a selected theme, select install this theme:
Give the theme a moment to install.
Once your installation has completed, you’ll see a success page similar to this one.
From this page, you can choose to make the theme live on your website, choose to customise the theme or continue looking at available themes to keep browsing.
Upgrading to a version 5 theme from an older theme
All of our Version 5 themes are available to new and existing ShopWired merchants for no extra cost. If you want a new Version 5 theme, you just need to install one from the Available Themes section.
**When upgrading to a Version 5 theme from a previous theme, please be aware that any coding work (such as extension installations) that have been done on your existing theme will not be automatically carried across to any new theme that you install.
Additionally, images and link lists that you have already added to your theme will remain in place.
Get started with a Version 5 theme today
Join thousands of ShopWired merchants using Version 5 themes today and build the store you’ve always dreamed of.
Simply head to the Available Themes section of your account and install a V5 theme to get started. You can also take a look at one of our Version 5 themes in action in this walkthrough demo here.