Avone -  Multipurpose Shopify Theme

Thank you so much for Your purchase !

If you have any questions that are beyond the scope of this help file, please feel free to submit a ticket at http://adornthemes.com/support/.
Thank you very much! Below you will find the guidelines on how to install and use our theme. Cheers !

Theme Preview

Installation


Installation is easy and quick. We recommended you to read Shopify Manual to have clear idea about all the aspects of theme customization.

INFO! If you don't want to spend your time installing the theme and store set up, Feel free to contact for our paid store setup serivce.
You can send an email direct on info@adornthemes.com. We will reach out to you very soon.

Don't have store yet? You can send an email on info@adornthemes.com.
We will create Development store for you with unlimited trial time. You can Transfer ownership when store is ready to launch.

Install Theme


Install Default Demo – Home 1

Step 1. Download theme package from Themeforest. https://themeforest.net/downloads [ Please make sure you have already logged in to ThemeForest. - https://themeforest.net/ ]

Step 2. Extract/Unzip all files from downloaded package. Find “avone-install-me-shopify2.0.zip” file. This is theme default demo zip file. Please install this file on your shopify store.

Step 3. Logging into your Shopify store and Navigate to Themes -> Click “Add theme” -> Upload zip file. Click here

Step 4. Click on Publish button to publish new theme


Install premade Home skins

Step 1. Follow above step 1 to step 3

Step 2. Now go to the "Demo Preset Shopify 2.0" folder that you downloaded from themeforest.net.

All you need to do is copy all data from index.json and settings_data.json file from any preset folder file and paste it on same theme file on your store. Explain in below steps..

Step 3. In the Preset folder, you will see folders for all available skins. Please open any skin folder that you would like to install.

Click here to see all available home skins/demos

You will see 2 files : index.json and settings_data.json.

Step 4. Now go to the Avone theme that you just uploaded. Click Action –> Edit Code

Step 5. Find Templates folder and open index.json file.

Step 6. Select and Remove all data from this file. Now paste copied preset data. ( index.json file data you copied in Step 5) And Click Save.

Step 7. Find Config folder and open settings_data.json file.

Step 8. Select and Remove all data from this file. Now paste copied preset data. ( settings_data.json file data you copied in Step 5) And Click Save.

Step 9. By Default your uploaded theme is unpublished. Another theme is active on your store. You can publish new theme when you are done with theme configuration and setup.

Step 10. Click on Publish button to publish new theme

Recommended Apps


  1. Shopify Search & Discovery - Free

    Customize your store search, filtering, and product recommendations, so you can enhance your products’ relevance and sell more.

    click here to get this app

  2. Loox Product Review app [Paid] - Get an extended 30-day free trial

    • Product reviews with photos build more trust.
      To enable Loox Product Review, please install this app: click here to get this app
  3. Weglot Translate[Paid] - Get 20% off for Avone theme

  4. Growave - Reviews, Loyalty ++ [Paid] - Get 30 days Free trial

  5. PageFly Landing Page Builder - Free to install

      Craft stunning web pages without code. More advanced customization to convert your visitors. PageFly caters to everyone, from first-time store owners to fast-growing merchants and expert agencies.

      click here to get this app

  6. AI Search, Filter & Recommend - Paid

      Create effortless shopping experiences that boost conversion & maximizes AOV with Boost AI Search and Discovery. A powerful search app that uses AI to deliver lightning-fast & most relevant search results. Help shoppers find their next favorite product with AI recommendations

      click here to get this app

  7. UpPromote Affiliate & Referral - 14-day free trial

      Complete, easy referral & affiliate program app, trusted by top brands & experts for a revenue boost. Discover UpPromote's powerful influencer marketing & referral program, winning the hearts & brands' trust through real testimonials

      click here to get this app

  8. Instagram shop by Snapppt[Paid]

    • To enable Instagram shop, please install this app: click here to get this app
    • Read this well written app article to know about how to display shoppable galleries on your store.
    • Read our article for the same.
  9. AVADA Cookie Bar[Free]

Basic Configuration


Please follow below required settings on your store.


Watch Video  

Enable Customer Accounts


From your store Admin -> Click Settings -> Locate Customer accounts

Do as below and click Save


Set up Shipping Rates


From your store Admin -> Click Settings -> Locate Shipping and delivery

Please configure your shipping rates by following this article by shopify

Currency Settings


From your store Admin -> Click Settings -> Locate Store details

How to create new menu


You can create a link list of collections, products, pages or blogs in menu

