1. Introduction

Amazon Theme Integrated Multiple Vendor For Magento 2 Package  is the best choice for people who want to build a website like Amazon with the advanced features, the unique interface, and the powerful core theme.

2. Installation

There are 2 options to install theme: theme package installation and quickstart package installation.

2.1. Prepare Installation

  • We recommend you to duplicate your live store on a development store and try installation on it in advance.
  • Backup magento files and the store database.
    It’s very important to backup all of themes and extensions in Magento before installation, especially when you are working on a live server. We strongly recommend you to do not omit this step.
  • Disable all cache related section that you have in your magento.
  • Upload the theme files.(refer Next Part Theme Files Upload)
  • Active Netbase Extensions, open command line in folder root of magento and run commands via ssh using putty or others, php bin/magento setup:upgrade
    Sometimes your site is broken, after run this command, it’s because of you ran this command with the incorrect user. If your site was broken, it’s very important to set the file’s permissions and ownership correctly, after run this command line. You can refer this command chown -R <owner>:<group> <magento root directory path>.
  • Select “Netbase Multistore” theme in Stores -> Configuration -> General -> Design -> Design Theme -> Design Theme for Magento 2.0.x version, and select “Netbase Multistore” theme in Content > Design > Configuration page for Magento 2.1.1 version.
  • Download the install package and unzip it:
    + Userguide.pdf
    + Quickstart_Mag2-Amazon.zip
    + Sample-data.sql
    + Theme_Mag2-Amazon.zip

2.2. Theme Package Installation

Step 1: Theme Files Upload

  • Log into your hosting space via a FTP software. ie, FileZilla
  • Unzip Theme_Mag2-Amazon.zip theme Package -> and upload all directories (There are 2 directories – app and pub) to magento 2 root directory.

Step 2: Active theme

Active Netbase Extension, open command line in folder root of magento and run commands via ssh using putty or others, php bin/magento setup:upgrade

Step 3: Select Design

  • Select “Netbase Multistore” theme in Stores -> Configuration -> General -> Design -> Design Theme -> Design Theme for Magento 2.0.x version.
  • With Magento 2.1.x version, you go to Content -> Configuration in Design, you click on section your store (suggest “Main Website Store”) to edit theme name –>  select “Netbase Multistore” theme

 

Step 4: Demo Installation

In order to do demo installation, you should import static Blocks and CMS pages in NETBASE -> Settings Panel -> Installation.

Click 2 “Import” buttons to prepare demo installation.

 

Step 5:  Select demo.

Our theme provide for you 3 home page demos, you can choose one of 3 demos to show your home page.

2.3. Quickstart Package Installation

Quickstart Files Upload:

Step 1: Upload file “Quickstart_Mag2-Amazon.zip“ to your host.

Step 2: Unzip this file

Step 3: After you import database file successfully, you can run quickstart package installation via access your domain, eg: http://yourdomain/foldername

You click on button “Agree and Setup Magento”. Then, you fill full your website information in next step.
After you install successfully, you run command line:
php bin/magento setup:static-content:deploy
php bin/magento cache:clean

3. Setting

3.1. Theme Setting Panel

Login admin, then click on NETBASE -> Settings Panel -> Sun – Theme Setting. You can change options, settings for your store here. Then, you should disable cache before setting and enable after finish.

3.1.1. Header

The Header is divided into 3 parts: The Top Header, the Middle Header and The Bottom Header.

Notes: To setting header type, you have to read 3 parts of header carefully: Elements of header, “Custom Block” icon in header and Import header demo.

Elements of header

Elements of the Top Header

  • Show Top Header: allow showing the top header or not. The Top Header is divided into 3 parts: Header Top Left (the left of top header), Header Top Center (the center of top header) and Header Top Right (the right of top header).
  • Column Layout Header Top Left: select number of columns to display elements in Header Top Left or select “Do Not Show” if you don’t want to display any elements in Header Top Left.
  • Select Elements in Header Top Left: select any elements you want in Header Top Left.
  • Column Layout Header Top Center: select number of columns to display elements in Header Top Center or select “Do Not Show” if you don’t want to display any elements in Header Top Center.
  • Select Elements in Header Top Center: select any elements you want in Header Top Center.
  • Column Layout Header Top Right: select number of columns to display elements in Header Top Right or select “Do Not Show” if you don’t want to display any elements in Header Top Right.
  • Select Elements in Header Top Right: select any elements you want in Header Top Right.
  • Select Layout Type Search: select the search type you want.
  • Select Layout Type Cart: select the cart type you want.
  • Select Layout Type User: select the user type you want.

Note: In part “Select Element”, you can select a custom static block and you have to fill the custom static block. Example: you can see image below:

  • ID Static Block: fill in identifier of custom static block that you want to display in the top header. To get identifier, you go to Content -> Blocks -> copy identifier of custom block you want.

