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
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.
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.
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
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
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
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
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
---
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
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:
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:
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!
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
---
Footer
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.
3. Quick Links
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
5. Add shopping app block at Footer section
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
Thank you!