From your store admin -> Click Online Store -> Navigation ->

Steps

Megamenu Simple


Step 1 :

From your store admin -> Click Online Store -> Navigation -> Click Add menu

Add Menu items with Sub Menu Items As display below ( below screenshot is only for reference )

Step 2 :

In the theme editor(theme customize) –> Click Main Navigation –> Add block –> Click MM Simple

Add Link Name, Menu Link, Select Menu, Select Columns, Set Banner Images(Optional).

Megamenu Products


In the theme editor(theme customize) –> Click Main Navigation –> Add block –> Click MM Products

Megamenu Top Image Columns


Step 1:

From your store admin -> Click Online Store -> Navigation -> Click Add menu

Add Menu with Sub Menu Items. To use this Megamenu, Please create different menus for each columns.

I.e. If you want to display 4 columns to Display Women, Men, Kids, and Accessories collection then create 4 different menus with sub menu links for each column.

Follow this article to read more in details : How to create Menu?

Step 2 :

In the theme editor(theme customize) –> Click Main Navigation –> Add block –> Click MM Top Image Columns

Set Link Name, Menu Link and for each column you want to display, Set title, image, image link and select menu

Megamenu Background Image


Preview Megamenu Background Image

Step 1 :

From your store admin -> Click Online Store -> Navigation -> Click Add menu

Add Menu with Sub Menu Items.(below screenshot is only for reference)

Step 2 :

In the theme editor(theme customize) –> Click Main Navigation –> Add block –> Click MM Background Image

Megamenu Custom HTML


Display Custom HTML - You can put html code here

In the theme editor(theme customize) –> Click Main Navigation –> Add block –> Click MM Custom HTML

Advanced Megamenu - Vertical menu


Step 1 :

From your store admin -> Click Online Store -> Navigation -> Click Add menu

Add Menu with Sub Menu Items as shown in below screenshot ( screenshot is for reference )

Step 2 :

In the theme editor(theme customize) –> Click Main Navigation –> Add block –> Click Add MM Advanced

Add Link Name, Menu Link, Select Menu, Set Columns for Sub menu links and select collections from products block to display products on right side of menu for each main links.

Menu Labels (Optional)


In the theme editor(theme customize) –> Click Main Navigation

Set Manu Label 1 to Menu Label 5 as required

Set menu labels with main menu items

Set menu labels with sub menu items

From your store admin -> Click Online Store -> Navigation -> Select Menu -> Click on Menu items

Page Setup


Learn how to create a pages?

We have created the premade template below using sections. Templates always show from the publish theme.
While you are working with Avone theme and creating pages, you need to publish Avone theme for a moment to select Avone theme templates.

Theme must be published to select theme templates

Contact Page


Watch Video

From your store admin -> Click Online Store –> Pages –> Click Add page:

Add contact page detail from Contact page Section

In the theme editor(theme customize) –> Select Contact Page from top dropdown menu

Click Contact Page section and customize look from sidebar.

To add/edit contact field, please follow below guide:

Adding fields to the Liquid Contact Form

About Page


Watch Video

Step 1:

From your store admin -> Click Online Store –> Pages –> Click Add page:

Set page Title and choose Theme template about and save

Step 2:

In the theme editor(theme customize) –> Select About Page from top dropdown menu

Set Page banner from Page section OR Add/edit/remove/hide blocks or sections

FAQs Page


Watch Video

Step 1:

From your store admin -> Click Online Store –> Pages –> Click Add page:

Set page Title and choose Theme template faq and save

Step 2:

In the theme editor(theme customize) –> Select FAQ Page from top dropdown menu

Set Page banner from Page section and Add/edit/remove/hide blocks or sections

Wishlist Page


Watch Video

Step 1:

From your store admin -> Click Online Store –> Pages –> Click Add page:

Set page Title and choose Theme template wishlist and save

Step 2:

In the theme editor(theme customize) –> Theme Settings -> General Settings

Make you sure "Enable WishList" option is enabled and Select WishList page.

Lookbook Page



Watch Video

Lookbook Photo Gallery is an awesome marketing tool and new way to showcase your products in a different style. You can add shoppable tag or link the products on images so that customers can shop directly from the Gallery. This creates a beautiful shopping hotspot for your customers to find out more details about featured products and add them directly to their cart

Step 1:

From your store admin -> Click Online Store –> Pages –> Click Add page:

Set page Title and choose Theme template lookbook and save

Step 2:

Add lookbook pictures from :

In the theme editor(theme customize) –> Select Lookbook Page from top dropdown menu

Set Page banner from Page section and Add/edit/remove/hide blocks or sections

Blog Page



Watch Video

Step 1 :

How to create a blog and write an article ?

Step 2 :

In the theme editor(theme customize) –> Select Blogs -> Default blog (from top dropdown menu)

From Blog Pages section, Add sidebar bloks, set page banner, set page layout and manage page elements desing

Cart


In the theme editor(theme customize) –> Click "Theme settings" icon -> Locate Cart

Please make the necessary settings as required for your store, which will be applied to the cart drawer and a few of them for the cart page.

Sections


Sections allows user to easily add or move content on store homepage as well on inner pages with just a few clicks to create desired layouts.
You can preview your changes in real-time in either desktop or mobile view

There are 31+ Sections availables to use. You can add, update, reorder and delete any sections any time as per your requirements.

Add sections on every page - For OS 2.0

From your shopify store admin -> Click "Online Store" -> Locate theme you want to customize ->
Click Customize button -> Click "Add section" to add below sections

  1. Here’s how easy it is to add new sections to a theme

    Adding a section to a Shopify Theme
  2. Also it is very simple to drag and drop and reorder existing sections

    Reordering sections within a Shopify Theme

Products Columns


In the theme editor(Customize) –> Click "Add section" –> Search section "Products Columns" and click to add.

Premium Shopify Theme - Product Columns

Settings and Design Options

Premium Shopify Theme - Product Columns

Products Rows


In the theme editor(Customize) –> Click "Add section" –> Search section "Products Rows" and click to add

Premium Shopify Theme - Products Rows

Settings and Design Options

Premium Shopify Theme - Products Rows

Products Slider


In the theme editor(Customize) –> Click "Add section" –> Search section "Products Slider" and click to add

Premium Shopify Theme - Products Slider

Settings and Design Options

Premium Shopify Theme - Products Slider

Tabs + Products Slider


In the theme editor(Customize) –> Click "Add section" –> Search section "Tabs + Products Slider" and click to add

Click here to view more Tab styles.

Premium Shopify Theme - Collections Tabs and Products Slider

Settings and Design Options

Premium Shopify Theme - Collections Tabs and Products Slider

Collections Banners(Masonry)


In the theme editor(Customize) –> Click "Add section" –> Search section "Collections Banners(Masonry)" and click to add

Click here to view more styles

Premium Shopify Theme - Collection Banners

Settings and Design Options

Premium Shopify Theme - Collections Banners

Collections List


In the theme editor(Customize) –> Click "Add section" –> Search section "Collections List" and click to add

Click here to view more styles

Premium Shopify Theme - Collection Carousel or List

Settings and Design Options

Premium Shopify Theme - Collection Carousel or List

Grid Banners


In the theme editor(Customize) –> Click "Add section" –> Search section "Grid Banners" and click to add

Click here to view all grid style.

Premium Shopify Theme - Grid Banners

Settings and Design Options

Premium Shopify Theme - Grid Banners

Image Slideshow


In the theme editor(Customize) –> Click "Add section" –> Search section "Image Slideshow" and click to add

Display an image slideshow without cropping anywhere on your store. (Display images only not text)

Lookbook Shop


In the theme editor(Customize) –> Click "Add section" –> Search section "Lookbook Shop" and click to add

Click here to view more grid style

Premium Shopify Theme - Lookbook Shop

Settings and Design Options

Premium Shopify Theme - Lookbook Shop

Parallax Banner


In the theme editor(Customize) –> Click "Add section" –> Search section "Parallax Banner" and click to add
Parallax effect will not work mobile view.

Click here to view more style

Premium Shopify Theme - Parallax Banner

Settings and Design Options

Premium Shopify Theme - Parallax Banner

Slideshow


In the theme editor(Customize) –> Click "Add section" –> Search section "Slideshow" and click to add

Premium Shopify Theme - Slideshow

Settings and Design Options

Store Features


In the theme editor(Customize) –> Click "Add section" –> Search section "Store Features" and click to add

Premium Shopify Theme - Store Features

Settings and Design Options

Rich Text Block


In the theme editor(Customize) –> Click "Add section" –> Search section "Rich Text Block" and click to add

Key Highlights

Testimonials


In the theme editor(Customize) –> Click "Add section" –> Search section "Testimonials" and click to add

Premium Shopify Theme - Testimonials

Premium Shopify Theme - Testimonials

Premium Shopify Theme - Testimonials

Premium Shopify Theme - Testimonials