Element of the Middle Header

  • Show Header Middle: allow showing the middle header or not. The Middle Header is divided into 3 parts: Header Middle Left (the left of middle header), Header Middle Center (the center of middle header) and Header Middle Right (the right of middle header).
  • Column Layout Header Middle Left: select number of columns to display elements in Header Middle Left or select “Do Not Show” if you don’t want to display any elements in Header Middle Left.
  • Select Elements in Header Middle Left: select any elements you want in Header Middle Left.
  • Column Layout Header Middle Center: select number of columns to display elements in Header Middle Center or select “Do Not Show” if you don’t want to display any elements in Header Middle Center.
  • Select Elements in Header Middle Center: select any elements you want in Header Middle Center.
  • Column Layout Header Middle Right: select number of columns to display elements in Header Middle Right or select “Do Not Show” if you don’t want to display any elements in Header Middle Right.
  • Select Elements in Header Middle Right: select any elements you want in Header Middle Right.

Note: In part “Select Element”, you can select a custom static block and you have to fill the custom static block. Example: you can see image below:

  • ID Static Block: fill in identifier of custom static block that you want to display in the middle header. To get identifier, you go to Content -> Blocks -> copy identifier of custom block you want.

Element of the Bottom Header

  • Show Header Bottom: allow showing the bottom header or not. The Bottom Header is divided into 3 parts: Header Bottom Left (the left of bottom header), Header Bottom Center (the center of bottom header) and Header Bottom Right (the right of bottom header).
  • Column Layout Header Bottom Left: select number of columns to display elements in Header Bottom Left or select “Do Not Show” if you don’t want to display any elements in Header Bottom Left.
  • Select Elements in Header Bottom Left: select any elements you want in Header Bottom Left.
  • Column Layout Header Bottom Center: select number of columns to display elements in Header Bottom Center or select “Do Not Show” if you don’t want to display any elements in Header Bottom Center.
  • Select Elements in Header Bottom Center: select any elements you want in Header Bottom Center.
  • Column Layout Header Bottom Right: select number of columns to display elements in Header Bottom Right or select “Do Not Show” if you don’t want to display any elements in Header Bottom Right.
  • Select Elements in Header Bottom Right: select any elements you want in Header Bottom Right.

Note: In part “Select Element”, you can select a custom static block and you have to fill the custom static block. Example: you can see image below:

  • ID Static Block: fill in identifier of custom static block that you want to display in the bottom header. To get identifier, you go to Content -> Blocks -> copy identifier of custom block you want.

 

“Custom Block” Icon in Header

Custom Block Search

  • Custom Border Radius Block Search: fill in radius of search icon.
  • Choose Icon Search: select a search icon you want here.
  • Font size Icon Search: fill in font size of search icon.

Custom Block Login

  • Upload Image Icon User: upload image user icon for the login block. Allow file type is PNG, GIF, JPG and JPEG.
  • Choose Icon My Account: select an account icon in the dropdown of my account.
  • Choose Icon Order: select an Order icon in the dropdown of my account.
  • Choose Icon Wishlist: select a wishlist icon in the dropdown of my account.
  • Choose Icon Reviews Account: select a review icon in the dropdown of my account.
  • Choose Icon Newsletter Account: select a newsletter icon in the dropdown of my account.
  • Choose Icon Bill Account: select a bill icon in the dropdown of my account.
    You can review after setting in front-end:

 

Custom Block Cart

  • Upload image of cart icon here. Allow file types are PNG, GIF, JPG and JPEG.

Notes: Remembering Save Config after each change. And flush cache after configure.

Import Header Demo

 

  • Click on a ‘Header Type’ button which you want to display in your site.

Notes:

  1. Remembering to flush cache after importing any header types.
  2. After you import any header types, all elements in top, middle & bottom header will automatically change to be suitable with your header type. You have to keep our setting and if you change, it can break header interface.

3.1.2. Footer

The Footer is divided into 3 parts: The Top Footer, The Middle Footer and The Bottom Footer.

Top Footer Setting

  • Show Footer Top: allow showing the top footer or not.
  • The top footer divided into 4 columns. You can allow show each column or not. At the same time, you can configure column size for each column.

Middle Footer Setting

  • Show Footer Middle: allow showing the middle footer or not.
  • The middle footer divided into 4 columns. You can allow show each column or not. At the same time, you can configure column size for each column.

Bottom Footer Setting

  • Show Footer Bottom: allow showing the bottom footer or not.
  • The bottom footer divided into 4 columns. You can allow show each column or not. At the same time, you can configure column size for each column.

  • Show Footer Bottom Payment: allow showing the bottom payment footer or not.
  • Column Payment: select a custom block and fill static block ID.

Notes: Remembering Save Config after each change. And flush cache after each configuration.

3.1.3. Home page Setting

  • Step 1: In order to add section and change the section position, you go to NETBASE -> Homepage Config

