Welcome to Zewelry - MultiPurpose Responsive Magento 2 Theme!

We would like to thank you for purchasing Zewelry Magento 2 Theme! We are very pleased you have chosen Zewelry Magento 2 Theme for your website, you will be never disappointed! Before you get started, please be sure to always check out this documentation.


Compatible with Magento:

Zewelry is fully compatible Magento Community Edition 2.1.x, 2.2.x


Magento 2 Help:

System Requirements

Installation Guide

Online Magento 2 guide

Magento Forum

magento.stackexchange.com

HiddenTechies Blog

Zewelry is a premium quality magento 2 theme specially designed for an online jewelry store, custom jewelry services or any other eCommerce site.

This Magento 2 theme has advanced features which will make your website becomes more professional with clean and classy layouts. It is fully responsive and looks stunning on all types of screens and devices.

Key Features

  • Magento 2.0 Ready!
  • Fully Responsive
  • Touch Optimized Slideshow
  • Cross Browser Compatibility
  • Featured Product List
  • Off Canvas Menu
  • Powerful Admin Panel
  • Auto Install Demo Content
  • Avoid Javascript Confliction
  • No Core Modifications
  • Easy Use and Easy Customize
  • Well-structured and commented code for easy customization

Unleash your creativity and build something amazing with Zewelry- Jewelry Store Responsive Magento 2 Theme!

To install the Magento 2 follow the instructions below:


1. Create an empty database with correct permissions in phpmyadmin.

2. Enter your Magento 2 url in browser and hit Enter.

Magento 2 Installation

3. Click on "Agree and Setup Magento".

Magento 2 Installation

4. Now Magento 2 will check your environment for readiness for the setup. Click on "Start readiness check".

Magento 2 Installation

4.1. If you pass all the checks, you can continue. Have you not, you must fix the error to continue. The 2 most often errors are php Settings Check and php Extensions Check.

Magento 2 Installation

PHP Settings Check: always_populate_raw_post_data error. To resolve this error, you need to access php.ini file. Using XAMPP, open this file like that:

PHP Settings Check: Search this line: always_populate_raw_post_data = -1 Make sure the number is -1, then remove the semicolon “;? at the beginning of the lines.

PHP Extensions Check: The usual missing extensions are xsl and intl. To resolve this, search extension=php_intl.dll as well as extension=php_xsl.dll, then both remove the beginning semicolon “;?.


Note: Now you need to stop both Apache and MySQL in XAMPP, then restart them again for new effects to be activated and resolved. Click Try Again in localhost for new result, after checking, hit Next.


5. Now enter Empty database that you created previously, where you want to install Magento2.

Magento 2 Installation

6. Click Next, now you will be asked for web configurations like store url, admin url, Apache rewrites, https options.


7. Click Next, now you can select Timezone, Currency and language in "Customize Your Store" section.

Magento 2 Installation

8. Click Next, Enter Admin username, email and password to setup Admin credentials.

Magento 2 Installation

9. Now Magento 2 is ready to be installed on localhost. Click on "Install Now". Don’t close your browser until setup is done.

Magento 2 Installation Magento 2 Installation

10. After the installer has completed the setup, it will show Success page.

Magento 2 Installation

10. Open Magento Admin panel, enter your admin credentials given at the time of setup.

Magento 2 Installation

To install the theme follow the instructions below:


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.

Disable all cache related section that you have in your Magento.


Theme Installation

1. Download theme package from your my account page

2. Copy(upload) files and folders from theme archive to your Magento 2 root directory

3. In command line, using "cd", navigate to your Magento 2 root directory

4. Run below commands

  • php bin/magento setup:upgrade
  • php bin/magento setup:static-content:deploy -f

5. Flush store cache and log out from the backend and log in again to see changes./p>

6. Your theme is now installed and ready for work.

7. Select your HiddenTechies Zewelry theme in Content > Design > Configuration page for Magento 2.1.x, 2.2.x version.

