Toggle navigation

eCommerce Shop Pro

Version 1.0.0

eCommerce Shop Pro is an eCommerce-ready theme that you can absolutely use for publishing your personal or company portfolio, showcasing your products, or building an efficient online store for your business.

Start

eCommerce Shop Pro is an eCommerce-ready theme that you can absolutely use for publishing your personal or company portfolio, showcasing your products, or building an efficient online store for your business. This theme is very flexible and includes options that make website development an easy task.

Installation

Follow the steps below to get started with your WordPress Theme

  1. Now Login to WordPress admin Dashboard.
  2. Go to  Appearance> Themes > Add New >  Upload theme.
  3. Upload ecommerce-shop-pro.zip and Activate themes.

Installing Plugins

When you click on “Activate” button to activate eCommerce shop Pro Theme, you will see the a notice offering you to install required and recommended plugins.

Click “Begin installing plugins“, on the screen that appears, next select the plugins you want to be installed, pick “Install” in Bulk Actions select box and click “Apply” button. For optimal user experience install and activate all recommended plugins.

Import Demo Data

We are providing our own demo importing plugin so if you like and want to demo like website in your site then you can easily import the demo and set up on your site.

Steps to import demo data:

    1. After activated Theme One Click Demo Import from a plugin.
    2. you will get the Import Demo nav in your dashboard.
    3. Click on Import Demo. You will get all the demo available:
    4. Click on the Import and follow the process as shown in the video. Link is here:

Create Post and Page

Step to Add New Post

  1. Go to Post,Click Add New.
  2. Add Title,Content,Feature Image and Categories.
  3. Click on Publish.

Step to Add New Page

  1. Go to Page,Click Add New.
  2. Add Title,Content and Feature Image.
  3. Click on Publish.

Color

Go to Appearance > Customize > color. where you can see Header Text Colour & Background Colour Options sections.

  1. Header Text Color: Select the color available in the options. If the preview is fine, click on  Publish to apply recently selected Header Text Colour.
  2. Background Color: Select the color available in the options. If the preview is fine, click on Publish to apply recently selected Background Colour.

Header Image

Go to Appearance > Customize > Header Image. From where you can change the Header Image for your site. Select the header image of your choice.If the preview is fine, click on Publish to apply the recently selected image as the Header image.

Background Image

Go to Appearance > Customize > Background Image.Select the image for Background available on media library or upload from the other location.If the preview is fine, click on  Publish to apply recently selected/uploaded image as Background Image.

Theme Options

  1. Go to Appearance > Customize > Theme Options.
  2. You will get different options and Setting as shown in screenshot.

Header Setting

Header setting will give you options to control the looks of the header part of your site.

  1. Go to Appearance > Customize > Theme Options > Header Setting.
  2. Popup Image Title: This option allow you to edit text in Popup image title.
  3. Add Pop Up Image: This option allow you to add pop up image.
  4.  
  5.  
  6. Enable Cart in Header: 

Breadcrumbs Setting

Breadcrumbs setting will give you options to control the looks of the Breadcrumbs part of your site. Go to   Appearance  > Customize > Theme Options > Breadcrumbs Setting.

  2. Choose Option:
    1. None: .
    2. Header Image: .
    3. Featured Image: .

 

Blog/Archive Setting

Blog/Archive setting will give you options to control the looks of the Blog/Archive part of your site. Go to Appearance > Customize > Theme Options > Blog/Archive Setting.

  1. Excerpt Length: This option help you to excerpt length of your content.
  2. Enable Post Meta: This option help you to enable/disable post mate.
  3. Enable Social Share: This option help you to enable/disable social share.

General Setting