Key Highlights

Text Line


In the theme editor(Customize) –> Click "Add section" –> Search section "Text Line" and click to add

Display store promotion text, collection information or store information

Premium Shopify Theme - Text Line

Instagram


In the theme editor(Customize) –> Click "Add section" –> Search section "Instagram" and click to add

Premium Shopify Theme - Instagram


Instagram Shop


In the theme editor(Customize) –> Click "Add section" –> Search section "Instagram Shop" and click to add

Premium Shopify Theme - Instagram Shop

Newsletter


In the theme editor(Customize) –> Click "Add section" –> Search section "Newsletter" and click to add

Premium Shopify Theme - Newsletter

Video


In the theme editor(Customize) –> Click "Add section" –> Search section "Video" and click to add

Premium Shopify Theme - Instagram Shop

Key Highlights

In the theme editor(Customize) –> Click "Add section" –> Search section "Custom Block" and click to add -> Add block "Video"

Blog List


In the theme editor(Customize) –> Click "Add section" –> Search section "Blog List" and click to add

Premium Shopify Theme - Blog List

Logo List


In the theme editor(Customize) –> Click "Add section" –> Search section "Logo List" and click to add

Premium Shopify Theme - Logo List

Map


In the theme editor(Customize) –> Click "Add section" –> Search section "Map" and click to add

Premium Shopify Theme - Map

Custom Block


In the theme editor(Customize) –> Click "Add section" –> Search section "Custom Block" and click to add

Premium Shopify Theme - Custom Block

Custom Block(Masonry)


In the theme editor(Customize) –> Click "Add section" –> Search section "Custom Block(Masonry)" and click to add

Premium Shopify Theme - Map

Themes Settings


In the theme editor(Customize) –> Click "Theme settings" icon –>

All global theme settings listed here

Layout Style


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Layout Style"

Key Highlights

General Settings


In the theme editor(Customize) –> Click "Theme settings" –> Locate "General Settings"

Key Highlights

Fonts, Colors and Styles


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Fonts, Colors and Styles"

Key Highlights

Top Promotion Bar


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Top Promotion Bar"

Products Grid


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Products Grid"

This is global product grids's settings. These settings will be overwrite by individual section's grid settings

Product Page


With the Avone 5.0 version, product pages are now available with blocks. You can add different blocks to the products page and drag and drop blocks to redesign the product layout.
There is no longer a need to ask the support team to relocate any elements on the product page. Now you can craft desire product page layout by yourself.

Step 1:

In the theme editor(Customize) –> Select "Products -> Default Product" from top dropdown menu –> Locate "Product Page"

Key Highlights

Step 2:

In the theme editor(Customize) –> Click "Theme settings" –> Locate "Product Page"

Key Highlights

Currency & Language


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Currency & Language"

  • Enable currency conversion :

    Select to show the currencies on store

  • Format :

    There are 2 options: Without Currency, Ex: $10 and With Currency, $10 CAD

  • Supported currencies:

    Add the currencies, seperated by the space.

  • Default currency:

    Enter the currency you want to set the default for your store

Product Notification


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Product Notification Popup"

Show live stream of products to your customers if anyone likes or bought product..

Quickview Popup


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Quickview "

Newsletter


In the theme editor(Customize) –> Click "Theme settings" –> Locate "Newsletter"

Newsletter Popup Preview

Social Media


  • Social sharing options :

    Select to show social sharing on store

  • Social accounts :

    Enter url social accounts which you want to show on store else leave blank

Checkout


You can do settings for Banner , Logo , Main Content Area , Order Summary , Typography and Colors of Checkout Page

Collection Page



Setup Collection Page   


In the theme editor –> Select "Collections -> Default collection" from top dropdown menu -> Click Collection pages (section on right sidebar)

We have included several options for displaying the collection page, including the ones listed below.

  1. Page Header (Banner)
  2. Page Sidebar
  3. Products (Main)

Products


There are many options and features available to customise the look of products(collection page).

Filters by Product Tags


Watch Video


Product Filtering is built using tags of shopify. Tags are case sensitive. So if you have enter tags in small letter in sidebar assign same tags in small to product also.
In your store you can see Product filtering on top of left sidebar of collection page (As Product Filters)

There are unlimited filters available for your products using tag based filters.

Step 1 :

From Theme editor(Customize) –> Scroll down to "Custom Colors" section

Add all custom colors to be used for product filters. i.e. Sage, Olive Green, Camel etc...

Step 2 :