Step 1 Zewelry - MultiPurpose Responsive Magento 2 Theme Settings
Step 2 Zewelry - MultiPurpose Responsive Magento 2 Theme Settings
Step 3 Zewelry - MultiPurpose Responsive Magento 2 Theme Settings

Note: Once you done with the theme selection than save settings and clear cache.

Zewelry provides very easy one click demo installation.

In order to do demo installation, first you should import CMS Pages and Static Blocks.

To Import CMS Page and Static Blocks, follow the steps.

Step 1: Now go to Zewelry > Theme Configuration > Installation.

Step 2: If you want to import page and blocks for specific demo then select the "Demo Version" or select "All" to install all page and blocks.

Zewelry - Select Demo Version

After selecting Demo Version, click on  Save Config  button.

Step 3: If you want to override existing CMS Pages and Static Blocks, then select "Yes" for "Overwrite Existing Blocks" and "Overwrite Existing Pages".

Zewelry - Import Static Blocks and CMS Pages

Now click on  Save Config  button.

Step 4:

Now Click  Import Static Blocks  to import all Static Blocks.

And click  Import CMS Pages  to import all CMS Pages.

Step 5: Click  Demo X  button to install demo version that you prefer to install.

Zewelry - Import Static Blocks and CMS Pages

Next to that flush the cache.

Note: After demo import do not save the config. First flush the cache.

If you need to customize the theme, we recommend you to create the child theme.

How To Create A Child Theme?

Zewelry - Child Theme

Below steps define how to create a Magento 2 child theme.

For Zewelry Theme

Vendor name: Hiddentechies

Parent Theme name: atmag002

Step 1: Create child theme folder named as {parent-theme-name}_child in the below folder path.

"app/design/frontend/{theme-vendor-name}/{parent-theme-name}_child"

Ex: Magento root folder/app/design/frontend/Hiddentechies/atmag002_child

Step 2: Create file theme.xml inside the child theme.


<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>Hiddentechies Zewelry Child</title>
    <parent>Hiddentechies/atmag002</parent>
    <media>
        <preview_image>media/preview.jpg</preview_image>
    </media>
</theme>

                    

Step 3: Create a registration.php file for registering your child theme.


<?php

\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Hiddentechies/atmag002_child',
    __DIR__
);

                    

Step 4: Create composer.json.


{
    "name": "hiddentechies/theme-frontend-atmag002-child",
    "description": "N/A",
    "require": {
        "php": "~5.6.5|7.0.2|7.0.4|~7.0.6",
        "magento/theme-frontend-blank": "100.1.*",
        "magento/framework": "100.1.*"
    },
    "type": "magento2-theme",
    "version": "100.1.3",
    "license": [
        "OSL-3.0",
        "AFL-3.0"
    ],
    "autoload": {
        "files": [
            "registration.php"
        ]
    }
}

                    

Step 5:

Add preview.jpg in "app/design/frontend/Hiddentechies/atmag002_child/media" folder.

Add view.xml in "app/design/frontend/Hiddentechies/atmag002_child/etc" folder.

You can copy both file and image from parent theme.

How To Use A Child Theme?

Go to Admin > Content > Design > Configuration

Zewelry - Use Child Theme

Now click on "Edit"

Zewelry - Use Child Theme

Choose the child theme(Hiddentechies Zewelry Child) from dropdown menu.

Zewelry - Use Child Theme

And click on  Save Configuration  button.

Homepage Content Configuration

How to select or change a Homepage?

In order to select or change Homepage, Go to Admin > Store > Configuration > General > Web > Default Pages tab, choose the page in CMS Home Page field.

Zewelry - Select Or Change Homepage

And click on  Save Config  button.

How to edit Homepage content?

Homepage content structure.

Zewelry - Homepage Content Structure

In our Zewelry theme, you can add content from 2 places.

1. From CMS Homepage, go to Content > Elements > Page, open and edit active home page. Content can be found in the main field of the Content tab.

2. From Static Blocks, go to Content > Elements > Blocks.

Zewelry theme have configuration options to add content Above CMS Page content and Below CMS Page content on home page.

Each demo of Zewelry theme contains above and below static blocks.

i.e Jewelry demo contains "Home Jewelry Conetent Block (Above main content)" and "Home Jewelry Conetent Block (Below main content)."

Zewelry - Homepage Static Blocks

Zewelry theme contains config options to set content blocks for home page.

Go to Admin > Stores > Configuration > Hiddentechies - Zewelry > Theme Configuration > Content Blocks

Zewelry - Homepage Content Options

Home Content Block Above: Set static block identifier to display content above the CMS Page content on home page.

Home Content Block Below: Set static block identifier to display content below the CMS Page content on home page.

How to edit homepage slider?

To edit home page slider, please go to Admin > Content > Elements > Blocks and select the necessary static block.

Zewelry theme contains one static block for slider.

1. Home Jewelry Slider

You can add the fashion slider block code into the cms content field like below.

                        
{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="atmag002_home_jewelry_slider"}}
                        
                    
How to show "The Glam Collection (Featured Products)" in homepage?

Add "The Glam Collection Block (Featured Products)"

To add featured products on home page, you need to add product widget in home page.

In order to add widget follow the below steps.

Step 1: Go to edit CMS home page or static block that displays content on home page.

Step 2: Click on  Insert Widget...  button and select the widget type "Catalog Products List".

Zewelry - Homepage Insert Widget Zewelry - Homepage Select Fatured Product Widget

Step 3: Add necessary details.

Title: Add title.

Number of Products to Display: Add how many products you want to display in widget.

Enable Slider ?: If yes, it will enable slider.

Conditions: Select "Is Featured" to "Yes". (Note: You need to select "Is Featured" attribute "Yes" in the products.)

Zewelry - Homepage Insert Featured Product Widget

And click on  Insert Widget  button.

Or you can add the block code into the cms content field like below.

                        
{{widget type="Magento\CatalogWidget\Block\Product\ProductsList" title="The Glam CollectionSpark your imagination" show_pager="0" products_count="6" template="Hiddentechies_Productlayoutmanager::product/widget/content/grid.phtml" enable_slider="1" conditions_encoded="^[`1`:^[`type`:`Magento||CatalogWidget||Model||Rule||Condition||Combine`,`aggregator`:`all`,`value`:`1`,`new_child`:``^],`1--1`:^[`type`:`Magento||CatalogWidget||Model||Rule||Condition||Product`,`attribute`:`is_featured`,`operator`:`==`,`value`:`1`^]^]"}}
                        
                    
Zewelry - Homepag Featured Product Widget
How to show latest(new) products in homepage?

Add New Products

To add new products on home page, you need to add new product's widget in home page.

In order to add widget follow the below steps.

Step 1: Go to edit CMS home page or static block that displays content on home page.

Step 2: Click on  Insert Widget...  button and select the widget type "Catalog New Products List".

Zewelry - Homepage Insert Widget Zewelry - Homepage Select New Product Widget

Step 3: Add necessary details.

Number of Products to Display: Add how many products you want to display in widget.

Enable Slider ?: If yes, it will enable slider.

Zewelry - Homepage Insert New Product Widget

And click on  Insert Widget  button.

Or you can add the block code into the cms content field like below.

                        
{{widget type="Magento\Catalog\Block\Product\Widget\NewWidget" display_type="all_products" show_pager="0" products_count="8" template="Hiddentechies_Productlayoutmanager::product/widget/new/content/new_grid.phtml" enable_slider="0"}}
                        
                    
Zewelry - Homepage New Product Widget
Latest News (Blogs) Block

To edit this block, go to Admin > Content > Elements > Blocks and edit "Home Blogs".

To add latest news block, use below code into the cms content field.

                        
{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="atmag002_home_blogs"}}
                        
                    

Magfan Blog extension is compatible with Zewelry theme. So, if you have installed Magfan Blog extension then use below code into cms content field.

                        
{{widget type="Magefan\Blog\Block\Widget\Recent" title="Latest News" number_of_posts="6" category_id="0"}}
                        
                    
Zewelry - Homepage Latest News
Testimonials Block

To edit this block, go to Admin > Content > Elements > Blocks and edit "Home Testimonials".