General setting will give you options to control the looks of the General part of your site.

  1. Go to Appearance > Customize > Theme Options > General Setting.
  2. Enable Typography:This option allow you to enable/disable Typography.
  3. Add Background Image for Error Page:This option allow you to select background image for error page.
  4. Choose Option
    1. None:This option allow you to remove sidebar from your site.
    2. Left Sidebar: This option allow you to select left sidebar from your site.
    3. Right Sidebar: This option allow you to select right sidebar from your site.
  5. Choose Shop Page Sidebar:
    1. None: This option allow you to remove sidebar in your shop page.
    2. Left Sidebar: This option allow you to select left sidebar in your shop page.
    3. Right Sidebar: This option allow you to select right sidebar in your shop page.
  6. Pagination Options:
    1. Default: This option allow you to select Default pagination.
    2. Numeric: This option allow you to select Numeric pagination.
  7. Enable Category: This option allow you to enable/disable Category.
  8. Enable Posted Date: This option allow you to enable/disable Posted Date.

Footer Setting

Footer setting will give you options to control the looks of the Footer part of your site.

  1. Go to Appearance > Customize > Theme Options > Footer Setting.
  2. Info Section: This option allow you to edit info section.
  3. Footer Copyright: This option allow you to edit footer copyright.
  4. Footer background image:This option allow you to edit footer background image.
  5. Powered By Text: This option allow you to edit powered by text.

Contact Page Options

Contact Page Options will give you options to control the looks of the Contact Page Options of your site.First make Contact page and select Contact us template.after that you can get contact page template design.

  1. Go to Appearance > Customizing > Contact Page Options > Google Map Setting.
  2. Google Map Address: This option allow you to add iframe code for google map.

 

Typography Options

Typography setting tab is one of the most important options which will allow you to customize the looks of your sites typography. It allows to set font family, font size and font color for your sites general use. It also allows you to choose font family and size for all header types . You can set different font size for each head tag. This options allows you to choose font color for anchor tag and its hover/active state.

From Typography Options, you will see different sections:

 

Font Family Setting

This setting allow you to customize font family,font size,font-weight for  your site according to your requirement.go to Appearance > Customizing  > Typography Options > Font Family Setting.

General Color Setting

This section allow you to change overall Hover Color,Heading Tag Color,Heading Section Title Color,paragraph,anchor,post meta background and color according to your choice in your site.

go to Appearance > Customizing  > Typography Options > General Color Setting

Header Color Setting

This section allow you to change Header menu ,icon color and hover color.go to Appearance > Customizing  > Typography Options > Header Color Setting.

Footer Color Setting

This section allow you to change Footer background and widget color.go to Appearance > Customizing  > Typography Options > Footer Color Setting.

Widgets

Widgets are one of the most important aspects of this theme.Eleven special widgets are specially built for the front page so that most of your content can be categorized easily and be accommodated to feature in the front page.

  1. From Customize section, go to Widgets.
  2. From Widgets, you will see different sections to add widget where you will be able to Add a Widget or Remove widgets by going to particular widget section.
  3. And the added widget will be displayed in particular section that you have added.
  4. Note: Make sure to add proper widgets in proper widget area for best result.

Available Widget Area

step to customize available widget

The widgets that are available in the theme are described below:

  1. ES:Best Seller :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  2. ES:Client :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  3. ES:Counter :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  4. ES: CTA :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  5. ES:Feature Product :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  6. ES:Feature Slider :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  7. ES:Follow Us :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  8. ES:Product Slider :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  9. ES:Product Tab :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  10. ES:Testimonial :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.
  11. ES:Trending :- You will find options and settings in this widget. Now setup the widget according to your need. See the below image.

Homepage Setting

By default, your homepage will also display your post feed, listing all of your latest posts for visitors to see.

But  If you would like to instead have your homepage be a static page then your front page will display the content from the page you selected as Front Page. However the page you selected in Posts Page will become your blog page..

Reset All Settings

This option help to reset all customize setting.Go to Appearance > Customize >Reset All Settings.

In Reset all settings you will see:

  • Check to reset all settings to default : Check the Check to reset all settings to default and refresh the page to reset all theme settings to default.

FAQ Section

This option help to create FAQ  section.First Create FAQ page select FAQ template then.Go to Appearance > Customize >FAQ Section.select the page for tab and CTA  page and get the design according to design template.

 

 

WooCommerce

Go to Appearance > Customize >WooCommerce. From From Here you can change Products per row,Rows per page , manage the image width etc…

Additional CSS

This is the option which will allow you to add your custom CSS. From Customize > Additional CSS. Additional CSS you will see: