Ecommerce Hub Pro Theme Documentation

File Structure

The template bundle that you downloaded is divided into various directories. Let's examine the contents of each folder:

  • Screenshots -contains template screenshot. Not for production.
  • theme -contains wordpress theme files
  • "ecommerce-hub-pro.zip" -this folder contains all the necessary files for the theme.
  • "license.txt" -contains license details
  • "readme.txt" -contain information about theme images path, font use and usage script

TG KEY ACTIVATION

The steps for activating a TG Key are as follows:.

Use the licence key you get through Email to Activate License.

Follow the following Process to Activate License.

Go to Dashboard >> Appearance >> TG Key Activation >> Enter Key>>Save Changes.

After Entering The Key >> Activate Licence.

After you Activate Licence,the key will be active and then you can Getstarted with the Theme.

In this way you can activate your Licence Key.

Template Installation

Installing a template is a simple process. There are two ways to complete the installation process.

1-Using WordPress admin, install a theme.

The first step is to log in to your WordPress admin dashboard. then click on

1.Go to the menu Appearance >> Themes


2. When arriving at the themes page, select the Add New button at the top.


3. To upload a theme, click the button.


4. Choose your ecommerce-hub-pro.zip theme by clicking the Browse button, and then click the Install Now button.


Congrats! Your theme has been installed successfully.

Section Color/Font Pallette

The method of changing the colour or font is quite simple. These choices are available in all customizer areas. It is a comprehensive graphic that demonstrates the typeface and colour palette. You can modify the colour and font of the headings, paragraphs, and buttons with a single click.

Depending on the number of options accessible in each area, there is an option to change the colour scheme for the headings, title/text, paragraphs, button text, and button background.

Default Color/Font settings

One-Click Demo Content Importer

To set up your theme, simply click to import sample content. You can follow the instructions in this article to develop your website for website creation.

Go toDashboard >> Appearance >> Get started

You first need to install the "Ecommerce Hub Pro posttype" plugin before you can start the "Run Importer" command.

Click on"Run Importer".

Fetch Demo content

This theme supports the standard Site Identity area that WordPress provides, and we have added some options to this section.

Follow these instructions to setup Home page.

  • To set a template for a new page, navigate to the Dashboard, click on Pages, and then select Add New Page. Give the page a name, such as "Home," or any other desired label. Next, choose the "home-page" template from the dropdown menu of available templates.



  • 2. Set the front page: Go to Setting -> Reading --> Set the front page display static page to home


  • When you're finished, you can view the entire demo on the top page.

How to set up Home Page

Setup Top Bar

In order to configure Top Bar Section,

Go to Appearance >> Customize >> Theme Settings >>Top Bar Section



Follow these instructions to setup Top Bar.

  • Do you want this section: This section can be enabled or disabled. This environment is crucial. If you want this section to show on your website, leave the option enabled; if you don't, pick the disable option, and this section will no longer be visible on your website.
  • Top Bar Background Color: The topbar's background colour can be changed.
  • Top Bar Background image (1520px x 50px): The topbar's background image can be changed.
  • Top Bar Text Color: From this choice, you can modify the text's colors.
  • Top Bar Text Font family: From this choice, you can modify the text's font family.
  • Social Color: The social media icons can be given color.
  • Social Background Color: Social-icons can have a background colour added.

Setup Header Widgets

In order to configure Header Widgets Section,

Go to Appearance >> Customize >> Theme Settings >>Header Widgets



To set up Header Widgets, follow to these instructions.

  • Show / Hide Search box: The search box can be made visible or hidden.
  • Show / Hide Category box: The Category box can be displayed or hidden.
  • Show / Hide My account: My account can be shown or hidden.
  • Show / Hide Cart box: The cart box can be hidden or shown.
  • Header Widgets Background Color: The header-widgets' background color can be changed.
  • Header Main title Color: You can modify color of header main title.
  • Header Main title Font family: You can modify font-family of header main title.
  • Search button background color: You can modify background color of search button.
  • Category Color: You can modify category color.
  • Icon Color: You can modify icon color.

