How to edit Shopify website theme in 4 simple ways
Instant Team
How to edit Shopify website theme in 4 simple ways
Your Shopify theme determines your store's appearance, and you can edit it to suit your needs. You can change the fonts, colors, images, and text to create a unique store that appeals to your target audience. You can also edit the theme’s code to make more advanced customizations. Doing this helps with Shopify conversion rate optimization for better sales. If you want to create an instant landing page for Shopify without any code, editing your theme can help. The more you customize your theme, the easier it will be to create a landing page that fits your requirements.
Instant’s Shopify landing page builder helps you achieve your goals faster by letting you edit your Shopify theme with an intuitive interface for building landing pages. With this tool, you can create a unique landing page that matches your vision without touching any code or getting lost in your Shopify settings.
Table of contents
What is a Shopify website?
Shopify is a popular eCommerce platform that enables you to create a fully functioning online store quickly and easily. You can sell on your website, social media, and online marketplaces like Amazon and eBay. The platform lets you manage your products, orders, and customer data from one central location. You can even use Shopify to track in-person sales if you set up a Shopify POS system.
Can I customize my Shopify website?
Absolutely! You have full control over your:
Shopify website's content
Layout
Typography
Colors
Each theme has sections and settings that let you alter your store's look without touching code. Some sections are fixed, like the header and footer, while others are movable. You can hide and delete sections and rearrange them to fit your needs.
How to edit Shopify website theme in 4 simple ways
1. Make your announcement bar stand out
Your Shopify store has an announcement bar that helps you communicate with your customers. This bar is perfect for sharing important information about your business, such as:
Promotions being offered
Shipping delays
Any updated policies
Not every theme has a built-in announcement bar. Other Shopify themes require downloading a third-party app to display one. For the Dawn theme, the announcement bar is available out-of-the-box, and you can make changes to things like:
Text Color scheme
Links Header section
The header is present on all store pages,
So these changes will apply across the entire store. You can tweak your header using the Dawn theme: Color scheme. The menu items display spacing and padding. You can also edit your logo favicon image or change color palette, typography, and more in Theme settings (See details in 4. Adjust Shopify Theme Settings).
2. Edit individual sections
Scroll down to customize other sections, including:
Image banner
Rich-text
Featured collections
Collages
Videos
Multicolumn
Each section has its customization options—Left-click on any section to see the menu of changes you can make. For the Collage section, you can determine which collection to show and which product to feature. Shopify's preview inspector Tip:
Remember: 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 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: Hover your mouse over the kebab menu to move a section. 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 your footer
Like the header, changes you make to your footer section will appear across your entire store. Of course, the Shopify customization options will depend on your theme. Here are some of the things you can change in your footer using the Dawn theme:
Color scheme
Email signup visibility
Follow on Shop allowance
Social media icons
Country/Region Selector
Payment method icons visibility
Policy links 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 access your theme settings, click on the gear icon Theme settings in the left corner of your screen, and the Shopify customization menu will pop up. Of course, Shopify customization options depend on the theme you are using.
But here are some you can find in most Shopify themes:
Logo: Set up your logo image and logo width, favicon image.
Colors: Change your color scheme for backgrounds, buttons, text, and accents.
Typography: Choose the fonts that work best for your store.
Layout: Adjust page width, space, and grid.
Animations: Enable the hover effect for cards and buttons.
Buttons, Variant pills, Inputs: Determine how your buttons, variant pills, and inputs look by customizing their border and shadow.
Product cards, Collection cards, and Blog Cards: Adjust the style, text, color scheme, border, and shadow of your product cards, collection cards, and blog cards.
Content containers, Media, Dropdowns and pop-ups, Drawers: Customize the border and shadow of the elements.
Badges: Set up badges’ position, corner radius, and color scheme.
Brand information: Input the headline and description, and select the featured image.
Social media: Add links to your social accounts.
Search behavior: Enable search suggestions or product vendor product price display.
Currency format: Choose to show or hide currency codes.
Cart: Define your cart type—drawer, page, or popup notification.
Custom CSS: Add custom styles to your entire online store.
Theme style: Change your theme’s style (will not lose any content from your store).
Customizing sections and theme settings via the theme editor adds twists to the basic Shopify theme. That's the very first step to leveling up your storefront. You can skip all these steps and use a tool such as Instant for high-quality pages.
Related Reading
How do I edit text on my Shopify website
Editing text on your Shopify website theme
You can adjust the text on your Shopify store’s website theme from the Shopify admin. Here’s how you can do it:
From your Shopify admin, go to Online Store > Themes.
Click the ... beside the theme that you want to edit.
Select Edit default theme content from the dropdown menu.
Click the tab or category that includes the text you want to change or use the Filter items search bar to locate phrases or words you want to change.
Click the ... on the right to reveal hidden tabs or categories:
Edit the text.
Click Save.
Shopify theme content categories
The theme content editor has the following categories:
General: General text and messages, including form submissions, social links, and alt text, and Powered by Shopify.
Newsletter: Content and messages displayed for customers who subscribe to your newsletter.
Accessibility: Messages associated with access to content, including errors, refreshes, and reviews.
Blogs: All elements associated with reading, posting, and commenting on blog articles.
Onboarding: All default, templated product and collection titles.
Products: Messages related to viewing products, product availability, pickup, and media associated with products.
Templates: Contact form fields, messages for search results, and basic terms for search.
Localization: Country/region and language content.
Gift cards: Wording related to issuing, using, and managing gift cards.
Recipient: Messages and labels related to sending gifts.
Sections: Content that appears on the header or the footer, such as navigation and wording related to the cart.
Checkout & system: All of the content in the checkout and system titles, errors, and notices.
Accounts (new): Messages and labels associated with customer accounts (new), including navigation and structure, profile, order details & status, and shipping & delivery.
Accounts (classic): Messages and labels associated with customer accounts (classic), including login, orders, and password reset.
Can you edit Shopify HTML?
Yes! You can change your Shopify store's HTML. This includes editing your theme code to make more advanced changes to your online store. Most files comprising a theme contain Liquid, Shopify's templating language. These files also contain:
HTML
CSS
JSON
JavaScript
You should only edit the code for a theme if you're comfortable with HTML and CSS and have a basic understanding of Liquid. To change your HTML: From your Shopify admin, go to Online Store > Themes. Click > Edit code.
The code editor shows a directory of theme files on the left and a space to view and edit the files on the right. When you click a file in the directory on the left, it opens in the code editor. You can open and edit multiple files at the same time. Any modified files will show a dot next to the file name. This can help you to keep track of where you have made changes.
Related Reading
11 Best Shopify apps for a fast and responsive store
1. Instant: The fast lane to landing page success
Instant is a user-friendly Shopify landing page builder that allows eCommerce teams and agencies to create fully customizable and advanced pages without any coding knowledge. With its intuitive drag-and-drop interface, users can quickly design and publish:
High-converting landing pages
Product detail pages
Sections, all while maintaining complete control over their store's design
Instant also offers seamless integration with Figma and other eCommerce tools, making it a versatile choice for enhancing online store performance and increasing conversions.
Try Instant's Shopify landing page builder today!
Purpose: Landing Page Builder
Use: Instant is a Shopify landing page builder that allows users to create customizable and advanced pages without coding. With a drag-and-drop interface, it helps design high-converting landing pages, product pages, and sections. It integrates seamlessly with tools like Figma, enhancing store design and performance.
2. Printful: The perfect partner for print on demand
Printful is a print-on-demand service that allows Shopify users to design custom products like clothing, mugs, pet products, and more. The app handles order fulfillment and shipping, saving you time and resources.
Purpose: Print-on-Demand Service
Use: Printful allows Shopify users to design and sell custom products like clothing and mugs. It handles order fulfillment and shipping, making it easier to run a store without worrying about inventory.
3. Shopify Email: Your Shopify store’s email marketing assistant
If you want to promote your business with email, Shopify Email is a great marketing app for building an email list and managing your campaigns. With Shopify Email, you can send branded emails to subscribers from your Shopify admin dashboard in just a few clicks. The app has a variety of pre-made templates that pull your:
Logo
Product images
Descriptions and more
You can also customize the text and buttons in minutes. Simply import your contact lists into Shopify. Create and send your campaigns, then track results like opens, clicks, add to carts, and purchases to further optimize your customer acquisition and retention campaigns. You get 10,000 emails for free each month, then pay only $1 for every 1,000 emails you send after that.
Purpose: Email Marketing
Use: Shopify Email helps businesses promote their store via email. It offers pre-made templates and easy integration with store data to create and send branded emails. Users can track campaign performance, making it a valuable tool for customer acquisition and retention.
4. Matrixify: A better way to manage your Shopify store
Matrixify lets you bulk import, export, and update your Shopify store data using Excel and CSV files. If you’re migrating to Shopify from another platform, this app allows you to easily move all your products, customers, and orders to Shopify, streamlining the migration process.
Purpose: Store Management
Use: Matrixify allows bulk import, export, and updating of Shopify store data using Excel and CSV files. It's especially useful for migrating data from other platforms to Shopify, streamlining the setup and management of the store.
5. Peek: Analyze user behavior to improve conversions
Ever wonder why shoppers don’t convert on your website? Peek! ‑ Better Replay & Survey provides live recordings of shoppers’ sessions so you can see how people interact with your Shopify store and what items they look at.
With this information, you can see and fix where shoppers get stuck and evaluate new ideas to improve conversions and lower abandoned carts in your store. The best part? The app is free, and no coding is required.
Purpose: User Behavior Analysis
Use: Peek provides live recordings of shopper sessions on your Shopify store. It helps identify where customers get stuck, allowing you to improve conversion rates by fixing usability issues.
6. Spocket: Dropshipping made simple
Spocket is a dropshipping marketplace offering thousands of products from global suppliers. Simplify your dropshipping business with one-click purchase options, order fulfillment, real-time tracking, and flat-rate shipping. Cross-sell new products to increase average order value.
Purpose: Dropshipping Marketplace
Use: Spocket simplifies dropshipping by offering thousands of products from global suppliers. It includes features like one-click purchase options, order fulfillment, and real-time tracking, making it easier to manage a dropshipping business.
7. Event Ticketing: A unique way to sell products on Shopify
This app lets you easily design, sell, and scan event tickets. With Event Ticketing, you can add custom branding to event tickets, sell them directly through your online store, and scan them using your phone. Event Ticketing also integrates with Apple Wallet, making it easy for customers to save their tickets to their mobile devices.
Purpose: Store Management, Store Design
Use: Event Ticketing enables the design, sale, and scanning of event tickets through Shopify. It allows custom branding, integration with Apple Wallet, and easy management of event sales.
8. ESC: Create size charts to improve user experience
A must-have for any fashion brand is an easy-to-read size chart. Size guides empower customers to confidently make purchase decisions, helping to recover sales that may have otherwise been lost. They also help reduce the number of returns and refunds, since sizing issues are less likely to occur when customers know exactly which size fits their needs.
ESC’s size chart app helps merchants create size guides to match the look and feel of their store and easily paste them into any page on their website. The app has a free plan that allows merchants to create up to three charts, and a paid plan is available for merchants who need more.
Purpose: Size Chart Creation
Use: ESC helps fashion brands create size charts that match their store's look and feel. It reduces returns by giving customers accurate sizing information, improving the shopping experience.
9. Warnify: Communicate critical information to customers
Warnify makes it easy to communicate with your customers through pop-ups. Announce low inventory, shipping delays, an upcoming store closure, and more through fully customizable pre-checkout pop-ups. Choose which customers can view the pop-up by targeting certain countries, states, and provinces.
Purpose: Store Design
Use: Warnify lets you communicate important information to customers through customizable pre-checkout pop-ups. It's useful for announcing low inventory, shipping delays, or other critical updates.
10. Smile Loyalty and Reward: Build customer loyalty for your Shopify Store
Smile is a loyalty program app that rewards customers for various actions. Turn shoppers into loyal customers by rewarding them for purchases, referrals, account registrations, social shares, and followers. Over ten engagement methods are available in the free plan.
Purpose: Loyalty Program
Use: Smile allows you to reward customers for various actions like purchases, referrals, and social engagement. It's designed to increase customer loyalty and repeat purchases.
11. CrowdFunder: Sell products and manage campaigns
Crowdfunder is your one-stop shop for hosting and managing a crowdfunding campaign directly through your Shopify store. You can use this app to manage pre-orders, product launches, and limited edition releases. Crowdfunder is also a great solution for nonprofits, making raising funds for causes and charities easy.
Purpose: Crowdfunding, Store Management
Use: CrowdFunder helps you manage crowdfunding campaigns directly through Shopify. It's useful for pre-orders, product launches, and fundraising for causes or charities.
Related Reading
Shopify Web
Shopify Customization
Custom Shopify Themes
Free Ecommerce Templates
Optimize your Shopify store for conversions without breaking the bank with Instant's Shopify landing page builder
Landing pages are crucial for increasing conversions. Optimizing these pages can help your store earn more revenue with fewer visitors. And that’s especially handy if you’re running a paid ad campaign and trying to recover your costs.
Instant helps you create beautiful, conversion-focused landing pages and customize them to your liking. You can start from scratch or use one of the pre-built templates to speed up the design process.
Weekly Shopify tips from our founder in your inbox. Read in 3-mins or less. Start converting like an eCommerce expert.
More stories
eCommerce
·
Oct 4, 2024
eCommerce
·
Oct 3, 2024