To add testimonials block, use below code into the cms content field.

                        
{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="atmag002_home_testimonials"}}
                        
                    
Zewelry - Homepage Testimonials
Other Content Blocks

1. To edit below block, go to Admin > Content > Elements > Blocks and edit "Home Jewelry Category Collection Block".

To add, use below code into the cms content field.

                        
{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="atmag002_home_jewelry_category_collection"}}
                        
                    
Zewelry - Home Jewelry Category Collection Block

2. To edit below block, go to Admin > Content > Elements > Blocks and edit "Home Jewelry Lookbook Block".

To add, use below code into the cms content field.

                        
{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="home_jewelry_lookbook"}}
                        
                    
Zewelry - Home Jewelry Lookbook Block

3. To edit below block, go to Admin > Content > Elements > Blocks and edit "Home Services Block".

To add, use below code into the cms content field.

                        
{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="atmag002_home_services"}}
                        
                    
Zewelry - Home Services Block

How to change Logo?

Go to Admin > Content > Design > Configuration > Edit your theme > Header Tab

Logo Image: Upload your logo.

Logo Attribute Width: Add logo width.

Logo Attribute Height: Add logo height.

Welcome Text: Welcome texts in header.

Logo Image Alt: Logo Alt texts. It will display if in case logo image is not found.

Zewelry - Change Logo

Click on  Save Configuration  button.

How to change Favicon?

Go to Admin > Content > Design > Configuration > Edit your theme > HTML Head Tab

Favicon Icon: Upload your favicon icon with one of below file types.

Allowed file types: ico, png, gif, jpg, jpeg, apng.

Zewelry - Change Favicon

Click on  Save Configuration  button.

Megamenu Configuration

Zewelry theme comes with advanced mega menu. Please read detailed instructions to use menu as per our demo site.

Megamenu Settings

Plase Go to Admin > Zewelry > Header Manager > Configuration

Zewelry - Menu Configuration

1. Set/Change the header type.

2. Enable/Disable sticky menu.

3. Enable/Disable home link and you can also display icon for home link.

4. Set default menu type for all menu items.

5. Show custom links in your menu. You can add the custom url, other external url and CMS page url. You can also show the Static block content in menu dropdown.

6. Show category labels such as "New", "Hot!", "Sale" as our demo site.

How to add menu with Full-Width mega menu?

Follow the steps.

Step 1: Add new category and its sub-categories for downdown content.

Step 2: Now select the 1st level category. And expand the "Mega Menu" tab.

Zewelry - Full-Width Menu

Step 3:

Set the "Menu Style" Full Width.

Set the "Sub Category Columns" to display number of sub category columns in downdown. For ex, 4 Columns.

Zewelry - Full-Width Menu Frontend
How to add menu with Static Width mega menu?

Follow the steps.

Step 1: Add new category and its sub-categories for downdown content.

Step 2: Now select the 1st level category. And expand the "Mega Menu" tab.

Zewelry - Static-Width Menu

Step 3:

Set the "Menu Style" Static Width.

Set "Static Width" for the static width mega menu as your requirement. For ex, 600px.

Set the "Sub Category Columns" to display number of sub category columns in downdown. For ex, 3 Columns.

How to add menu with Classic dropdown menu?

Follow the steps.

Step 1: Add new category and its sub-categories for downdown content.

Step 2: Now select the 1st level category. And expand the "Mega Menu" tab.

Zewelry - Classic Menu

Step 3:

Set the "Menu Style" Classic.

How to add static content or image in mega menu?

You can also add the custom content like text or images in menu downdown. The possible options are Header Block, Left Block, Right Block and Footer Block of the link's columns.

Zewelry - Menu Add Custom Blocks

You can set with for Left and Right blocks. Set Block Width that you prefer to add image or custom content as right/left of the columns. For example, set 4/12 (means it will take 4 columns area from 12 columns).

Zewelry theme provides advanced and most powerful "Footer Manager".

Footer Settings

Plase Go to Admin > Zewelry > Footer Manager > Configuration

General Settings
Zewelry - Footer General Config