Setup Header

In order to configure Header Section,

Go to Appearance >> Customize >> Theme Settings >>Header Section



Follow these instructions to setup Header.

  • Menu Item Color: You can modify The Color of Menu Item.
  • Menu Item Fonts : You can modify Menu Item Font Family
  • Menu Item Hover Color: You can modify color of meun item hover.
  • Menu DropDown Background Color:You can modify background color of menu dropdown.
  • Menu DropDown Item Color :You can modify color of menu dropdown item color.
  • Menu DropDown Item Hover Color: You Can color of menu dropdown on hover.
  • Menubar Background Color : You can modify menubar background color.
  • Responsive Menu Background Color: You can modify background color of menu when you view your website in responsive media.
  • Responsive Menu item Color: You can modify color of menu when you view your website in responsive media.

Setup Slider



Follow the below steps to setup the slider

Go to Appearance -> Customize -> Theme Settings -> Slider Settings



  • Setting Options : contains options for the option to enable or disable service display. You can enable or disable this part using this parameter. This environment is crucial. If you want this section to show on your website, leave the option enabled; if you don't, pick the disable option, and this section will no longer be visible on your website.
  • Number of Slider To Show: Let you to choose how many sliders to display.
  • Slider Image: Here, you may customise the slider image.
  • Slide Top Heading: Here, you can choose whether the Top Heading will appear on the slider.
  • Slide Heading Title: You can choose whether the Heading Title will appear on the Silder.
  • Slide Text: Let you to customise the slider's slide text.
  • Slider Button Text: You can set the Slider Button Text of Slider.
  • Button URL: The Button URL can be customised using this option.

To setup the Site Icon

Go to Appearance -> Customize -> Site Identity



  • Logo : From this page, You may include the Slider Icon.
  • Site Title: The Site Title can be added in this area.
  • Tagline: The tagline can be included in this section.
  • Site Icon: From this part, You may include the site icon.

Setup Product Category Section



To be able to the following section, follow the below steps

2. Add Product Category Section, Go to Appearance -> Customize -> Theme Settings -> Product Category Section

3. Moreover, you can change the background and text color in that section.



Follow these instructions to setup Product Category Section.

  • Setting Options: Includes settings for courses display enable / disable option.
  • Background Color: You may include a background colour here, and your site will display it when you do.
  • Category Image: From here, you can upload a category image.
  • Title Color: The page will be displayed in the Cources Section area of your website if you add a Title Color here.
  • Title Font Family: Your site's section headings will be displayed after you apply the Title Font Family.
  • Category Title Color: Here, you can include the Category Title Color.
  • Category Title Font Family: Font family for Category Title may be added here.

Setup Featured Products Section

To begin, turn on the "Woocommerce" plugin. only you add Items after that



Follow the actions listed below to access the next segment.

You must first create a category.

1. Go to Dashboard -> Products -> Categories->Add New



2.Go To Dashboard -> Products -> Add New

3. Add the Featured Products Section, Go to Appearance -> Customize -> Theme Settings -> Featured Products Section

4. Moreover, you can change the background and text color in that section.



Set up the Featured Goods Section by following these instructions.

  • Setting Options: Includes settings for courses display enable / disable option.
  • Background Color: You may include Background Color here and the Background Color will be displayed of your site.
  • Background Image: You may include Background image here and the Background image will be displayed of your site.
  • Title Color: You may include Title Color here and the page will be displayed in Cources Section section of your site.
  • Title Font Family: You may include Title Font Family here and the Section Heading will be displayed of your site.
  • Small Text Color: You may include Sub Text Color here.
  • Small Text Font Family: You may include Text Font Family here.
  • Number of Product to show: You may include number of product to be viewed in you website.
  • Select Product Category: Here, you can choose a product category, and the products will then be displayed in accordance with that category.
  • Product Content Color: Color may be included into a product's content.
  • Product Content Font Family: Font Family is available in product content.