From Theme editor(Customize) –> Open the drop-down menu at the top of the page –> Collections –> Default collection

Click Collection pages from sidebar

Follow below steps for Color filters

  1. Click "Add block" -> Add "Filter By Colors"

  2. Add Filter by section title and Filter tags. Select Swatch Size and Swatch Style from dropdown.

  3. From your store admin -> Click "Products" -> Click any product -> Scroll down to "Tags" block.

    In Tags sections, Start adding same tags that you enter in sidebar text block. (You need to assing Only product relavant tags. Tags are different for each products.)


Follow below steps to add other filter type i.e. for size, price, brands, material etc... filters

  1. Click "Add block" -> Add "Filter By"
  2. Add Filter By Title and Filter tags

  3. From your store admin -> Click "Products" -> Click any product -> Scroll down to "Tags" block.

    In Tags sections, Start adding same tag that you enter in sidebar text block. (You need to assing Only product relavant tags. Tags are different for each products.)

Filters Dynamic


Dynamic filters are supported with online store 2.0 theme. When Collection filtering is enabled, the filter options appear on collection page and search result page.
Customers can filter their products by availability, product types, product vendors and Variant options(colors,size,height..)to find the products that interest them the most.

In dynamic filters, you do not need to go through that lengthy and time-consuming process of filter setup.

To Enable products filter on your store, follow below steps


  1. From your Shopify admin, go to Online Store > Navigation.   
  2. Scroll down to Collection filters.
  3. Click the Add filter dropdown menu.
  4. Click Product Options, and then select one or more
      filter options from the list.
  5. Click Save to save your collection filters options.

There are 4 style you can display products filter. Display in Left Sidebar, Right Sidebar, Top Bar, Popup Box

From theme editor(Customize) –> Open the drop-down menu at the top of the page –> Collections –> Default collection

Click on Collection Pages section -> Click "Add block" -> Add "Filters Dynamic"

Click on "Filters Dynamic" block and you will see products filter options on right sidebar.

Product Page


Product Main


Click here to know content settings and Options ->

Product Tabs


From theme editor(Customize) –> Open the drop-down menu at the top of the page –> Products –> Default product

From Left sidebar, Click on Product Tab -> click Add block

Related Products


From Theme editor(Customize) –> Open the drop-down menu at the top of the page –> Products –> Default product

Click onRelated products section from left sidebar

Recommended Products


From Theme editor(Customize) –> Open the drop-down menu at the top of the page –> Products –> Default product

Click on Recommended Products section from left sidebar

Recently Viewed Products


From Theme editor(Customize) –> Click Customize –> Open the drop-down menu at the top of the page –> Products –> Default product

Click on Recently Viewed Products section from left sidebar

Product Swatches


Watch Video  


We advise reading and familiarizing yourself with the Shopify Variants. It is an extremely well written and easy to understand.

There are many styles to display product swatches

Step 1:

From your shopify store admin –> Click Products –> Click Add Product –>

Step 2:

Enter product title, add product images, add product tags, other details.

Now scroll down to Variants box and click on Add Variant

Step 3 (Optional) :

When you select Color Swatch style to display product swatches and products have 2 color to display as product swatch then add color images from Custom Color Sections.

From Theme editor(Customize) –> Scroll down to Custom Colors section -> Add Color

Color name and Variant name must be same

Product Preorder


Product Pre-Order allows you to sale your items even if products are out of stock on your store.

Step 1 :

From your Shopify admin, click Products and select product you want to manage for pre order

Select "Continue selling when out of stock" and click save

Step 2 :

From your Shopify admin -> Click Settings –> Payments.

Find Payment capture Click on Manage button -> Select "Manually capture payment for orders." and click save.

Translations


From your store admin -> Click Online Store –> Locate Theme you want to edit and click on Edit defaul theme content

From the list of themes, click on the button with three dots for the theme you are working on. Click on Edit theme default content.

Here's a quick way to change some of the more commonly text or you can use other language

Credits


  1. jQuery Library
  2. Google Maps
  3. Slick Carousel
  4. Masonry

Images

  1. Pixabay
  2. freepik
  3. 123RF

Note: All images are just used for Demo Purpose Only. They are not part of the theme and NOT included in the final purchase files.

Theme Support


We did our best to make theme documentation as clear as possible. However, if you have any issues with our theme or any suggestions on theme or documentation,
please Feel free to submit a ticket at http://www.adornthemes.com/support/. We are happy to help you!

We also recommend you to read our item support page and visit our theme knowledgebase