1. Enable/Disable footer.

2. Set your footer style.

Footer Layout Settings
Zewelry - Footer Layout Config

Footer Top

You can Enable/Disable footer top section.

You can add footer top section with two possible ways.

1. Newsletter Block

Zewelry - Footer Top Mewsletter

Frontend

Zewelry - Footer Top Mewsletter Frontend

2. Add Static Block

Zewelry - Footer Top Static Block

Footer Columns

Zewelry - Footer Columns

Enable/Disable footer columns block.

The possible options to add content or links in footer columns.

1. Newsletter: Display newsletter form.

2. Quickliks: Display magento 2 default links.

3. Static Block: Display Static Block content/links in footer column.

3. None: Hide column.

You can set necessary footer width for each column. For example,if you set 3/12 (means it will take 3 columns area from 12 columns).

Footer Columns Below

Zewelry - Footer Columns Below

Add the static block identifier to display static content below the footer columns section.

Frontend

Zewelry - Footer Top Static Block Frontend

Footer Newsletter (In Columns)

Zewelry - Footer Newsletter (In Columns)

Add newsletter block title and text for newsletter block display in footer column.

Footer Bottom

Zewelry - Footer Bottom

Enable/Disable footer bottom.

Adds copyright texts.

Add static block identifier to display static content right to the text.

Installation
Zewelry - Footer Installation

Choose the footer demo version for which you want to import the static blocks.

After selecting "Demo Version", Save the config.

If you want to override existing static blocks then select "Overwrite Existing Blocks" to "Yes". And save the config.

Click on  Import Static Block button to import static blocks.

Click  Demo X  button to install footer demo version that you prefer to install.

Go to Admin > Zewelry > Product Manager > Configuration > Product List tab

Zewelry - Category Page Configuration

Go to Admin > Zewelry > Product Manager > Configuration > Product View tab

Zewelry - Product Page Configuration

Zewelry is equipped with administrative module which gives you the ability to configure most of the functionality in powerful admin panel. Using this powerful settings panel, you can configure your store easily without any coding.

Go to Admin > Zewelry > Theme Manager > Configuration

Theme Layout
Zewelry - Theme Layout

Boxed/Wide: You can choose boxed or wide layout of entire store. You can also set background color or image for boxed layout.

Maximum Page Width: You can choose your preferable max-width from two possible options. 1170px and 1280px.

Contact Info
Zewelry - Contact Info

Show your store contact info on Contact Us page.

You can also show content from static blocks on contact page.

Add static block identifier in "Custom Static Block Top" and "Custom Static Block Bottom" filed to show static block content above and below to contact form.

Google Map
Zewelry - Google Map

You can enable/disable google map in Contact Us page.

Add Google Map api key, store address, latitude and longitude value of your store position and set zoom value to configure the map.

Note: You can get an API key from https://developers.google.com/maps/documentation/javascript/get-api-key

Add This (Socials)
Zewelry - Add This (Socials)

You can enable/disable "Add This" socials.

Add "Add This" Pub Id.

Note: You will get pub id from http://www.addthis.com

Scroll To Top
Zewelry - Scroll To Top

You can enable/disable scroll to top button.

Newsletter Popup
Zewelry - Newsletter

Enable Newsletter Popup: Enable/Disable newsltter popup.

Display Only On Home Page?: If "Yes", then newsletter popup display only on home page.

Popup Delay(in miliseconds): Set popup initialization delay. For example, 500.

Newsletter Title/Text: Add title and text for popup.

Popup Image: Upload the image to show image in popup.

Popup Height/Width: Set popup height and width. For example, 750px.

Popup Backgroud Color: Set popup background color.

Popup Background Image: Set popup background image.

Custom Style: Add Custom CSS for popup and its content.

Custom CSS
Zewelry - Custom CSS

You can put your own CSS styles without touching theme files.

Please, if you have any questions, run into any issues or just need some help, do not hesitate to contact us via our Support Center.
We believe in providing the best support possible, and we monitor our Support center just about 24/7.

Your feedback is absolutely welcome!

//