Product Banner Section

Go to Customize >> Theme Settings >> Product Banner Section


  • Setting Options: Includes settings for Our Causes display enable / disable option.
  • Background Color: You may include Background Color here and the Background Color will be displayed of your site.
  • Background Image: You may include Background image here and the Background image will be displayed of your site.
  • Title Color: You may include Section Title Color here.
  • Title Font Family: You may include Section Title Font Family here and the Section Title Font Family will be displayed of your site.
  • Sub Title Color: You may include Sub Title Color here.
  • Sub Title Font Family You may include SSub Title Font Family here.
  • Banner Image You may include banner image from here.
  • Button Color You may include button text color from here.
  • Button Font Family You may include button text Font-family from here.

Setup New Arrivals Products Section

First turn on the "Woocommerce" plugin. only you add Items after that



Follow the actions listed below to access the next section.

You must first create a category.

1. Go to Dashboard -> Products -> Categories->Add New



2.Go To Dashboard -> Products -> Add New

3. Section of New Arrivals Products, go to Appearance -> Customize -> Theme Settings -> New Arrivals Products Section

4. Moreover, you can change the background and text colours in that section.



Follow these instructions to setup New Arrivals Products Section.

  • Setting Options: Includes settings for courses display enable / disable option.
  • Background Color: You may include Background Color here and the Background Color will be displayed of your site.
  • Background Image: You may include Background image here and the Background image will be displayed of your site.
  • Title Color: You may include Title Color here and the page will be displayed in Cources Section section of your site.
  • Title Font Family: You may include Title Font Family here and the Section Heading will be displayed of your site.
  • Small Text Color: You may include Sub Text Color here.
  • Small Text Font Family: You may include Text Font Family here.
  • Number of Product to show: You may include number of product to be viewed in you website.
  • Select Product Category:You can select product category from here so that according to the selected category the products will be displayed.
  • Product Content Color:You may include color to product content.
  • Product Content Font Family: You can Font Family tp product content.

Setup Today Deal Section

Initially turn on the "Woocommerce" plugin. only you add Items after that



Follow the actions listed below to access the next section.

First you need to create category.

1. Go to Dashboard -> Products -> Categories->Add New



2.Go To Dashboard -> Products -> Add New

3. Add the Today Deal Section, Go to Appearance -> Customize -> Theme Settings -> Today Deal Section

4. Moreover, you can change the background and text color in that section.



Follow these instructions to setup Today Deal Section.

  • Setting Options: Includes settings for the ability to enable or disable course display.
  • Background Color: You can provide a background colour in this field, and your site will display it.
  • Background Image: This area allows you to upload a background image, which will appear on your website.
  • Title Color: The page will be displayed in the Cources Section area of your site if you include Title Color here.
  • Title Font Family: Here, you can specify the Title Font Family, and your website will display the Section Heading in that font.
  • Small Text Color: Sub Text Color is an option here.
  • Small Text Font Family: Text Font Family is acceptable here.
  • Cart Button Background Color: From here, you can add background colour to the cart.
  • Cart Button Text Color:From this point, you can add colour to the cart button text.
  • Cart Button Hover Background Color: The background colour of the cart button can be changed such that it changes colour when the cursor hovers over it.
  • Cart Button Hover Text Color: You could add text colour to the cart button so that it changes colour when you hover over it.
  • Cart Button Font Family: Font-family to cart button text is allowed.

Sale Banner Section

Go to Customize >> Theme Settings >> Sale Banner Section


  • Setting Options: Includes options to allow or disable the display of Our Causes.
  • Background Color: You are able to provide a background colour here, and your website will display it.
  • Background Image: This area allows you to upload a background image, which will appear on your website.
  • Title Color: Section Title Color may be included here.
  • Title Font Family: The Section Title Font Family will be shown on your site if you want to include it here.
  • Sub Title Color: You may include Sub Title Color here.
  • Sub Title Font Family You may include SSub Title Font Family here.
  • Button Title Color You may include button text color from here.
  • Button Title Font Family You may include button text Font-family from here.
  • Button Hover Color You may include button button hover color from here.

