- Preparing to Customize Your Shopify Theme
- How to Customize Your Shopify Theme in The Theme Editor?
- How to Create Shopify Custom Pages with GemPages Page Builder?
- Your Shopify Store Deserves An Upgrade!
- FAQs about Shopify Customization
If you're reading this, it’s because you're the type of merchant who takes your storefront seriously.
We're also betting that you might have tried to tweak your existing Shopify theme but it was not easy as you imagined. Or, you might even be looking for an agency or a dedicated developer to take care of your Shopify customization for you.
We love that, cause it means you're our kind of people.
Unfortunately though, customizing Shopify is far from a walk in the park. That's why we put lots of effort into crafting this article—to help you easily customize Shopify themes to better suit your needs.
In this post, we'll cover:
- Preparing to customize your Shopify theme
- How to customize your Shopify theme in the theme editor
- How to create Shopify custom pages with GemPages
Preparing to Customize Your Shopify Theme
First, there are two common ways to customize your Shopify theme:
1. Customize via the the theme editor
2. Use GemPages page builder
Second, don't forget to duplicate your theme before customizing it. This makes it easy to discard your changes and start again if you want to.
If you already have 20 themes added to your Shopify admin, you'll need to delete one before you can create another.
To duplicate your theme:
- Go to your Shopify admin.
- There, click on Online Store > Themes.
- Locate the theme you want to duplicate—if it's your live theme, it'll be under Current theme, or if it’s one of the other themes, it'll be in your Theme library.
- Click Actions > Duplicate.
Duplicate your theme before customizing it.
The duplicate theme will appear on the Themes page and be named as Copy Of + the name of the theme you duplicated.
How to Customize Your Shopify Theme in The Theme Editor?
When you customize your pages using the Shopify theme editor, you are customizing the page templates rather than the individual pages themselves. That means any changes you make to a particular template will apply to all pages using that template.
You can customize your online store's content, layout, typography, and colors. Each theme provides sections and settings that allow you to change the look and feel of your store without having to touch or even see any code.
There are many sections—some fixed and some movable. The Header and Footer section are fixed on the page—they will always appear on the page and you can't change their position.
Other sections, as you can see, will have two icons on the right: the eye and the kebab menu. Whether those sections appear or don't appear on your page depends on your settings, and you can also move them between your Header and Footer to fit your needs.
1. Customize The Announcement Bar and Header SectionAnnouncement bar
The announcement bar is where you can display important information about your business—any promotions being offered, any shipping delays, or any updated policies.
However, not every theme has a built-in announcement bar. Other Shopify themes might require downloading a third-party app to display an announcement bar.
For the Dawn theme, the announcement bar is available out-of-the-box, and you can make changes to things like:
- Color scheme
The header is present on all store pages, so these changes will apply across the entire store.
Here are some tweaks you can make with your header using the Dawn theme:
- Color scheme
- Logo image
- Logo width
- Logo position
- The menu items that display
- Spacing and padding
2. Edit Individual Sections
Next, scroll down to customize other sections including the image banner, rich text, featured collections, collages, videos, and multicolumn.
Each of these sections has its own options for customization. Left-click on any section to see the menu of changes you can make.
For the Collage section, for example, you can determine which collection to show and which product to feature.
Shopify's preview inspector
Tip: Don't forget to activate the preview inspector at the top of the theme editor during your editing sessions. The preview inspector allows you to navigate to sections and blocks directly from the preview window and find the corresponding settings faster and more intuitively.
Add a section
To add a section, click on the blue button Add section and either select a new section from the list or search for a specific term in the search bar. Of course, the newly-added section doesn't have to stay right above the footer—it can be moved up or down on your page.
Move a section
To move a section, hover your mouse over the kebab menu. When your mouse pointer turns into a white glove, click and drag the icon to rearrange the section on your page.
Remove a section
To remove a section, left-click on the section you wish to delete and choose the recycle bin icon at the bottom.
3. Customize The Footer Section
Like the header, changes you make to your footer section will appear across your entire store.
Of course, the customization options will depend on which theme you are using.
Here are some of the things you can change in your footer using the Dawn theme:
- Color scheme
- Email signup visibility
- Social media icons
- Country/Region selector
- Payment method icons visibility
- Spacing and padding
4. Adjust Shopify Theme Settings
Another thing you can do in the Shopify theme editor is to change your theme's general settings, which govern the look and feel of your store.
To find your theme settings, click on the brush icon Theme settings in the left corner of your screen, and the Shopify customization menu will pop up.
Of course, customization options depend on the theme you are using.
But, here are some you can find in most Shopify themes:
- Colors: Change your color scheme for elements like backgrounds, buttons, text, and accents.
- Typography: Choose the fonts that work best for your store.
- Layout: Adjust page width, space, and grid.
- Buttons: Determine how your buttons look by customizing their border and width.
- Social Media: Add links to your social accounts.
- Favicon: Upload your favicon image.
- Cart: Define your cart type—drawer, page, or popup notification.
- Checkout: Change the layout and design of your checkout page
By customizing sections and theme settings via the theme editor, you are bringing new twists to the basic Shopify theme. That's the very first initial step to leveling-up your storefront.
But if your brand demands a more sophisticated online presence, it may be time to step out of the standard default theme and basic Shopify customization.
Fortunately, you have the option for endless flexibility with a powerful page builder like GemPages.
Read more to explore a game-changing solution for your Shopify customization, so you'll never have to sweat over web design.
How to Create Shopify Custom Pages with GemPages Page Builder?
1. Shopify Themes vs Page Builders: What’s The Difference?
A theme determines the organization, features, and style of your online store.
A page builder is an extension you install on the top of your theme to help further customize Shopify store pages with minimal effort and time.
To make it easier to understand, imagine your Shopify store as a sponge cake.
The theme acts as the sponge, and a page builder is like the icing. The sponge is a must-have for any cake, whereas the icing is a nice-to-have.
We can totally enjoy the cake simply with a light, airy sponge. But it's the artfully crafted drip frosting that captivates customers and convinces them to buy.
2. How GemPages Helps with Your Shopify Customization?
GemPages page builder is compatible with the latest Shopify themes and Online Store 2.0. So basically, whatever Shopify theme you're using, you can install GemPages for more advanced customization.
GemPages's extensive library of page templates.
GemPages grants you access to an extensive library of 65+ page templates, so you don't need to start with a blank slate.
Just choose from our collection of professionally ready-made templates and make your mark by uploading your products, inserting some fresh content, and adding images, videos, animations, and effects.
If you need any suggestion to design-wise your pages, you can turn to our GemMeter feature anytime you need. Available on all GemPages pricing tiers, GemMeter helps to detect design mistakes and provides real-time suggestions for higher-performing pages.
What's more, with GemPages' Global Styles feature, you can create custom presets and apply them to each of your pages. This can save you the hassle of repeatedly editing every tiny detail while ensuring brand consistency.
But it's not just about page design. Brands need a way to balance beauty, conversion, and performance.
GemPages also offers:
- A slew of conversion-boosting elements like a countdown timer, a sticky add to cart, and social sharing to boost sales.
- Lazy loading, pre-load resources, and high-speed CDN ensures your page loads as fast as possible.
- GemPages also takes the liberty of optimizing your pages for mobile devices and search engines with mobile-friendly design, on-page meta data, and alt tags.
Andrew Ethan Zeng, the founder of AEZ Media & Mastery shares his experience using GemPages to create, customize, and optimize his Shopify store. You can watch his video for a quick, easy tutorial on how to build custom store pages with GemPages.
3. Examples of Shopify Custom Pages Created with GemPages
Below are some of the best examples of how GemPages customers have been able to create Shopify custom designs that are equal parts stunning and high-converting.
Please note that all these websites are created with GemPages and we showcase screenshots taken directly from the brand featured at the time of publishing.
Cozy Ladies is a feminine hygiene brand that manufactures and sells period underwear made of bamboo fibers. This single-product brand turned to GemPages to create a stylish product page and luckily, they trusted the right app!
Just look at their custom product page built with GemPages! Their focus on designing an innovative product with a positive impact on a consumer’s health and environment is evident throughout the site.
A blend of bold copy, balanced whitespace, and pixel-perfect visuals communicate the brand personality and keep eyes on the product. We also love the way they build trust in their product with high-quality short product videos, a detailed Q&A section, and a bunch of positive customer reviews.
"This app (GemPages) is a must. Highly recommend to anyone looking for big customization. And if you have any bugs, there's no need to hire a developer. The support is very helpful."
- Cozy Ladies
Saturnbird's online store makes shopping for instant coffee anything but mundane. See how they create their magnificent store pages with GemPages!
Colorful, dynamic, and modern branding—from hero banner images and GIFs to interactive buttons on the homepage and product pages, this site is a joy to browse.
"I really like GemPages. It's very user-friendly, with more customization features to make our product pages richer and more attractive to customers. Customer service is also very cooperative... It's better than the app I chose before, and I would recommend it to you!"
- Saturnbird Coffee
PopBae is a fast-fashion handbag, footwear, and accessories retailer based in the U.S. They chose Envy as their store theme and later installed GemPages for more advanced Shopify customization.
Aside from bright and clear product images, the brand provides color and discounted and original prices, for each product in their collection. There are also many options to sort products, making it easy for customers to find products as they wish.
Your Shopify Store Deserves An Upgrade!
Now that you've learned how to customize a Shopify theme to get the exact look that suits your brand personality.
What are you still waiting for? Customize your store today and watch your sales grow!
FAQs about Shopify Customization
Honestly, Shopify customization is not easy. You need to have a certain level of technical knowledge to customize your Shopify store. If not, there's a good chance you'll find it way too complicated and time-consuming. A better idea for newbies is to customize Shopify with a third-party app like GemPages.
Shopify's ability to be customized is pretty impressive, from themes, products, discounts, and checkouts to payments. You can customize your Shopify in your dashboard regardless of your coding knowledge.
Yes! Most of the basic customizations can be conducted in the Shopify admin. But if your store demands a higher level of customization, you may need the help of a page builder like GemPages. With GemPages, you can step out of the standard Shopify layout to launch pages that create unique experiences to convert customers.
If you go for a Shopify page builder like GemPages, it only costs you $29/month—a reasonable price with high-level customization. If you hire a professional freelancer, you pay way much more, starting at $2000.
Of course, you still need to pay your Shopify theme fees. A free theme costs you zero, but a premium Shopify theme costs you between $150 and $350.
You can either manually update your Shopify theme or use the Theme Updater app. We recommend you go for the latter as it's much easier, less stressful, and you don't have to edit any code.
Both free and premium Shopify themes are customizable, and each theme has different customization options. Customizing your theme in the Shopify theme editor only gets you to a certain level. To really differentiate your brand and create a visually stunning custom shopping experience, you should turn to GemPages drag-and-drop page builder.