You can add section by clicking on  button.

Select the section in dropdown as image below. You can the available sections or custom block:

In each section, you can tick to select layout for this section:

After you setup section as you want, you can preview the homepage content in “Homepage Preview” -> click on  button.

  • Step 2: In order to show products in homepage such as: Product Best Seller, Product Hotdeal, Product New and Product Feature, you go to Store -> Configuration -> HOME PRODUCT TAB.

    – “Bestseller Products” tab

    – “Deal Products” tab

    – “New Products” tab

    – “Featured Products” tab

  • Step 3: Show brands category: In admin panel, click on Store -> Configuration -> click on CMS-MART tab -> Brands

 

3.1.4. Category View

In admin panel, click on Store -> Configuration -> click on Sun Theme Setting tab in NETBASE 2.0.0.

You can select product grid types: 3 columns or 4 columns.

3.2. Theme Design Panel

General

In admin panel, go to NETBASE -> Design Panel

  • Theme Colors: In this option, you can set main color of entire store, and you can apply specific color settings in below options.

Font

  • Custom: select Yes to customize font family and font size. Then, you can select “Basic Font Size, Basic Font Family and Font Family-Custom.

Basic Color

  • Custom: select yes to customize the basic colors: button, link, label…

Header Color

You can customize color of some elements in top header, middle header & bottom header.

Footer Color

You can customize color of some elements in top footer, middle footer & bottom footer.

3.3. Other Module

In theme we use some extensions:

  • Mega Menu
    Please read more in file “Userguide_ Magento2_ MegaMenu .pdf”
  • Quick View
    Please read more in file “Userguide_ Magento2_ QuickView.pdf”
  • Ajax Cart Pro
    Please read more in file “Userguide_ Magento2_ AjaxCart.pdf”
  • Ajax Search
    Please read more in file “Userguide_ Magento2_ AjaxSearch.pdf”
  •  Order Upload
    Please read more in file “Userguide_ Magento2_ Orderupload.pdf”
  •  Shop By Brand
    Please read more in file “Userguide_ Magento2_ ShopBy Brand.pdf”
  •  Blog Module
    Please read more in file “Userguide_ Magento2_ Blog.pdf”
  •  FAQ Module
    Please read more in file “Userguide_ Magento2_ FAQ.pdf”
  •  One Step Checkout
    Please read more in file “Userguide_ Magento2_ OneStepCheckout.pdf”
  •  Layered Navigation
    Please read more in file “Userguide_ Magento2_ LayeredNavigation.pdf”
  • Store Locator
    Please read more in file “Userguide_ Magento2_ StoreLocator.pdf”
  • Multivendor
    Please read more in file “Userguide_ Magento2_ Multivendor.pdf”

4. FAQ

Question 1: Do I receive the Product like your demo?
Answer: Yes, but after that you should change your logo, upload your own products. Our demo templates are for demo.
Question 2: Can I download the update of new version?
Answer: Yes, within 6 months of your single purchase, if we release and update the extension or template, we will include into the product download package on our download server, so you can download with the same download links in your confirmation email.
Question 3: How to configure extensions in this theme?
Answer: If you want to configure the extensions, you only follow the steps below:
On admin panel, you find this extension in menu sidebar. Example: You want to configure mega menu extension; you click on MEGAMENU in menu sidebar of admin panel.
You will choose the extension that you want to configure here. You can have more detail about configuration way in 3.3. Other Modules

Note:
If you have many questions, please contact us here:
http://cmsmart.net/support_ticket

5. Troubleshooting

1. After installing, Site cannot load CSS & JS

A: If you are facing problem of css and js page load design after installation, then you please follow the steps below:

– Step 1: SSH to run command deploy: php bin/magento setup:static-content:deploy

– Step 2: Reindex Magento, php bin/magento indexer:reindex

2. Your website frontend and backend not showing.

A: Change the owner of the uploaded files (pub and var) to the web server user and set correct file permissions for them. Login to Admin Panel, and Clear the cache.

3. Get 500 internal error when i use: php bin/magento setup:upgrade.

A: Change the owner of the uploaded files (pub and var) to the web server user and set correct file permissions for them.

4. Theme features don’t work after installation or upgrade

A: If some theme features don’t work after installation or some resources (e.g. images) are not displayed in the frontend, it often indicates problems with file permissions – your Magento doesn’t have access to the theme files because of incorrect file permissions on your server.

5. Fatal error: Uncaught exception ‘Magento\Framework\Exception\LocalizedException’

A: If you see the above error message, then please try to set permission on pub and var directories.

6. Menu dropdown doesn’t show?

A: In Cache Management, please try to flush the static files cache.

7. After installing if we reload or refresh the page two three times so it will not appear correctly?

A: Please try to enable merge javascript files in Stores -> Settings -> Configuration -> Advanced -> Developer -> JavaScript Settings.

Top