Setup Testimonial


In order to proceed with Testimonial,

Plugin "Ecommerce Hub Pro posttype" must first be activated. Only you add Testimonial after that.

To be able to the following section go to Dashboard -> Testimonial -> Add New



Go to Appearance -> Customize -> Theme Settings -> Testimonial


    Do you want this section: You have the option to completely enable or disable this section in this section. If you decide that you do not want this area on your website, simply select the deactivate option, and the section will be removed. And if you want this lovely area to show up on your website, just enable it, and it will.

  • Background Color: You may modify this here the background color for this section.
  • Background Image: You may modify this here the background image for this section.
  • Title Color: You may modify this here the Title Color of this section here.
  • Title Font Family: This choice enables you to add the Title Font Family for this section.
  • Small Title Color: This choice enables you to add the color to Small Title.
  • Small Title Font Family: This choice enables you to add the Small Title Font Family for this section.
  • Testimonial Color: This choice enables you to add color to Testimonial Color for this section.
  • Testimonial Font Family: This choice enables you to add the Testimonial Font Family for this section.
  • Box Background Color: This choice enables you to add background color to the box.

Setup Best Seller Section

First activate "Woocommerce" plugin. Then only you add Products



To be able to the following section, follow the below steps

First you need to create category.

1. Go to Dashboard -> Products -> Categories->Add New



2.Go To Dashboard -> Products -> Add New

3. Add the Best Seller Section, Go to Appearance -> Customize -> Theme Settings -> Best Seller Section

4. The section's colours can also be changed, including the background and text colors.



Follow these instructions to setup Best Seller Section.

  • Setting Options: Includes settings for courses display enable / disable option.
  • Background Color: You may include Background Color here and the Background Color will be displayed of your site.
  • Background Image: You may include Background image here and the Background image will be displayed of your site.
  • Title Color: You may include Title Color here and the page will be displayed in Cources Section section of your site.
  • Title Font Family: You may include Title Font Family here and the Section Heading will be displayed of your site.
  • Small Text Color: You may include Sub Text Color here.
  • Small Text Font Family: You may include Text Font Family here.
  • Number of Product to show: You may include number of product to be viewed in you website.
  • Select Product Category:Here, you can choose a product category, and the products will then be displayed in accordance with that category.
  • Product Content Color:You may include color to product content.
  • Product Content Font Family: You can Font Family tp product content.

Setup Our Sponsors



In order to proceed with Our Sponsors,

Go to Appearance -> Customize -> Theme Settings -> Our Sponsors


Follow these instructions to setup Our Sponsors.

  • Do you want this section: You have the option to completely enable or disable this section in this section. If you decide that you do not want this area on your website, simply select the deactivate option, and the section will be removed. And if you want this lovely area to show up on your website, just enable it, and it will.
  • Background Color: This is where you can change the section's background colour. This section's background is white, as can be seen in the screenshot. You can change the hue to whatever one you like.
  • Background Image: You may choose an image to serve as this section's background here.
  • Number of boxes to show: The number of partners you want to display in this section can be entered here.
  • partner Image: The sponsor image for each partner you want to display in this section can be changed here.

Setup Newsletter Section



In order to proceed with Campus,

First activate "Contact Forms 7" plugin. Then only you add contact form

Go to dashboard -> contact -> Add New


Go to Appearance >> Customize >> Theme Settings >>Newsletter Section



Setup Newsletter Section

  • Do you want this section: You have the option to completely enable or disable this section in this section. If you decide that you do not want this area on your website, simply select the deactivate option, and the section will be removed. And if you want this lovely area to show up on your website, just enable it, and it will.
  • Content: Here, You may include the content of footer.
  • Small Title Color: You may modify this here the Small Title Color from here.
  • Small Title Font Family: You may modify this here the Small Title Font Family from here.
  • Title Color: You may modify this here the Title Color from here .
  • Title Font Family: You may modify this here the Title Font Family from here.
  • Background Color: You may modify this here the Background Color of Newsletter if you want.
  • Background image: You may modify this here the Background Image of Newsletter if you want.

