02 Apr
Shopify theme customization has made life easier. As more consumers are moving to online shopping that competition is increasing rapidly.
Getting started on your first Shopify theme can be a daunting experience. Finding the time to get familiar with a new platform is never easy. But Shopify is an easy to use platform and it lets you customize the theme according to your desire.
Let’s review the basics of Shopify theme customization so you can put your brand front and center, make products and content more eye-catching, and create a visually-rich experience that keeps customers engaged.
Starting with your theme
When you first setup Shopify store, there is a default theme named as debut. This theme is designed to get you up and running with little to no customization needed. Moreover, It’s a simple and effective theme that is ready to use.
All you need to do is load your products, personalize the administration information for your store, customize your content, and you’re good to launch. While you can customize Shopify’s default theme to fit your needs, you should review the themes available to see if there’s a better fit for your store.
Checkout Shopify’s theme store
Shopify’s theme store has a variety of free themes and paid too vetted by the team to ensure proper function and compatibility. While personalization is fairly straightforward with Shopify, theme customization is made a lot easier when you start with a theme that more closely matches the original vision for your business.
You can access the theme store from your Shopify dashboard. Navigate to the Themes section and choose either Explore Free Themes or Visit Theme Store. Shopify filters and categorizes the displayed themes to make it easier to find the right one. You can search through available themes based on:
- The size of your inventory (large or small)
- Industry specific themes
- Minimalist theme designs
- Large photography emphasis
- Layout types (like grid or column layout stores)
Choosing a prebuilt premium theme can make Shopify theme customization especially fast. Shaving hours off the time it takes to customize your store lets you put that time into more important functions like planning launch campaigns or editing your eCommerce emails.
Look at 3rd party sites and developers
There are a number of themes developed by 3rd party specially for Shopify users. Sites like Theme Forest feature Shopify themes created by 3rd party developers. In marketplaces like these, themes are generally peer reviewed so you can sort based on popularity and rating. And just like the themes available in Shopify, any theme can be customized once you acquire it and load it into your store.
Lastly, if you really want a completely custom theme for your Shopify store you can always work with a developer. Shopify has a growing network of trusted partners who specialize in theme customization.
Selecting your theme in Shopify
When you add or purchase a theme from Shopify theme store, you’ll find that theme in your theme library within your Shopify dashboard. As soon as the theme is added it can be customized.
Whereas, if you purchase a theme from another developer or through another marketplace, you’ll need to upload the theme before you can customize or activate it. To upload your theme, navigate to the Themes window in your dashboard. Under the Theme Library click on “Upload Theme”.
You’ll be prompted to choose the .zip file associated with your theme. Once selected and uploaded, the theme will appear in your theme library.
Basic Shopify theme customization
Once you’ve selected your theme it’s time to customize it and make it your own. Under the Themes segment of your dashboard, Shopify will show you the current theme applied along with a preview of what your theme looks like.
You can use the blue “Customize” button when you’re ready to start customizing your Shopify theme. Theme customization in Shopify is divided into two approaches: overall theme settings and template customization.
Template customization
At the top of the Shopify theme customization window you’ll find a drop down for choosing a page template. This allows you to customize individual page templates that are used throughout your store. You can preview, it will change to show whatever template you currently have selected.
The sections tab displays the individual sections, or content modules, that are currently used by the selected page template. These vary from page to page, and some have more sections than others.
Before moving on it’s important to note that you’re choosing templates in the dropdown menu, not individual pages. Any customizations you make to the theme’s template will show in all pages that use that template.
Shopify theme customization – customizing sections
Customizing the page header
The header section provides a number of options you can customize to change the way the header appears across your site. This includes your logo and the way it displays as well as your top navigation. Updates you make to the header will display consistently, no matter what page your visitors are on.
For example, if you’re editing the Home Page template and you change the menu under Header, it would also change the menu shown in other page templates.
Customizing the footer
Like the header, any customizations you make to the footer will display sitewide. The options you’re able to customize will depend on how your theme is coded.
In the Debut theme, for example, you can customize which quick links are displayed, edit content about your store, and adjust the newsletter optin within the footer. You can also add content to expand what’s included in your footer.
Editing individual sections
You can customize each section in the currently selected page template by clicking on that section. When you click into a section the preview will scroll to display the section currently being edited. The options will vary depending on the section you choose.
For example, if editing the Image with Text Overlay you’ll have options to adjust image alignment, layout, text size, the actual text displayed, and more.
The Featured Collection section, however, features different options to adjust how the product collections in your store are displayed to visitors.
Adding a section
Want to add some more content to a page template? The “add section” button lets you expand what is shown in the template. After clicking, you’ll see a list of all the available content modules that can be added to the current template.
Clicking into any of the available sections will add that section into the preview to give you an idea of what it might look like. If you’re satisfied, just click the blue “Add” button to add that section to your current template.
Moving a section
Shopify will automatically order the sections as you add them, with new sections being tacked on to the bottom of the list. You can customize the order of sections by clicking the group of 6 dots on the right side of each section. The cursor will change to an open “grab” hand when you hover over it.
Click there and hold the mouse button as you drag the section until it’s in the order you want. As you reorder the sections you’ll see the view change in the preview window to show you what the new placement looks like.
Customizing the Shopify Theme Settings
Shopify theme customization allows you to further control the style of your store under the Theme Settings tab, next to the Sections tab. There are a number of options available to adjust your store’s visual style.
Colors
The colors options will allow you to change the way text, buttons, and form fields are displayed in your store. This is a great way to create more contrast for buttons in order to make them stand out.
Typography
The Typography options control the way text looks throughout your store. This includes the font used, font weight, and font scale for headings and the base body text.
Social Media
The inclusion of social media is important for supporting natural word of mouth marketing. Including social icons makes it easy for happy customers to share details about your brand or your products.
These options let you decide which social share buttons to include on your site with fields to customize the links for each of your social channels.
Favicon
Your Favicon is the small image that appears in association with your URL. Browsers display this either next to the URL or within the tab in your browser for the site. This option lets you upload the favicon for your store and automatically scales it to the appropriate size (32x32px)
If you don’t have a favicon for your online store, Shopify offers free images you can use. You can also find a number of conversion tools online that can help you turn your current logo into a favicon easily.
Checkout
Your store’s checkout gets a section all to itself. Since this is such a critical conversion point, you have some more direct control over this specific part of the shopping experience. Once you click into the Checkout section you’ll find a number of options including:
- Adjusting colors for accents and buttons as well as errors
- Adjusting checkout specific typography
- Background images for the checkout
- Logo placement for the checkout
- Order summary images and more
Conclusion
There are plenty of themes available on Shopify theme store paid and free both. Every month thousands of business owners download these templates. Those themes can be easily customized according to your requirements. Some of the easy customization steps are discussed above too. Follow them and make your store look the way you want.