Articles on: Online Store (Website)

Guide on how to customize theme (Aroma theme onwards)

Webstore design plays a crucial role in your business as it reflects your branding and creates the first impression for your customers when they browse through your online store.

This article provides guidance on using the Aroma theme and any themes released after it. These themes offer flexible layouts with easy-to-edit sections and blocks. You can now effortlessly add, rearrange, and modify any page without needing any coding!

New Theme vs Old Theme
Setup your theme
Customizable section

1. New Theme vs Old Theme



Currently, EasyStore offers two types of scene themes: new version and old version. The settings interface differs between these versions.

New Theme: Aroma and themes released later


Old Theme: Candy and themes released earlier.




2. Setup your theme



Step 1: Choose your preferred theme

From your admin panel > you may go to Channels > Online Store > Themes > click on Theme store


Step 2: Browse through the available themes and select your preferred one. Muse theme will be used to showcase on the following steps

To preview the full layout, click View Demo.
Click Install to apply it to your online store

(Muse theme will be used as an example in the following steps)



Step 3: To begin designing, click Customize


Step 4: The theme consists of multiple customizable sections arranged from top to bottom. These sections can be edited through the left sidebar as in below screenshot. Each button in the sidebar corresponds to a specific section on the homepage as you scroll down.


You can also customize different page such as:
Home page
Collection page
Cart page
Product page


You can switch between different screen previews (computer browser, tablet, and mobile phone) to see how your online store appears from your customers' view across various devices.




Header



Step 5: You can start with the Header to adjust the alignment of your logo, upload your logo image, and customize the bar & text color



Home page



Step 6: You may customize your homepage based on the customize section available



📌Note: When you first install the theme, a default homepage layout will be applied. If you'd like to remove a section, simply click on the section, scroll down & select Remove section



You can also add new section in your homepage


You can re-arrange your section based on your preference using the drag & drop feature

GIF as reference

3. Customizable section



Home page



Video loop - Plays a video continuously by restarting it once it ends, providing a seamless viewing experience for your visitors.

📌Note: You must first upload your video to YouTube, then copy the video link and paste it into the designated column in the settings.

You may rename the text, title, button label and add in your button link to direct the customer to a certain page / collections.



Featured Collection - Showcases a curated collection of products on your homepage, making it easier for customers to discover and shop your selected items.

You can also use this section to showcase your new arrivals or latest collections to keep your customers informed and engaged. To set it up, choose a collection from your store, and it will be displayed prominently in the Featured Collection section of your homepage

You can customize the page by setting the number of collections per row, product display to be shown, adjusting the i mage ratio, enabling the "Add to Cart" button, show secondary image, show product information, and selecting a background color for the products.


Image banner - Displays a large, eye-catching image on your homepage, ideal for highlighting promotions, showcasing your brand, or featuring specific products or collections.

You can edit text, heading & button to direct your customer to a specific collection

You may also upload your background image under Settings


Multicolumn - Displays content in multiple columns, allowing you to organize and showcase products, collections, or promotions in a clean, easy-to-navigate layout.

You may add in your image, title, text, link text & link URL


You may add up to 5 multicolumns by clicking add block


Blog Post - You can publish articles, updates, or news on your online store, helping you engage with customers, share valuable content, and improve SEO

📌Note: You will need to create your article from your admin panel > Channels > Online Store > Articles before choosing which article to publish / showcase in your online store


You may also adjust / edit the following settings



Featured Product - Highlights a specific product on your store’s homepage, drawing attention to it and making it easier for customers to discover and purchase

You may choose your product, set your variant options display & enable to display product variant image


Example:


Home content - A description of your store displayed on the homepage, providing visitors with an overview of your brand, products, and offerings. You can also add images, but the content will follow what is set in Online Store > Webpages > Home.


Image with Text - Displays an image and text together to highlight a message or information

You may adjust the image width, add in subtitle, title, rich text, button label together with the button link. You can also choose to set the image position & the background & text color



Promotion - To highlight a special offer or discount on your homepage

You may adjust the background & text colour to match your online store layout. Add in title, text, button label & button link. Promotion can be added up to 6 blocks or banners


Rich Text - You may add formatted text to share more about your brand, values, or story

You may customize your own heading, text, button label & link



Slider - Display a series of images or content that slides automatically or manually. You may share multiple items in one space. Slides can be added up to 6 slides maximum


You can add in your slide title, text, button, slide link, content position and the colors


Video - You can add a video to your homepage by uploading it to YouTube first. Then, simply copy the link and paste it into the YouTube Video URL column

You can add your video title, image, YouTube URL, and enable full width if desired


Product variant image at product list section & product page

Under theme Koji & Olive, you may show a product variant image at your product list section & product page





Collection Page



You can customize your collection page and set the number of collections per row to display for your customers & the general settings


You may set your image ratio & other settings as shown



The Settings area lets you adjust general elements like font, color, and background. Be sure to update your favicon, the small icon next to the browser tab, and the logo for your checkout page.

📌 Note: The same settings also will be applied on Cart page & Product Page



Cart Page



You can add a Featured Collection to encourage customers to buy more by showcasing additional products they might be interested in

You may rename your heading, choose your collection, adjust number of collections / products to be displayed in a row, enable show all button & image ratio. You may also enable other settings as per screenshot below

---

Product Page



You may customise the icon & text on your product page. By default, it will show 3 different icons & text as in screenshot below



You may choose to either edit it or remove the block. You may add up to 6 icons maximum


You may also customise the following under Settings of each icon with text
---


Under Footer, you may set up your social media channel, payment method, quick links & about us


You may rename the heading of each section accordingly

1. Social Media



You can add your social media handle at the end of the link. When customers click on the icon in the footer, they will be redirected to your social media page.

Example:



If you're not using a specific social media platform, you can remove the link, and the corresponding icon will also be removed from the footer.

GIF as reference:

2. Payment methods



You can untick the payment methods you are not using, and the corresponding icons will be removed as well. Additionally, if you tick the payment method in the bottom box, it will display all the payment methods set up in your admin panel.




Quick links will display webpages created in your Admin Panel under Channels > Online Store > Webpages.



To make the page appear in the Quick Links section, set its navigation to Quick Links Footer, as shown in the screenshot below:


4. About us



This is where you can add text to share a brief glimpse of your store's mission, values, and story, allowing customers to learn more about your brand



You can now add your shopping app block / icon to encourage customers to download your Shopping App for a seamless shopping experience, directly from the footer section


📌 Note: If you're unable to see the Shopping App block, you can reset the footer settings by going to Online Store > Themes > Edit source > Sections > look for footer.liquid > click reset

Once done with all the theme customization, do not forget to click save & you're done!

Updated on: 02/01/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!