The installing is easy and quick. Shopify support auto installation with a single click. Only need select theme package and wait a min, then publish and customize the Theme.
Requirements before setup
After purchase and download the theme package from Themeforest.net, you will have downloaded package themeforest-hsF6yyMR-maxmin-dropshipping-aliexpress-clone-shopify-theme-super-fast-sections-frontpage-builder.zip
Extract/unzip the downloaded package file.
You will have the SP_Maxmin_Mainfiles_V5.x.x folder (with x is sub-version number). Enter this folder you will see:
On the Themes page, will display all Shopify themes that installed.
In Theme library section, click to Add theme button, then select Upload zip file
In the Upload theme popup, click to Add file button
Browser to the downloaded theme package and select theme package that you want install.
Click to Upload button, Shopify will auto upload and install the package.
When the loading icon stop, that meant the Installation completed. Click to the Actions link and select Publish
The Publish Build popup will appear, then click to Publish
The theme will appear in the Current theme as Live theme of your store.
Video Installation
Troubleshooting
Installation take error
Error: After select theme package and click Upload button, it show the error message: zip does not contain a valid theme: missing template "layout/theme.liquid", missing template "templates/index.liquid", missing template "templates/collection.liquid", missing template "templates/product.liquid", missing template "templates/page.liquid", missing template "templates/cart.liquid", and missing template "templates/blog.liquid"
Solution: Due to you don't extract the downloaded package. Try read again the guide Requirements before setup
Installation take error with right Theme package
Error: Still can not install the Theme even select the right theme package inner Theme packages folder.
Solution: Please make sure that you install the theme package into Shopify store
The "Upload zip file" button disabled
Error: like can not click to upload and install the theme.
Solution: Shopify limit install 20 themes into the site. You will also see the notification in the top of page.
Apps Instllation
There are a lot of Shopify Apps released. So, we can not install all of they and test to make they work right in our theme. So, we will NOT warrant our theme will work right 100% in all Shopify Apps!
Here is the listing Apps that used or tested in the theme:
This is free App and developed by Shopify, so we recommend this app to create the review function. The simplest way to share your customers' experiences.
The App has Free plan. Find products to sell on Shopify. This is awesome App, it helps import and control products from AliExpress site. It's the best solution to create the Dropshipping site.
From Your Shopify AdminOnline StoreThemes . Here is area that you can control the theme style.
Theme page have 2 areas:
Live theme: display the Publish Theme.
Theme Library: listing all draft themes. New theme install will appear here.
Click to Customize button of the Publish or Draft theme to edit. The Customize page appear look like:
There are 6 group area:
Left Panel: listing all sections of the viewing page.
Theme Settings: listing all general settings.
View page: you can select the page to control.
Helpful tools: include Responsive view (Desktop, Mobile, Full Width), Change history, Save button.
Right Panel: dislay all settings that you pick in the Left Pabel. In the small view, this panel don't appear.
Main content: Real view site content. Some settings need wait to reload complete to update new.
Theme Settings
The Theme settings is where you’ll be able to make global changes to your store or sections, including text and background color changes, typography selection, and more. All settings will appear in the Right sidebar after you click to Theme settings text at the bottom of Left Sidebar.
CustomizeTheme Settings (2)Right Panel (5)
These group settings of the Theme Settings inclide (click to title to read):
The group include a lot of Color options use to change the color style of the theme. Each color option have the description which area it will change to. Color option support color picker will easily to pick the idea color.
Group Colors settings include color options:
Colors General
Colors Header
Navigation
SlideShow
Colors Newletter
Product
Button general
Button general hover
Colors Footer
Easy to change the color by click to the Color and pick the value that you want.
Typography
Pick the Font that you want use.
General Settings
Listing all options to enable/disable the Theme functions.
Product Item
Listing all options to control elements related to Product elements.
options include:
Product labels
Promotion label: From Product Item, you can config the Promotion labels by inputting the syntax -[percent]% and changing the label color.
This label will auto-set when a product has a special price. Leave the "Promotion label text" empty to disable this label.
Other labels: such as Hot, New, Best,...
Please follow these steps:
- Step #1: From Your Shopify AdminSettingsMetafieldsProducts
- Step #2: click to top/right Add Definition button, then input new field value:
Name:Product labels
Description:Product labels
Select content type:JSON
- Step #3: From Your Shopify AdminProductsAll Products
- Step #4: select the product that you want show label, then scroll down to Metafields area.
- Step #5: In Product labels row, input the JSON bundle syntax value:
[
{
"text": "Hot",
"color": "#fea348"
},
{
"text": "New",
"color": "#84d8e3"
}
]
Replace the Text and Color value that you want for these labels.
- Result:
Quick View Settings
Listing all options to control the Quickview popup.
options include:
Product Options - Filters
Listing all options to control the Filter.
Options Mapping
Option is the setting for the type of product option in Detail page.
There are 5 type:
Image
Color
Size
Dropdown
Radio
Syntax is: product_option_name : type | other_product_option_name : type
Example:
your product option is Color and you want set it display variant as color box, you need input Color:color
your product option is Color and you want set it display variant as image, you need input Color:image
Title variant show Colors
Option to set the color text in your language.
Colors Mapping
Option is the setting for the custom color (hex color) of variant in Filter (Collection Page)).
Syntax is: color_name : color_hex_code | color_name : color_hex_code
Example: you have custom color called Crimson and want set the hex color #DC143C for it. You need input Crimson:#DC143C
Article Item
Listing all options to control the Article item.
My Account Page
Listing all options to control the Account page.
Social Media
Listing all options to control the Social icons.
Favicon
Listing option to upload the Favicon.
Currency Format
You also can control the Currency code in here such as USD, EUR,...
Maxmin theme support to show multi currencty, to have it need follow these steps:
From Your Shopify AdminSettingsGeneral Payment
Select the Payment method that you are using
Scroll down to Countries/regions area
Add Countries that you want your store support.
Checkout
This settings use to Customize the Checkout page. This option automatically render by Shopify. Because the Checkout page was controlled by Shopify. They only allow the field to custom the page such as upload Logo, change font, color,... these fields can not change.
Actions function of Live Theme
There are 6 actions function:
View: view the live/publish theme as your customer view.
Rename: change theme name package.
Duplicate: clone this theme package.
Download theme file: Download the theme to your email.
Edit code: you can edit the theme code. Please take care when you change anything here. Because your change can make the site or the theme function broken. You need Duplicate as the backup before editing code. Here is the danger zone.
Edit Language: change the theme language to other language.
Actions function of Draft Theme
There are 8 actions function:
Preview: view the this theme as draft view.
Publish: set this theme as Live theme.
Rename: change theme name package.
Duplicate: clone this theme package.
Download theme file: Download the theme to your email.
Edit code: you can edit the theme code. Please take care when you change anything here. Because your change can make the site or the theme function broken. You need Duplicate as the backup before editing code. Here is the danger zone.
Edit Language: change the theme language to other language.
You can change the Title Categories in the CustomizeHeaderCategories Setting
Setup the Categories listing also in the CustomizeHeaderCategories Setting. You need create the new Navigation (Menu) that include all Categories first, then pick it the setting.
Result:
Left Categories: icon
Under the Header sectionIcon Category
Upload the normal and hover icon for each Category Menu. These icons will show with Menu position. That means, the 1st icon will be used for the 1st menu, 2nd icon will be used for the 2nd menu,...
Result:
Left Categories: Mega menu
Maxmin 5.0.0 support all Categories Menu become Mega menu dorpdown with 1-6 columns.
Important Notice
The settings don't create a new menu and activate as a Mega menu. It only sets the existing menu to have a Mega menu dropdown.
Edit the existed Mega menu: Under the Header sectionSub Category that you want edit.
Or setup new Category have Mega menu dropdown: Under the Header sectionAdd blockSub Category
The Right sidebar will list all settings use to setup Sub Category as the Mega menu.
Target: You need input right the name of Menu (case-sensitive) that you want set have Mega menu dropdown
Example, you want set the existed menu Women's Fashion have Mega menu dropdown, you need input Women's Fashion
Number of column: set the colum that you want, range from 1 to 6.
1st Column: Menu heading: Heading of Column
1st Column: Menu links: Select the Menu for 1st column
Tips: Show multi level as our live demo
Only need create the Menu with sub-menu
The same for 2nd, 3rd, 4th, 5th 6th column content (below settings).
2nd Column: Menu heading: Heading of Column
2nd Column: Menu links: Select the Menu for 2nd column
3rd Column: Menu heading: Heading of Column
3rd Column: Menu links: Select the Menu for 3rd column
4th Column: Menu heading: Heading of Column
4th Column: Menu links: Select the Menu for 4th column
5th Column: Menu heading: Heading of Column
5th Column: Menu links: Select the Menu for 1st column
6th Column: Menu heading: Heading of Column
6th Column: Menu links: Select the Menu for 6th column
Main menu
CustomizeHeader sectionMenu Setting Select the Menu that you want show as Main menu (Horizontal).
Setup Mega menu
Important Notice
The settings don't create a new menu and activate as a Mega menu. It only sets the existing menu to have a Mega menu dropdown.
Edit the existed Mega menu: Under the Header sectionSub Menu that you want edit.
Or setup new Menu have Mega menu dropdown: Under the Header sectionAdd blockSub Menu
The Right sidebar will list all settings use to setup the Sub Menu as Mega menu.
Target: You need input right the name of Menu (case-sensitive) that you want set have Mega menu dropdown
Example, you want set the existed menu Home have Mega menu dropdown, you need input Home
Background: setup the Mega menu background.
Group 1st Column Setting: use to setup 1st column content
Input the Column Title and the Width Grid for this column content. Content of column include:
- Menu links
- Product heading
- Product
- Article
- HTML Block/content
Group 2nd Column Setting: use to setup 2nd column content
Group 3rd Column Setting: use to setup 3rd column content
Group 4th Column Setting: use to setup 4th column content
Group 5th Column Setting: use to setup 5th column content
Group 6th Column Setting: use to setup 6th column content
Example #1: Setup the Home menu have the Mega menu dropdown with 4 columns are Images
Target: Input Home
1st Column Setting:
- 1st Column: Enable: check to enable.
- 1st Column: Width: set 1/4
- 1st Column: HTML Block: Input HTML Image and Link content. Example: <a href="#" class="col-image"><img src="https://via.placeholder.com/350x500" alt=""></a><div class="col-title">STORE 1</div>
2nd Column Setting:
- 2nd Column: Enable: check to enable.
- 2nd Column: Width: set 1/4
- 2nd Column: HTML Block: Input HTML Image and Link content. Example: <a href="#" class="col-image"><img src="https://via.placeholder.com/350x500" alt=""></a><div class="col-title">STORE 2</div>
3rd Column Setting:
- 3rd Column: Enable: check to enable.
- 3rd Column: Width: set 1/4
- 3rd Column: HTML Block: Input HTML Image and Link content. Example: <a href="#" class="col-image"><img src="https://via.placeholder.com/350x500" alt=""></a><div class="col-title">STORE 3</div>
4th Column Setting:
- 4th Column: Enable: check to enable.
- 4th Column: Width: set 1/4
- 4th Column: HTML Block: Input HTML Image and Link content. Example: <a href="#" class="col-image"><img src="https://via.placeholder.com/350x500" alt=""></a><div class="col-title">STORE 4</div>
Screenshot:
Example #2: Setup the All Collections menu have the Mega menu dropdown with 3 columns are Menu and 1 column as Product.
Target: Input All Collections
1st Column Setting:
- 1st Column: Enable: check to enable.
- 1st Column: Width: set 1/4
- 1st Column: Menu heading: Input Title such as Fashions
- 1st Column: Menu links: Select the Menu that you want show.
2nd Column Setting:
- 2nd Column: Enable: check to enable.
- 2nd Column: Width: set 1/4
- 2nd Column: Menu heading: Input Title such as Electronics
- 2nd Column: Menu links: Select the Menu that you want show.
3rd Column Setting:
- 3rd Column: Enable: check to enable.
- 3rd Column: Width: set 1/4
- 3rd Column: Menu heading: Input Title such as Home & Garden
- 3rd Column: Menu links: Select the Menu that you want show.
4th Column Setting:
- 4th Column: Enable: check to enable.
- 4th Column: Width: set 1/4
- 4th Column: Product: Select Product that you want show.
Screenshot:
Example #3: Setup the Shop Layout menu have the Mega menu dropdown with 3 columns are Menu.
Target: Input Shop Layout
1st Column Setting:
- 1st Column: Enable: check to enable.
- 1st Column: Width: set 1/3
- 1st Column: Menu heading: Input Title such as Collection Styles
- 1st Column: Menu links: Select the Menu that you want show.
2nd Column Setting:
- 2nd Column: Enable: check to enable.
- 2nd Column: Width: set 1/3
- 2nd Column: Menu heading: Input Title such as Product Styles
- 2nd Column: Menu links: Select the Menu that you want show.
3rd Column Setting:
- 3rd Column: Enable: check to enable.
- 3rd Column: Width: set 1/3
- 3rd Column: Menu heading: Input Title such as Product Types
- 3rd Column: Menu links: Select the Menu that you want show.
Screenshot:
Example #4: Setup the Pages menu have the Mega menu dropdown with 2 columns are Menu and 1 Custom text, include Background image.
Target: Input Pages
Background: Upload Background image.
1st Column Setting:
- 1st Column: Enable: check to enable.
- 1st Column: Width: set 1/3
- 1st Column: Menu heading: we don't input to disable Title
- 1st Column: Menu links: Select the Menu that you want show.
2nd Column Setting:
- 2nd Column: Enable: check to enable.
- 2nd Column: Width: set 1/3
- 2nd Column: Menu heading: we don't input to disable Title
- 2nd Column: Menu links: Select the Menu that you want show.
3rd Column Setting:
- 3rd Column: Enable: check to enable.
- 3rd Column: Width: set 1/3
- 3rd Column: HTML Block: Input HTML Image and Link content. Example: <div class="dis_table"><div class="dis_tablecell"><div class="col-caption"><span class="title">COME& DISCOVER</span><span class="content">THE NEW STYLE </span></div><a class="_btn" href="#">SHOP NOW</a></div></div>
Screenshot:
Example #5: Setup the Blog menu have the Mega menu dropdown with 2 columns are Menu and 2 Articles.
Target: Input Blog
1st Column Setting:
- 1st Column: Enable: check to enable.
- 1st Column: Width: set 1/4
- 1st Column: Menu heading: we don't input to disable Title
- 1st Column: Menu links: Select the Menu that you want show.
2nd Column Setting:
- 2nd Column: Enable: check to enable.
- 2nd Column: Width: set 1/4
- 2nd Column: Menu heading: we don't input to disable Title
- 2nd Column: Menu links: Select the Menu that you want show.
3rd Column Setting:
- 3rd Column: Enable: check to enable.
- 3rd Column: Width: set 1/4
- 3rd Column: Article: select the Article.
4th Column Setting:
- 4th Column: Enable: check to enable.
- 4th Column: Width: set 1/4
- 4th Column: Article: select the Article.
Screenshot:
Example #5: Setup the Contact us menu have the simple Dropdown menu.
It's not Mega menu, so don't need setup Sub Menu. Only need create in the Navigation
Screenshot:
Important Notice
Megamenu option priority is higher than the Simple Dropdown menu.
Footer
From Sections listing of Customize (Theme Editor)Footer Delivery section or Footer Bottom section
Footer Delivery
From Sections listing of Customize (Theme Editor)Footer Delivery section
Section setting: select the Display mode (Desktop or Mobile or both).
Block Content: listing all blocks element. To add more, you can click to Add item.
Click to block element to edit. Include: upload icon, Heading text, Subtext and Responsive width.
Footer Bottom
From Sections listing of Customize (Theme Editor)Footer Bottom section
Section setting:
Menu Footer: bottom Menu link, above the Copyright text.
Payment methods: listing all payment that available in your store.
Hot Keywords: input the Title and pick Menu to show the links.
Block Content: listing all blocks element. To add more, you can click to Add block.
There are 2 block type: Link List and Newsletter & Social
Link List: use tos show links. Option include: Heading, Select link list and Responsive Width.
Newsletter & Social: use tos Newsletter form and social media links. Option include:
- Newsletter: Active, Heading, Subtext, Mailchimp action URL, placeholder text and Action text.
- Social media icons: Active, Heading and Responsive Width. You also need go to Social Media to setup which social will appear.
Cookies bar
From Sections listing of Customize (Theme Editor)Cookies bar section
In Cookies Bar section, you can change the Text, Timer and Color settings.
- Please make sure that the Customize view page is Home page. So that it will list all Home page sections (include in theme package) in the Left area.
- With the new Shopify Online Store 2.0 you can use these sections in the Inner pages.
- You also can click to Add section to add more sections. But you can not add/use the sections of Homepage #1 to another Homepage.
From Sections listing of Customize (Theme Editor)Slideshow & Categories section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Categories Setting: input the Title and pick Menu showing in the left.
Slideshow Settings: settings to control the Slideshow in the middle.
- Slide effect
- Auto-rotate slides
- Change slides every
- Slide size
- Navigation and Pagination options.
Banner Settings: upload the images and link of 2 right banners.
Screenshot
Under Slideshow & Categories will list all blocks content of Categories Icon & Mega menu and Slide images. You also can click to Add block to add more content.
Left Categories
There are 1 block type use for Left Categories is Sub Category can add more and Icon Category can not add more.
Icon Category: use to control these icons appear in the menu in Left Categories. Read more here
Sub Category: use to setup the Mega menu of the menu in Left Categories. Read more here
Slideshow content
There are 3 block type use for Slideshow content
Image slide: setup the Slide as Image.
- Slide Background (Desktop): upload image for slide.
- Slide link, Captions Entrances Effect and Captions Exits Effect.
- Title: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Description: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Action: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #1: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #2: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #3: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #4: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #5: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #6: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
Video Youtube: setup the Slide as Video from Youtube. Need input the Youtube link into the Video link and Autoplay
Video Files: setup the Slide as Video from your file.
- From Admin Shopify DashboardSettingsFilesUpload files and select your local Video file Copy link of video just uploaded.
- Paste the link into Video link files
- Set Autoplay
- Input Image Loader
Banner Grid
From Sections listing of Customize (Theme Editor)Banner Grid section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Image size: settings to control the image re-size.
- Natural
- Square (1:1)
- Landscape (4:3)
- Slide size
- Portrait (2:3)
Under Banner Grid will list all banners, click to edit. You also can click to Add Banner to add more.
Settings for each banner element:
Upload image
Link of image
Responsive width options (6 range value from Wide Desktop to Mobile)
Best Sellers
From Sections listing of Customize (Theme Editor)Best Sellers section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Daily Deals: settings to control the left Deals Product.
- Active
- Heading
- Upload icon
- Color border bottom link
- Select display Product
- Timer (Syntax YYYY/MM/DD HH:MM:SS)
Best seller: settings to control the right Products grid.
- Active
- Heading
- Upload icon
- Color border bottom link
- Select collection to display Products
- Limit showing
- Responsive width options (6 range value from Wide Desktop to Mobile)
Collection Tab
From Sections listing of Customize (Theme Editor)Collection Tab section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
General settings: control the section content
- Heading
- Upload icon
- Color border bottom link
- Limit showing
Slider Settings: control the slider
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Banners Settings: upload banners for 2 banners under Title. These banners will show for all Tabs, not change when you change to another tab.
- Show banner
- Banner 1: Upload image
- Banner 1: Link to
- Banner 2: Upload image
- Banner 2: Link to
Under Collection Tab will list all Tab, click to edit. You also can click to Add Tab to add more.
Settings for each Tab element:
Heading
Select collection to show products
Categories
From Sections listing of Customize (Theme Editor)Categories section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
General settings: control the section content
- Heading
- Upload icon
- Color border bottom link
Slider Settings: control the slider
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Under Categories will list all Categories, click to edit. You also can click to Add Category to add more.
Settings for each Category element:
Heading
Upload image
Image width
Select menu to display in bottom
List Blogs
From Sections listing of Customize (Theme Editor)List Blogs section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
General settings: control the section content
- Heading
- Upload icon
- Color border bottom link
- Select Blog to show Articles
- Limit article show
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
- Please make sure that the Customize view page is Home page. So that it will list all Home page sections (include in theme package) in the Left area.
- With the new Shopify Online Store 2.0 you can use these sections in the Inner pages.
- You also can click to Add section to add more sections. But you can not add/use the sections of Homepage #2 to another Homepage.
From Sections listing of Customize (Theme Editor)Slideshow & Categories section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Categories Setting: input the Title and pick Menu showing in the left.
Slideshow Settings: settings to control the Slideshow in the middle.
- Slide effect
- Auto-rotate slides
- Change slides every
- Slide size
- Navigation and Pagination options.
Daily Deal Settings: settings for right product.
- Set active this block
- Heading
- Upload icon
- Color border
- Select product
- Timer
Screenshot
Under Slideshow & Categories will list all blocks content of Categories Icon & Mega menu and Slide images. You also can click to Add block to add more content.
Left Categories
There are 1 block type use for Left Categories is Sub Category can add more and Icon Category can not add more.
Icon Category: use to control these icons appear in the menu in Left Categories. Read more here
Sub Category: use to setup the Mega menu of the menu in Left Categories. Read more here
Slideshow content
There are 3 block type use for Slideshow content
Image slide: setup the Slide as Image.
- Slide Background (Desktop): upload image for slide.
- Slide link, Captions Entrances Effect and Captions Exits Effect.
- Title: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Description: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Action: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #1: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #2: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #3: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #4: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #5: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #6: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
Video Youtube: setup the Slide as Video from Youtube. Need input the Youtube link into the Video link and Autoplay
Video Files: setup the Slide as Video from your file.
- From Admin Shopify DashboardSettingsFilesUpload files and select your local Video file Copy link of video just uploaded.
- Paste the link into Video link files
- Set Autoplay
- Input Image Loader
Banner Grid
From Sections listing of Customize (Theme Editor)Banner Grid section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Image size: settings to control the image re-size.
- Natural
- Square (1:1)
- Landscape (4:3)
- Slide size
- Portrait (2:3)
Under Banner Grid will list all banners, click to edit. You also can click to Add block to add more.
There are 2 Banner type: One banner and Two banners. Settings for each banner element:
Upload image
Heading
Subheading
Link of image
Set position for caption: Top/Middle/Bottom
Set style for caption: Style1/Style2/Style3
Responsive width options (6 range value from Wide Desktop to Mobile)
Collection Slider
From Sections listing of Customize (Theme Editor)Collection Slider section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Heading
Action
Upload icon
Color border
Select collection to display Products
Limit products show
Slider settings
Responsive width options (6 range value from Wide Desktop to Mobile)
Collection Tab
From Sections listing of Customize (Theme Editor)Collection Tab section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
General settings: control the section content
- Heading
- Upload icon
- Color border bottom link
- Limit showing
Slider Settings: control the slider
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Banners Settings: upload image for right banners. This banner will show for all Tabs, not change when you change to another tab.
- Show banner
- Upload image
- Link to
Under Collection Tab will list all Tab, click to edit. You also can click to Add Tab to add more.
Settings for each Tab element:
Heading
Select collection to show products
Categories
From Sections listing of Customize (Theme Editor)Categories section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
General settings: control the section content
- Heading
- Upload icon
- Color border bottom link
Slider Settings: control the slider
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Under Categories will list all Categories, click to edit. You also can click to Add Category to add more.
Settings for each Category element:
Heading
Upload image
Image width
Select menu to display in bottom
List Blogs
From Sections listing of Customize (Theme Editor)List Blogs section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
General settings: control the section content
- Heading
- Upload icon
- Color border bottom link
- Select Blog to show Articles
- Limit article show
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
- Please make sure that the Customize view page is Home page. So that it will list all Home page sections (include in theme package) in the Left area.
- With the new Shopify Online Store 2.0 you can use these sections in the Inner pages.
- You also can click to Add section to add more sections. But you can not add/use the sections of Homepage #3 to another Homepage.
From Sections listing of Customize (Theme Editor)Slideshow & Categories section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Background Color
Categories Setting: input the Title and pick Menu showing in the left.
Slideshow Settings: settings to control the Slideshow in the middle.
- Slide effect
- Auto-rotate slides
- Change slides every
- Slide size
- Navigation and Pagination options.
Screenshot
Under Slideshow & Categories will list all blocks content of Categories Icon & Mega menu and Slide images. You also can click to Add block to add more content.
Left Categories
There are 1 block type use for Left Categories is Sub Category can add more and Icon Category can not add more.
Icon Category: use to control these icons appear in the menu in Left Categories. Read more here
Sub Category: use to setup the Mega menu of the menu in Left Categories. Read more here
Slideshow content
There are 3 block type use for Slideshow content
Image slide: setup the Slide as Image.
- Slide Background (Desktop): upload image for slide.
- Slide link, Captions Entrances Effect and Captions Exits Effect.
- Title: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Description: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Action: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #1: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #2: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #3: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #4: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #5: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #6: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
Video Youtube: setup the Slide as Video from Youtube. Need input the Youtube link into the Video link and Autoplay
Video Files: setup the Slide as Video from your file.
- From Admin Shopify DashboardSettingsFilesUpload files and select your local Video file Copy link of video just uploaded.
- Paste the link into Video link files
- Set Autoplay
- Input Image Loader
Banner Grid
From Sections listing of Customize (Theme Editor)Banner Grid section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Background color
Image size: settings to control the image re-size.
- Natural
- Square (1:1)
- Landscape (4:3)
- Slide size
- Portrait (2:3)
Under Banner Grid will list all banners, click to edit. You also can click to Add block to add more.
There are 2 Banner type: One banner and Two banners. Settings for each banner element:
Upload image
Heading
Subheading
Link of image
Set position for caption: Top/Middle/Bottom
Set style for caption: Style1/Style2/Style3
Responsive width options (6 range value from Wide Desktop to Mobile)
Best Sellers
From Sections listing of Customize (Theme Editor)Best Sellers section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Daily Deals: settings to control the left Deals Product.
- Active
- Heading
- Upload icon
- Color border bottom link
- Select display Product
- Timer (Syntax YYYY/MM/DD HH:MM:SS)
Best seller: settings to control the right Products grid.
- Active
- Heading
- Upload icon
- Color border bottom link
- Select collection to display Products
- Limit showing
- Responsive width options (6 range value from Wide Desktop to Mobile)
Collection Tab
From Sections listing of Customize (Theme Editor)Collection Tab section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
General settings: control the section content
- Heading
- Upload icon
- Color border bottom link
- Limit showing
Slider Settings: control the slider
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Under Collection Tab will list all Tab, click to edit. You also can click to Add Tab to add more.
Settings for each Tab element:
Heading
Select collection to show products
Collection Column
From Sections listing of Customize (Theme Editor)Collection Column section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Collection setting
- Limit products show
Slider Settings: control the slider
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Under Collection Column will list all Category columns, click to edit. You also can click to Add Column (limit 4 columns) to add more.
Settings for each Category column:
Heading
Upload icon
Color border
Select collection to show products.
Collection & Blog
From Sections listing of Customize (Theme Editor)Collection & Blog section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Collection settings: control the left products slider
- Set active this block
- Heading
- Upload icon
- Color border bottom link
- Select collection to show products
- Limit products show
- Slider settings
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Blog: control the right blog
- Set active this block
- Heading
- Upload icon
- Color border bottom link
- Select blog to show article
- Limit article show
- Slider settings
- Please make sure that the Customize view page is Home page. So that it will list all Home page sections (include in theme package) in the Left area.
- With the new Shopify Online Store 2.0 you can use these sections in the Inner pages.
- You also can click to Add section to add more sections. But you can not add/use the sections of Homepage #4 to another Homepage.
From Sections listing of Customize (Theme Editor)Slideshow & Categories section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Slideshow Settings: settings to control the Slideshow in the middle.
- Slide effect
- Auto-rotate slides
- Change slides every
- Slide size
- Navigation and Pagination options.
Screenshot
Under Slideshow will list all blocks content of Slide images. You also can click to Add block to add more content.
There are 3 block type use for Slideshow content
Image slide: setup the Slide as Image.
- Slide Background (Desktop): upload image for slide.
- Slide link, Captions Entrances Effect and Captions Exits Effect.
- Title: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Description: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Action: Text, style (Dask or Light) and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #1: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #2: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #3: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #4: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #5: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
- Caption Image #6: upload caption image and percent position (x,y) (value from 1%-100%) of this text with the golbal Slide size.
Video Youtube: setup the Slide as Video from Youtube. Need input the Youtube link into the Video link and Autoplay
Video Files: setup the Slide as Video from your file.
- From Admin Shopify DashboardSettingsFilesUpload files and select your local Video file Copy link of video just uploaded.
- Paste the link into Video link files
- Set Autoplay
- Input Image Loader
Tips: You can set different Slideshows for Desktop and Mobile screen views.
Need set Display on option suitable with your idea.
Banner Grid
From Sections listing of Customize (Theme Editor)Banner Grid section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Image size: settings to control the image re-size.
- Natural
- Square (1:1)
- Landscape (4:3)
- Slide size
- Portrait (2:3)
Under Banner Grid will list all banners, click to edit. You also can click to Add block to add more.
There are 2 Banner type: One banner and Two banners. Settings for each banner element:
Upload image
Heading
Subheading
Link of image
Set position for caption: Top/Middle/Bottom
Set style for caption: Style1/Style2/Style3
Responsive width options (6 range value from Wide Desktop to Mobile)
Collection Slider
From Sections listing of Customize (Theme Editor)Collection Slider section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Heading
Color border
Select collection to display Products
Limit products show
Slider settings
Responsive width options (6 range value from Wide Desktop to Mobile)
Collection Column
From Sections listing of Customize (Theme Editor)Collection Column section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Collection setting
- Limit products show
Slider Settings: control the slider
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Under Collection Column will list all Category columns, click to edit. You also can click to Add Column (limit 4 columns) to add more.
Settings for each Category column:
Heading
Color border
Select collection to show products.
Collection & Blog
From Sections listing of Customize (Theme Editor)Collection & Blog section. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Collection settings: control the left products slider
- Set active this block
- Heading
- Upload icon
- Color border bottom link
- Select collection to show products
- Limit products show
- Slider settings
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Blog: control the right blog
- Set active this block
- Heading
- Upload icon
- Color border bottom link
- Select blog to show article
- Limit article show
- Slider settings
Static Sections
The section that appears at the bottom of section listing (after Footer sections) and can not delete or add more, will be called Static Sections
Newsletter popup
When you access the site for the first time, you will see the popup with Mail input, it's Newsletter popup
From Sections listing of Customize (Theme Editor)Newsletter popup section. The Right sidebar will list all settings use to setup the this section.
The toggle Product panel appear in the bottom right, it's Notification products
From Sections listing of Customize (Theme Editor)Notification products section. The Right sidebar will list all settings use to setup the this section.
Collection Banner Slider (1)Collection Image (2)Collection Featured Banner (3)
That means:
- If the Collection Banner Slider (1) is enabled, it will only show Banners slider without another banner of Collection Image (2) or Collection Featured Banner (3).
- If the Collection Banner Slider (1) is disabled, and the Collection Image (2) is enabled, it will show the Collection Image without Collection Featured Banner (3).
- If the Collection Banner Slider (1) is disabled, the Collection Image (2) is disabled, and the Collection Featured Banner (3) is enabled, it will show the General Image that you upload in the Setting above.
- If all Collection Banner Slider (1) and Collection Image (2) and Collection Featured Banner (3) are disabled, there is no banner appearing at the top of the Collection page.
Show collection description
Show sub collection: use to show collections listing below the Collection Title.
To showing the sub-collections, you need to create the Menu with the handle syntax is navigation-[handle collection]
Example: If you want create the sub collection for WOMEN'S FASHION
- Step #1: Get the Collection handle. Go to the collection and you will know the handle at the url.
Now we have the handle collection is maxmin-women
- Step #2: Go to Online StoreNavigationAdd menu
+ In the right Handle need input syntax navigation-maxmin-women
+ In the Left Bottom Menu items add Menu with target link to Collection that you want set as sub-collection.
Show view as List/Grid: show the Grid/List selector.
Layout: set the default layout of product listing as Grid or List
Enable result: show the counting products.
Collection Layout
Continue with the Collection template section settings in the Right sidebar, scroll down to Collection Page Layout. Then pick the option to show products per line for 6 break responsive point.
Collection Sorting
Continue with the Collection template section settings in the Right sidebar, scroll down to Sorting. Then check to enable/disable the sorting
Collection Block content
Under the Collection Template will list all blocks content. There are 4 block type that you can add more by click to Add block and 1 fixed block type.
Sidebar - Slider images
This block will use to control the Collection Banners Slider.
Important Notice
- The limit Collection can set up Banner slider is 10 collections.
- Each Banner slider can upload 1 to 5 images.
- Please upload images with the same ratio, such as 900x300 as our live demo.
- This block content can NOT add more than the other 4 block types of Collection block.
Under the Collection Template select Slider images. The Right sidebar will list all settings use to setup the this section.
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
COLLECTION 01: Use to setup the Banner slider for 1st collection.
- Target: you need input the Collection name that you want setup the banners sldier.
- Image 01: upload slide image #1.
- Image 02: upload slide image #2.
- Image 03: upload slide image #3.
- Image 04: upload slide image #4.
- Image 05: upload slide image #5.
COLLECTION 02: Use to setup the Banner slider for 2nd collection.
- Target: you need input the Collection name that you want setup the banners sldier.
- Image 01: upload slide image #1.
- Image 02: upload slide image #2.
- Image 03: upload slide image #3.
- Image 04: upload slide image #4.
- Image 05: upload slide image #5.
The same for COLLECTION 03, COLLECTION 04, COLLECTION 05, COLLECTION 06, COLLECTION 07, COLLECTION 08, COLLECTION 09, COLLECTION 10
Sidebar - Categories listing
This block will use to control the Categories listing in the top of sidebar.
Under the Collection Template select Categories (the exactly name depend on Heading field). The Right sidebar will list all settings use to setup the this section.
Settings include:
Heading: Title block.
Position: select Left Sidebar or Right Sidebar
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Link list: set the Navigation/Menu to show the Categories listing.
You also can add new more Categories by click to Add block and select type is Listing
Sidebar - Filters
This block will use to control the Filter in the sidebar.
Under the Collection Template select Filters. The Right sidebar will list all settings use to setup the this section.
Settings include:
Position: select Left Sidebar or Right Sidebar
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
You also can add new more Filters by click to Add block and select type is Filters
Important Notice
- The Filter of Maxmin 5.x.x version is the auto filter, it will auto get the product variant/options to show the value.
- You can control the group filter at Online StoreNavigationCollection and search filtersAdd filters
Sidebar - Featured products
This block will use to control the Products listing in the sidebar.
Under the Collection Template select Best Sale (the exactly name depend on Heading field). The Right sidebar will list all settings use to setup the this section.
Settings include:
Heading: Title block.
Position: select Left Sidebar or Right Sidebar
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Collection: select Collection to show products
Limit products show
Slider function:
- Enable slide function?
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Enable navigaiton
- Enable pagination
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
You also can add new more Featured products by click to Add block and select type is Featured products
Sidebar - Banner
This block will use to control the Banner in the sidebar.
Under the Collection Template select Banner. The Right sidebar will list all settings use to setup the this section.
Settings include:
Heading: Title block.
Position: select Left Sidebar or Right Sidebar
Display on: Select the screen resolution that you want it appear, include: Desktop or Mobile or both.
Upload banner: upload banner
Link: set the target link.
You also can add new more Banner by click to Add block and select type is Banner
Customize the Layout
With these above settings of the Collection Template section, you can change the layout into different 6 layouts:
Set the Position of all 4 Sidebar blocks: Sidebar - Categories listing, Sidebar - Filters, Sidebar - Featured products ,and Sidebar - Banner to Right sidebar.
Tips: You also can set any Collection directly using the Shop Right Sidebar layout in the Collection Panel area. But this effect will only be changed for the selected collection.
From Admin Shopify DashboardProductsCollections
Select the Collection that you want set
set Theme template (right/bottom area) is right-sidebar
Remove all 4 Sidebar blocks: Sidebar - Categories listing, Sidebar - Filters, Sidebar - Featured products ,and Sidebar - Banner. You also can increase the number of product per line from 4 to 5 in the Collection Page Layout
Result:
Tips: You also can set any Collection directly using the Shop Not Sidebar layout in the Collection Panel area. But this effect will only be changed for the selected collection.
From Admin Shopify DashboardProductsCollections
Select the Collection that you want set
set Theme template (right/bottom area) is not-sidebar
Remove all 4 Sidebar blocks: Sidebar - Categories listing, Sidebar - Filters, Sidebar - Featured products ,and Sidebar - Banner.
Tips: You also can set any Collection directly using the Shop Not Sidebar layout in the Collection Panel area. But this effect will only be changed for the selected collection.
Tips: You also can set any Collection directly using the Shop Not Sidebar layout in the Collection Panel area. But this effect will only be changed for the selected collection.
From Admin Shopify DashboardProductsCollections
Select the Collection that you want set
set Theme template (right/bottom area) is list-sidebar
Set the Position of all 4 Sidebar blocks: Sidebar - Categories listing, Sidebar - Filters, Sidebar - Featured products ,and Sidebar - Banner to Right sidebar.
Tips: You also can set any Collection directly using the Shop Not Sidebar layout in the Collection Panel area. But this effect will only be changed for the selected collection.
From Admin Shopify DashboardProductsCollections
Select the Collection that you want set
set Theme template (right/bottom area) is list-right-sidebar
From Customize (Theme Editor) Select View page or Preview is Collection list
The Collections list template section will appear in the Left sidebar.
Click to Collections list template section , the Right sidebar will list all settings use to setup the Collections listing page.
Select collections to show: select
- All: it will show all collections in your store.
- Selected: in this case you need click to Add Collection that appear under Collections list template section.
Sort collections by: select option
- Product count, high to low
- Product count, low to high
- Alphabetically, A-Z
- Alphabetically, Z-A
- Date, old to new
- Date, new to old
This layout is the default Product detail layout of Maxmin 5.x.x version
From Customize (Theme Editor) Select View page is ProductsDefault Product, or in Preview, select any product in the Customize. The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Sidebar Layout.
Thumbnail position: select None or Leftor Rightor Bottom
Enable zoom image
Enable video looping
Enable navigaiton
Enable pagination
2. Group functions: Rating star, Earn reward points and Size Chart
Rating star: It needs 3rd party Shopify App to work. We recommend Product Review App
You can use any other App but must input the code syntax into the Code rating star field.
Earn reward points: In our demo is a sample demo function. You also need 3rd party Shopify App to work. We recommend Smile: Rewards & Loyalty
Size Chart: It will appear when your product has Size option
- Show size chart
- Title variant show size chart. This is Options Mapping
- Size chart image
- Size chart text
- Size chart URL
Tips: You also create a custom size chart for different products. Such as 1 size chart image for Men, 1 for Women.
- Step #1: From Your Shopify AdminSettingsMetafieldsProducts
- Step #2: click to top/right Add Definition button, then input new field value:
Name:Size Chart
Description:Image Size Chart
Select content type:File
- Step #3: From Your Shopify AdminProductsAll Products
- Step #4: select the product that you want show different Size Chart, then scroll down to Metafields area.
- Step #5: Click to Size Chart row, click Select Image and browse to the Size chart image, then upload it.
3. Group buttons
Settings to control the Dynamic checkout buttons (Buy Now) and Wishlist button.
4. Terms & Conditions
Settings to config the Terms & Conditions.
Show terms & conditions
Heading
Action text
Content popup: select the Page to show popup content.
5. Information area
Shipping infomration: It Shipping information with Deal countdown timer.
- Show shipping infomration
- Shipping date: the theme will count the current date with this date to show the target date.
- Deal time: showing the countdown timer.
FAQs area: This is the Ask us any Question in our live demo. Click to it will show the Contact form.
- Show FAQs
- FAQs heading
Details area: Showing product information
- Show details
- Detail heading
- Show SKU
- Show product vendor
- Show product type
- Show inventory management
Decription area:
- Show product decription
- Description heading
Bundle Products: showing other products that your customer can purchase with the viewing product.
- Show bundle
- Bundle title
To showing other products in bundle, you need follow these steps:
- Step #1: From Your Shopify AdminSettingsMetafieldsProducts
- Step #2: click to top/right Add Definition button, then input new field value:
Name:Product bundle
Description:Product bundle
Select content type:JSON
- Step #3: get products handle of these products that appear in the bundle. You can find the handle at the url/address of product.
For example, we want 3 products have hanle fashion-colorful-floral,neck-flower-embroidery-shirt, and women-vintage-v-neck into Bundle
- Step #4: From Your Shopify AdminProductsAll Products
- Step #5: select the product that you want show above bundle, then scroll down to Metafields area.
- Step #6: In Product bundle row,input the JSON bundle syntax value:
[
{
"handle": "fashion-colorful-floral"
},
{
"handle": "neck-flower-embroidery-shirt"
},
{
"handle": "women-vintage-v-neck"
}
]
Replace the example products handle by your products handle value.
- That's all!
Other information:
- Payment security image
- Show social sharing buttons
6. Left Sidebar
Product detail page also include 4 blocks content in Sidebar as Collection page (not include Sidebar - Slider images):
3 bottom blocks: Product recommendations, Recently viewed, Review (Custom HTML block), and Related Product
These blocks are also a part of blocks content.
Product Recommendations: This is YOU MAY ALSO LIKE block in our live demo.
It displays an automatically-generated list of product recommendations. Detailed here
Under the Product template select YOU MAY ALSO LIKE(the exactly name depend on Heading field). The Right sidebar will list all settings use to setup the this section.
- Heading
- Position
- Display on
- Limit products show
- Slider group settings
- Responsive group settings
Recently viewed: This is RECENTLY VIEWED PRODUCTS block in our live demo.
It displays the recently viewed products. It will display blank when you access the first product.
Under the Product template select RECENTLY VIEWED PRODUCTS(the exactly name depend on Heading field). The Right sidebar will list all settings use to setup the this section.
- Heading
- Position
- Display on
- Limit products show
- Slider group settings
- Responsive group settings
Custom HTML block: This block use to show any custom HTML content. In our live demo, we use to show the Review area.
Under the Product template select CUSTOMER REVIEWS(the exactly name depend on Heading field). The Right sidebar will list all settings use to setup the this section.
- Enable to review
- Position
- Display on
- HTML code: input the review of 3rd party code.
Related Product: If you want the block as YOU MAY ALSO LIKE block, but not auto render products, must show products from the selected collection, you can use this block content.
Under the Product templateAdd blockRelated Products. The Right sidebar will list all settings use to setup the this section.
- Heading
- Position
- Display on
- Limit products show
- Slider group settings
- Responsive group settings
The config and result the same Product recommendations. Currently in our live demo, it appear in the Sidebar as Best Sale block.
1. Setting up the product using Advance Product Type layout
This layout is not active as default for all products. So, You need set products using this layout manually.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Advance Product Type layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is advance
2. Accessing the Advance Product Type layout in Customize
After setup the product using the Advance Product Type layout, you can go to Customize to control the layout settings.
From Customize (Theme Editor) Select View page is Productsadvance
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Product Type Layout
The Advance Product Type layout is the same Product Sidebar Layout, the only difference is the new Choose style: feature. It will display other product's styles with the viewing product.
In this case, we will guide how to active the Choose style: feature. Other settings area (Product image settings, Group functions, Group buttons, Sidebar, Bottom content,... ) please help us read again the guide.
3. Advance Product Type: Choose style feature
From Your Shopify AdminOnline StoreNavigationAdd menu
Input the title and remember the handle in the right.
In Menu items, add a new menu item with Name is Product name will showing in Choose style and the Link must be the link of the target product.
From Your Shopify AdminProductsAll Products, select product above that used Advance Product Type layout
Add new tag value with syntax advance:Navigation_handle
For example, the Navigation above have handle is advance-01, so need tag the tag advance:advance-01 into product
Result:
Tips: How to set the Advance Product Type as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
1. Setting up the product using Group Images Variants layout
This layout is not active as default for all products. So, You need set products using this layout manually.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Group Images Variants layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is groupimages
2. Accessing the Group Images Variants layout in Customize
After setup the product using the Group Images Variants layout, you can go to Customize to control the layout settings.
From Customize (Theme Editor) Select View page is Productsgroupimages
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Group Images Variants Layout
The Group Images Variants layout is the same Product Sidebar Layout, the only difference is only showing images of the selected variant. For example, only show Pink images in the gallery when the Pink variant is selected.
In this case, we will guide how to active the Group Images Variants feature. Other settings area (Product image settings, Group functions, Group buttons, Sidebar, Bottom content,... ) please help us read again the guide.
3. Group Images Variants feature
Requirements
The product must have a Color option
The Color option must have a least 2 variant values.
Product media must have group images for each color
Setup
Click to each Media (Image)
Click to the Add alt text blue text link in the Right Sidebar
Add the image alt with syntax color COLOR_VARIANT_VALUE
For example, you want the image to appear in the listing of Pink color, need to input the tag Color Pink
Click to save alt text
Close the popup and continue for another image.
Tips: How to set the Group Images Variants as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
1. Setting up the product using Product Box layout
This layout is not active as default for all products. So, You need set products using this layout manually.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Box layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is box
2. Accessing the Product Box layout in Customize
After setup the product using the Product Box layout, you can go to Customize to control the layout settings.
From Customize (Theme Editor) Select View page is Productsbox
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Box Layout
The Product Box layout is the same Product Sidebar Layout, the only difference is the layout (no sidebar)
Please help us read again the guide for all layout settings.
Tips: How to set the Product Box as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
1. Setting up the product using Product Group Items layout
This layout is not active as default for all products. So, You need set products using this layout manually.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Group Items layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is groupitems
2. Accessing the Product Group Items layout in Customize
After setup the product using the Product Group Items layout, you can go to Customize to control the layout settings.
From Customize (Theme Editor) Select View page is Productsgroupitems
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Group Items Layout
The Product Group Items layout is the same Product Sidebar Layout, the only difference is Discount Information and group Items listing.
In this case, we will guide how to active the Discount Information and Group Items listing feature. Other settings area (Product image settings, Group functions, Group buttons, Sidebar, Bottom content,... ) please help us read again the guide.
3. Discount Information
From settings of Product template appear in the Right sidebar, select DISCOUNT. Input content of Sub heading, Heading, and Subtext field
4. Group Items listing
From Your Shopify AdminSettingsMetafieldsProducts
click to top/right Add Definition button, then input new field value:
- Name:Product group
- Description:Product group
- Select content type:JSON
get products handle of these products that appear in the group items listing. You can find the handle at the url/address of product.
For example, we want 4 products have hanle printed-loose-asymmetric-blouses,women-fashion-tropical-fruit, women-fashion-contrast-color, and vintage-blue-totem-floral into Group items listing
From Your Shopify AdminProductsAll Products
Select the product that you want show group items, then scroll down to Metafields area.
In Product group row,input the JSON bundle syntax value:
[
{
"handle": "printed-loose-asymmetric-blouses"
},
{
"handle": "women-fashion-tropical-fruit"
},
{
"handle": "women-vintage-v-neck"
},
{
"handle": "women-fashion-contrast-color",
}
]
Replace the example products handle by your products handle value.
That's all!
Important Notice
The product as Product Group Items is the wrapper product of these group items listing. This is not real 1 product to add to the cart if don't select at least 1 product in the group items listing. It is the same as the gift wrap.
Tips: How to set the Product Group Items as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
1. Setting up the product using Product Stacked 1 layout
This layout is not active as default for all products. So, You need set products using this layout manually.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Stacked 1 layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is stacked-1
2. Accessing the Product Stacked 1 layout in Customize
After setup the product using the Product Stacked 1 layout, you can go to Customize to control the layout settings.
From Customize (Theme Editor) Select View page is Productsstacked-1
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Stacked 1 Layout
The Product Stacked 1 layout is the same Product Sidebar Layout, the only difference is the layout (no sidebar and stacked style 1 gallery)
Please help us read again the guide for all layout settings.
Tips: How to set the Product Stacked 1 as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
1. Setting up the product using Product Stacked 2 layout
This layout is not active as default for all products. So, You need set products using this layout manually.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Stacked 2 layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is stacked-2
2. Accessing the Product Stacked 2 layout in Customize
After setup the product using the Product Stacked 2 layout, you can go to Customize to control the layout settings.
From Customize (Theme Editor) Select View page is Productsstacked-2
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Stacked 2 Layout
The Product Stacked 2 layout is the same Product Sidebar Layout, the only difference is the layout (no sidebar and stacked style 2 gallery)
Please help us read again the guide for all layout settings.
Tips: How to set the Product Stacked 2 as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
This layout is different from the Default layout in the Sidebar from Left to Right.
From Default Sidebar layout, You need to set the Position of 4 Sidebar blocks from Left sidebar to Right sidebar.
Tips: Setting up and Customize product used Product Right Sidebar layout.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Right Sidebar layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is right-sidebar
After that, from Customize (Theme Editor) Select View page is Productsright-sidebar
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Right Sidebar
Tips: How to set the Product Right Sidebar as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
From Default Sidebar layout, You need remove 4 Sidebar blocks and set Thumbnail position to Bottom.
Tips: Setting up and Customize product used Product Bottom Thumbnails layout.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Bottom Thumbnails layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is bottom-thumbnails
After that, from Customize (Theme Editor) Select View page is Productsbottom-thumbnails
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Bottom Thumbnails
Tips: How to set the Product Bottom Thumbnails as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
From Default Sidebar layout, You need remove 4 Sidebar blocks and set Thumbnail position to Right.
Tips: Setting up and Customize product used Product Right Thumbnails layout.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Right Thumbnails layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is right-thumbnails
After that, from Customize (Theme Editor) Select View page is Productsright-thumbnails
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Right Thumbnails
Tips: How to set the Product Right Thumbnails as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
From Default Sidebar layout, You need remove 4 Sidebar blocks and set Thumbnail position to None.
Tips: Setting up and Customize product used Product Not Thumbnails layout.
From Your Shopify AdminProductsAll Products
select product that you want to set to use Product Not Thumbnails layout
scroll down to see the Online store right/bottom sidebar.
set the Theme template is not-thumbnails
After that, from Customize (Theme Editor) Select View page is Productsnot-thumbnails
The Product template section will appear in the Left sidebar.
Click to this section , the Right sidebar will list all settings use to setup the Product Not Thumbnails
Tips: How to set the Product Not Thumbnails as default for all Products.
Due to the new JSON syntax of Shopify, we can not create the option to select the Default product layout. If you want to set another layout as the default style, please submit a Ticket to Support System.
From Customize (Theme Editor) Select View page is BlogsDefault blog
The Blog template section will appear in the Left sidebar. Click to this section , the Right sidebar will list all settings use to setup the Blog listing page.
Under Blog template section, will list all sidebar blocks. You also can click to Add block button to add a new or more sidebar block.
Blog template section include settings:
Show view as List/Grid: select List or Grid
Limit articles show: input the limit number.
Responsive width: 6 range value from Wide Desktop to Mobile to showing product per line.
Under Blog template section, will list all Blog sidebar blocks. You also can click to Add block button to add a new or more sidebar block.
Listing (Category):
- Heading
- Position: select Left sidebar or Right sidebar
- Link list: pick the Menu/Navigation to show the blogs listing.
Recent Articles (Recent posts):
- Heading
- Position: select Left sidebar or Right sidebar
- Select blog: to show articles listing.
- Limit
Banner:
- Heading
- Position: select Left sidebar or Right sidebar
- Upload banner
- Link banner
From Customize (Theme Editor) Select View page is Blog PostsDefault blog post
The Artile template section will appear in the Left sidebar. Click to this section , the Right sidebar will list all settings use to setup the Blog listing page.
Under Artile template section, will list all sidebar blocks. You also can click to Add block button to add a new or more sidebar block.
Related article: showing Articles the same Blog
- Enable related article
- Heading
- Auto-play slides
- Change slides every
- Slide effect
- Space between images
- Slider settings
- Responsive width
Under Article template section, will list all Blog sidebar blocks. You also can click to Add block button to add a new or more sidebar block. These sidebar blocks the same in Blogs page, you can read at again here.
From Customize (Theme Editor) Select View page is CartPassword
The Cart items and Cart footer
1. The Cart items section
This section include 1 option: Enable continue shopping
2. The Cart footer section
This section include options:
Enable cart note
Shipping rates calculator: This is shipping estimates, it will not added to Total price after caalculate.,
- Enable shipping calculator?
- Heading
- Heading country
- Heading Zip/Postal Code
- Default country selection
- Submit button label
- Submit button label when calculating
Checkout Page
From Customize (Theme Editor)Theme settingsCheckout
Select page that you want to set to use About us page layout or create a new page by clicking to Add page
At the Online store (right/bottom sidebar), set the Theme template is about
After that, Go to Customize (Theme Editor) Select View page is Pagesabout
The Page and About section will appear in the Left sidebar.
1. The Page section
This section include 2 options:
- Enable title: show page Title.
- Enable content: show the content of the page.
By default, this section has been disabled. You can enable it by clicking to eye icon near the About text.
2. The About section
Quote Store: include options
- Set active this block
- Heading
- Name & Position: in default it show HTML content.
Our Story: include options
- Set active this block
- Subtext
- Upload banner
Information Store: include options
- Set active this block
- Upload banner
- SubAddress: Title
- Address: Caption
- Phone: Title
- Phone: Caption
- Email: Title
- Email: Caption
- Social: Title. It will listing all social icons.
Our Team: include options
- Set active this block
- Heading
- Slider settings
- Responsive settings
Under About section, will list all Members. You also can click to Add Staff button to add a new or more Members.
Select page that you want to set to use Contact us page layout or create a new page by clicking to Add page
At the Online store (right/bottom sidebar), set the Theme template is contact
After that, Go to Customize (Theme Editor) Select View page is Pagescontact
The Page , Contact detail , Contact form , and Map section will appear in the Left sidebar.
1. The Page section
This section include 2 options:
- Enable title: show page Title.
- Enable content: show the content of the page.
By default, this section has been disabled. You can enable it by clicking to eye icon near the About text.
2. The Contact detail section
This section include option:
- Heading
Under Contact detail section, will list all Information blocks. You also can click to Add Item button to add a new or more. Each Item include option to show icon, Heading, Subtext and Responsive width.
3. The Contact form section
This section include 2 options:
- Heading
- Sub heading
4. The Map section
This section include options:
- Display on
- Layout
- Map iframe
Follow below image to know how to get the Map iframe
Select page that you want to set to use Contact us page layout or create a new page by clicking to Add page
At the Online store (right/bottom sidebar), set the Theme template is faq
After that, Go to Customize (Theme Editor) Select View page is Pagesfaq
The Page and FAQs section will appear in the Left sidebar.
1. The Page section
This section include 2 options:
- Enable title: show page Title.
- Enable content: show the content of the page.
By default, this section has been disabled. You can enable it by clicking to eye icon near the About text.
2. The FAQs section
This section include options to control Questions and Form:
- Set active this block
- Heading
Under FAQs section, will list all question blocks. You also can click to Add Question button to add a new or more. Each Item include option to show Heading and Content.
Select page that you want to set to use Contact us page layout or create a new page by clicking to Add page
At the Online store (right/bottom sidebar), set the Theme template is lookbook
After that, Go to Customize (Theme Editor) Select View page is Pageslookbook
The Page and FAQs section will appear in the Left sidebar.
1. The Page section
This section include 2 options:
- Enable title: show page Title.
- Enable content: show the content of the page.
By default, this section has been disabled. You can enable it by clicking to eye icon near the About text.
2. The Lookbook section
Under Lookbook section, will list all question blocks. You also can click to Add Lookbook Gallery button to add a new or more. Each Lookbook Gallery include option to upload 3 images.
At the Online store (right/bottom sidebar), set the Theme template is wish-list
After that, Go to Customize (Theme Editor) Select View page is Pageswish-list
The Page section will appear in the Left sidebar.
The Page section
This section include 2 options:
- Enable title: show page Title.
- Enable content: show the content of the page.
Important Notice
If you don't create the Wish list page as the above guide, the Wish-list function can not work right (showing a 404 error).
If you have created the Wish list page, but the Wish-list page still shows a 404 error. In this case, please delete this page and create a new page with 2 conditional:
- Title must be Wish list
- Theme Template must be wish-list.
At the Online store (right/bottom sidebar), set the Theme template is compare
After that, Go to Customize (Theme Editor) Select View page is Pagescompare
The Page section will appear in the Left sidebar.
The Page section
This section include 2 options:
- Enable title: show page Title.
- Enable content: show the content of the page.
Important Notice
If you don't create the Compare page as the above guide, the Compare page function can not work right (showing a 404 error).
If you have created the Compare page, but the Compare page still shows a 404 error. In this case, please delete this page and create a new page with 2 conditional:
- Title must be Compare
- Theme Template must be compare.
This is the Password page. It will show when your store has Password protection option is enabled.
From Customize (Theme Editor) Select View page is OthersPassword
The Password content section will appear in the Left sidebar.
Settings include:
- Heading
- Timer (Syntax YYYY/MM/DD HH:MM:SS)
- Timer Text
- Background
Under Password content section, will list Subheading and Email form section.
Any text in the theme that can not be found in these above Settings, can be found here.
From Your Shopify AdminOnline StoreThemesActionsEdit Language
In default Maxmin 5.x.x version only supports English Text. The listing translate Text displayed. Each page will list in a different tab.
You can type the original text (display text) in Search tool
Change the theme to other Language
Clicking to Change theme language in the top/right area
Select your language in Popup
Add/Replace your language translate text in the right field. Don't replace anything in the syntax {{..}}
Change Log
Jan 03, 2022
Reversion 19
5.0.2
ImprovementOptimate Video element in slideshow
fixedSlider bug in Safari browser.
November 24, 2021
Reversion 18
5.0.1
ImprovementBug fixes and Improvements
November 16, 2021
Reversion 17
5.0.0
ImprovementNew Source base on Shopify Online Store 2.0 (Sections Everywhere)
ImprovementSpeed up the site
UpdateAll Menu now support Mega menu
UpdateAjax functions
New6 Collections Layout
New7 Product Types
New7 Product Layout
NewAuto Product variants filter
NewCollection Banners Slider
NewUpsell Products slider
NewRecently viewed products
NewAuto Completed Search
NewSuggestion products
NewTerms & conditions Checkbox
NewGuarantee Safe Checkout listing
NewCookies Bar
NewDynamic Recommendations
July 09, 2021
Reversion 16
4.1.0
ImprovementSpeed up the site
NewAdded the Buy Now button.
New Added sub collections function.
March 05, 2021
Reversion 15
4.0.0
ImprovementConvert SCSS to CSS
November 06, 2019
Reversion 14
3.0.0
ImprovementSpeed up the site
May 07, 2018
Reversion 13
2.0.1
fixedSearch bar and Mobile bar broken in Mobile
fixedFilter Mobile change method show
April 18, 2018
Reversion 12
2.0.0
ImprovmentSpeed up the site
April 05, 2018
Reversion 11
1.0.1
fixedTags Filter in Collection page don't working
April 01, 2018
Reversion 10
1.0.0
PublishInitial release
Request Support
If you have any question not included in this help file, please feel free to post it on our Support system https://kalathemes.freshdesk.com/. Thank so much!
can not click to upload and install the theme. 