Setup Latest Post



In order to proceed with Latest Post,

To be able to the following section go to Dashboard ->Posts -> Add New



Go to Appearance -> Customize -> Theme Settings -> Testimonial


    Do you want this section: You have the option to completely enable or disable this section in this section. If you decide that you do not want this area on your website, simply select the deactivate option, and the section will be removed. And if you want this lovely area to show up on your website, just enable it, and it will.

  • Background Color: You may modify this here the background color for this section.
  • Background Image: You may modify this here the background image for this section.
  • Title Color: You may modify this here the Title Color of this section.
  • Title Font Family: This choice enables you to add the Title Font Family for this section.
  • Latest Post Color: This choice enables you to add color to the Latest Post for this section.
  • Latest Post Font Family: This choice enables you to add Font Family to Latest Post for this section.

Setup About Section

In order to proceed with About Section,

Go to Appearance -> Customize -> Theme Settings -> About section



Follow these instructions to setup About Section section

  • Do you want this section: Includes options to enable or hide the About display.
  • Background Color: You are able to provide a background colour here, and your website will display it.
  • Background Image: You may include Background image here and the Background image will be displayed of your site.
  • Right image: You may include image here that will be displayed in right side of the section.
  • Small Title Color: You may include Title Color here and the Title Color will be displayed of your site.
  • Small Title Font Family: You may include Title Font Family here and the About Section Title Font Family will be displayed of your site.
  • Sub-Title Color: You may include Sub Title Color here and the About Section Sub Title Color will be displayed of your site.
  • Sub-Title Font Family: You may include Sub Title Font Family here and the Sub Title Font Family will be displayed in About Section of your site.
  • Content Color: You may include color to the content and it will be displayed in About Section of your site.
  • Content Font Family: You may include Font Family to the content here and it will be displayed in About Section of your site.
  • Button Text Color: You may include color to button text and it will be displayed in About Section of your site.
  • Button Text Font Family: You may include Font Family to button text and it will be displayed in About Section of your site.
  • Button Text Background Color: You may include background color to button text and it will be displayed in About Section of your site.
  • Button Text Hover Color: You may include color to button text and whrn you will hover on it the color will be changed.You may include Background image here and the Background image will be displayed of your site.
  • Button Text Hover Background Color: You may include background color to button text so that when you hover on it the background will change.

Setup Blog Page


Go to Appearance -> Customize -> Theme Settings -> Blog Page


Setup Social Icon

In order to configure Social Icon Section,

Go to Appearance >> Customize >> Theme Settings >>Social Icon Section



Follow these instructions to setup Social Icon.

  • Add Facebook Link: You may include facebook link here and the facebook icon will be displayed of your site.
  • Add twitter link : This choice enables you to add twitter link to your site. Adding twitter link adds twitter icon of your site.
  • Add Instagram Link: You may include instagram link here which will add instgram icon.
  • Add Youtube Link: You may include Youtube link here.
  • Add Pinterest link : This choice enables you to add pinterest link.
  • Add Linkedin link : This choice enables you to add linkedin link to your site. Adding Linkedin link adds Linkedin icon of your site.
  • Add Tumblr link : This choice enables you to add Tumblr link.
  • Add GooglePlus Link: You may include GooglePlus link here which will add GooglePlus icon.
  • Add Flickr link : This choice enables you to add Flickr link.
  • Add VK Link: You may include VK link here which will add VK icon.

Setup Footer Section



In order to proceed with Footer,

Go to dashboard -> Widgets


Go to Appearance >> Customize >> Theme Settings >>Footer Section



Follow these instructions to setup Footer Section.

  • Do you want this section: This section allows you to enable/disable this section altogether. In case, if you don't want this section on your site, just click on disable option and this section will disappear from your site. And if you want this wonderful section to appear on your site, just be it enabled and it will appear on your site.
  • Footer Heading Color: You may modify this here the Footer Heading Color of footer
  • Footer Heading Fonts: You may modify this here the Footer Heading Fonts of footer.
  • Footer Content Color: You may modify this here the Footer Content Color of footer.
  • Footer Content Fonts: You may modify this here the Footer Content Fonts of footer.
  • Background Color: You may modify this here the Background Color of footer if you want.
  • Background image: You may modify this here the Background Image of footer if you want.
  • Logo image: You may modify this here the Logo image of footer if you want.
  • Border Color: You may modify this here the Border Color of footer if you want.

Setup Contact Section



In order to proceed with Contact,

Go to dashboard -> Contact


Go to Dashboard >> Pages >> Add new.

Go to Appearance >> Customize >> Theme Settings >>Contact Section



Follow these instructions to setup Contact Section.

  • Contact Heading Color: You may modify this here the Contact Heading Color of footer
  • Contact Heading Fonts: You may modify this here the Contact Heading Fonts of footer.
  • Contact Content Color: You may modify this here the Contact Content Color of footer.
  • Contact Content Fonts: You may modify this here the Contact Content Fonts of footer.
  • Background Color: You may modify this here the Background Color of Contact if you want.
  • Background image: You may modify this here the Background Image of Contact if you want.

Setup Footer Text



In order to proceed with Footer Text,

Go to Appearance >> Customize >> Theme Settings >>Footer Text

Plugins

Plugins are ways to extend and add to the functionality that already exists in WordPress.
How to activate plugins

If you want these features in your theme, you must activate the plugin. In order to activate the plugin in your theme, follow these instructions.

Go to Plugins >> Installed Plugins >>Ecommerce Hub Pro Posttype >>Activate


When a plugin is activated, your admin navigation will now include five additional options: Services, Project, Team, Customers, and Testimonials. Because the plugin is active, you may see these five options in the image's admin navigation.

Once you enable the plugin, these five sections are instantly added to your website. This is a screen image of the same.

You can see that some sections have been added, but their contents are missing. Use these guidelines when adding content to these areas.

Plugin "Ecommerce Hub Pro Posttype" must first be activated. Only you can then add Testimonials.

To add Testimonials, Go to Testimonials. >> Add new


As in the image above, you can also add a designation.


In this way, you can set up Testimonials.


Page Templates and sidebars

Page Templates

  • Default Template (the default page template with a right sidebar position)
  • Advance Search (the advance search page template with no sidebar position)
  • Page (Left Sidebar) (a page templates with left sidebar position)
  • Page (Right Sidebar) (a page template with right sidebar position)
  • Blog (Full Width) (a blog templates with one column without sidebar)
  • Blog (Left Sidebar) (a blog templates with left sidebar position)
  • Blog (Right Sidebar) (a blog template with right sidebar position)
  • Contact (the default Contact template with no sidebar position)
  • Home Page (the default home page template with right sidebar position)

Post, Categories and Post Formats


Adding category

For further details on adding categories, look at the following article: http://codex.wordpress.org/Manage_Categories_SubPanel

  1. Log into your WordPress Administration Panel (Dashboard).
  2. Click the Posts tab.
  3. With that done, click Categories for blog posts.
  4. Type in the name of your new category.
  5. After that, click the Add New Category button.
Click the Publish button.

Creating a Blog post

  1. Log into your WordPress Administration Panel (Dashboard).
  2. Click the Posts tab.
  3. Click the Add New tab.
  4. Type in your post content. For more information on adding posts, please check the following link http://codex.wordpress.org/Posts_Add_New_SubPanel.

Shortcodes

A shortcode is an effective tool for creating content. http://codex.wordpress.org/Shortcode. Using shortcodes is simple. Make sure that Visual editing mode is selected first.


Check out the Themes' list of available shortcodes.:

  • [charity-fundraiser-pro-testimonials]
  • [charity-fundraiser-pro-team]

Widgets