Pet Shop Pro WordPress Theme Documentation

Introduction

Thank you for buying our WordPress Theme. The complete procedure to configure and manage a WordPress Website from the beginning is shown in this documentation in different portions.

What is WordPress CMS?

WordPress is an open source tool which is based on PHP and MySQL to create websites. It is a completely free content management system(CMS) and a strong blogging platform. With this CMS, you can develop websites and solid online apps. You hardly require any knowledge or technical capability to manage it. WordPress has become the most accepted website development software available because of it’s varied aspects like it’s easy usage and flexibility.Learn More

What is a WordPress template

A WordPress template acts as a skin for the websites which are created on WordPress CMS. The installation of a WordPress Template is very easy. With the help of an installed new template, you can change the look of your WordPress website very easily. All the requisite source files are provided with a WordPress template and you can freely go for editing and increasing it the way you want.

Help and Support

Files structure

The template package you have downloaded consists of several folders. Let's see what each folder contains:

  • Screenshots : contains template screenshots. Not for production.

  • Theme : contains WordPress theme files.

  • pet-shop-pro_1.0.zip : this folder content all the necessary files for the theme.

  • license.txt : contains license details.

  • readme.txt : contain information about theme images path and font use and usage scritps.

Template Installation

Template installation is very easy process.

Step 1. Theme Installation

First thing you need to do is login to your WordPress admin area. Next, click on

All installation steps can be done within WordPress interface. It makes process comfortable and fast.

Go to the menu Appearance Appearance Themes.

Once you are on the themes page, click on the Add New button at the top.

Click on upload theme button.

Click on Browse Button then select your tc-ecommerce-shop_pro.zip theme and click on Install Now Button..

WordPress will now install your theme and show you a success message along with the link to activate or live preview.

Congratulations, your theme have been successfully installed!

Step 2. Install a Theme using FTP

Your second installation option is to upload the theme via FTP. For this method first log into your site via FTP and browse to your folder located at wp-content/themes. Unzip the theme file you downloaded and upload only the extracted Total folder to your server.

Next log into your WordPress site and navigate to Appearance Themes to activate Total.

Section Color / Font Palette

Color/Font is very easy process. We have given these options in all sections of customizer. It is a complete image to show you about color and font palette. At a single glance of click you can set the color and fonts of the Headings, Paragrapgh and Buttons.

Every individual section have an option to set the color palette for Headings, Title/Text, Paragraph, Button Text and Button Background depending upon the number of option that are available in that respective section

Default Color / Font settings

How to set up homepage

Once you view your site after activating the theme, You will see the index page with the latest post. Now you will need to setup the home page template to show all the demo section on your front page.

Setup Home Page Template

Follow these instructions to setup Home page.

1. Create Page to set template : Go to Dashboard Pages Add New Page.

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

Once you have done with this you can see all the demo content on front page.

Setup Slider

Follow these instructions to setup slider.

Go to Appearance Customize Theme Settings Slider Settings. .

Headshot photo

  • Setting Options : Includes settings for Slider Section display enable / disable option.

  • Number Of Slide To Show : Allow you to select no. of slides you would like to display.

  • Slider Image : Here you can set the images for slider.

  • Slide Title : Here you can set the title on slider.

  • Slide Description : Here you can add description on slider.

  • Slider Button Appointment : Here you can add Text on button Instead of Appointment.

  • Slider Button Read More : Here you can add Text on button Instead of Read more.

  • Slide Link : Here you can add link for respective buttons.

  • Slider Heading Color and Font Family options : Contains color options for heading and it's font family.

  • Slider Text Color and Font Family : Contains color options for text and it's font family.

  • Slider Button Color and Background Color (next/previous): Contains color options for Background and font and it's font family.

  • Slider Button Color and Background Color (Appointment/Read more): Contains color options for Background and font and it's font family.

  • Slider Button Hover Color : Contains color options for Button on mouse over.

  • For more information go to the Navigation tab.

Pet Supplies

You have Five Tabs in this section with sliding Products. Each Tab have different product(s) to show. Here you can add products. You can add product image, product name, regular price of product & sale price of product. Here you can rate particular product and add to cart option available.

In order to proceed with Pet Supplies section,

Go to Appearance Customize Theme Settings Pet Supplies. .

In this section you can set the following points;

Headshot photo

  • Setting Options : Includes settings for Featured Products Section display enable / disable option.

  • Background Color Option : Contains background color option for specific section layout.

  • Background Image Option : Contains background image option for specific section layout.

  • Title Option : Contains Text Box For Section Title.

  • Title Bottom Image Option : Contains Image options for Title Bottom Border Decoration.

  • Tab Title: Contains Text Box For Tab Title.

  • Select Tab Category: Contains Dropdown options To Select specific product Category.

  • Section Title Color And Font: Contains Font and color option for Section Title.

  • Section Tab Border and Background Color Option: Contains Color options To Change color of tab border and background.

  • Section Tab Font Option: Contains Option to change Font Option.

  • Section Active Tab Color Option: Contains Color options for current active tab.

  • Section Tab Color On Hover: Contains Option to change Tab Font color On mouse over.

  • Tab Slide Button Background Color and button Option: Contains Option to change color of carousel button icon and background.

  • Tab Slide Button Background Color and button Option on Hover:Contains Option to change color of carousel button icon and background on mouse over.

  • Product Price color, fonts and Background Color: Contains Option to change price color, fonts and background color .

  • Product Title color and Fonts:Contains Option to change color product title and font.

  • Product Price color, fonts and Background Color: Contains Option to change price color, fonts and background color .

  • Product Button color and background Color:Contains Option to change color of button and background.

  • Product Background Color: Contains Option to change Background of product box .

  • Product Button color and Background Color On Hover: Contains Option to change color and Background of Add to cart button.

Go to Dashboard Product Add New

First got products and add new, then set your product name, discription about product, regular price of the product, set sale price of product, then you can set product image, you can add product gallery and choose the category of product in which you want to show the product.

Our Services

In this section you can see the Posts as pet services. The pet services option available in the Dashboard . To add content and service through the dashboard, One need to Install Posy type plugin available with The theme .

In order to proceed with Our Service section,

Go to Appearance Customize Theme Settings Our Services..

Headshot photo
  • Setting Options : Includes settings for Featured Products Section display enable / disable option.

  • Background Color Option : Contains background color option for specific section layout.

  • Background Image Option : Contains background image option for specific section layout.

  • Title Option : Contains Text box to change the title of section.

  • Title color font Option : Contains options to change title color and font.

  • Title Bottom Image Option: Contains Option to change Title Bottom Image

  • Heading color and font Option : Contains Option to change heading color and font.

  • Text Color and font : Contains Option to change Content color and font.

  • Number of Content to show :Contains Option to Set Number of Contant display In this Section.

  • Left and Right Image : Contains Option to Set side Image In This Section (make sure You Upload a Transparent Image).

Here you can Change the Post title, Image and Content.

Our Team

In order to proceed with Our team section,

Go to Appearance Customize Theme Settings Our Team

In order to proceed with Setup Our Team Section,

In this section you can set the Our team Title, :

Headshot photo

  • Setting Options : Includes settings for View Collection Products Section display enable / disable option.

  • Background Color Option : Contains background color options for specific section layout.

  • Background Image Option : Contains background image options for specific section layout.

  • Section Heading Color and Font Family : Contains color options for heading and it's font family for specific section.

  • Section text Color and Font Family : Contains color options for sub heading and it's font family for specific section.

  • Section Button Background Color Option : Contains color options for slider button for specific section.

  • Section Button Text color and it's font family : You can change the button text, background color, text color and it's font family for specific section.

Why Choose Us

In this section you have Heading Content and button to display Information About Why choose us which can be changed through the customiser.

In order to proceed with Why choose Us Section,

Go to Appearance Customize Theme Settings Why Choose Us..

In this section you can set the following points;

Headshot photo

  • Setting Options : Includes settings for Women's Products Section display enable / disable option.

  • Background Color Option : Contains background color options for specific section layout.

  • Background Image Option : Contains background image options for specific section layout.

  • Section Heading Color and Font Family : Contains color options for heading and it's font family for specific section.

  • Content Text Color and Font Family : Contains color options for Text and it's font family for specific section.

  • Button text and link : Contains Text box and Link to redirect to tghe specific page.

  • Button Text Color
  • Button text color and font :Contains color options for Text and it's font family for specific section.

  • Button Background Color and hover color: Contains color options for to change background of button

Testimonial

In order to proceed with Our team section,

Go to Appearance Customize Theme Settings Testimonial

First, you have to Install post type plugin then write posts under testimonial through Dashboard.

Go to Appearance Customize Theme Settings Testimonial.

In this section you can set the following points through the customizer:

Headshot photo

  • Setting Options : Includes settings for New Arrivals & Best Sellers Section display enable / disable option.

  • Background Color Option : Contains background color option for specific section layout.

  • Background Image Option : Contains background image option for specific section layout.

  • Title for testimonail section : To set the title for testimonial section.

  • Title Color and Font Family : Contains color options for heading and it's font family for specific section.

  • Heading Color and font : Contains color and font option for posts.

  • Text Color and font option : Contains color options for heading and it's font family for specific box.

Our Blog

In this section you have a slider for your posts where can post Blog. You can set a image for Our Blog, add description for it, set member name & the designation of member.

In order to proceed with What People Say Section,

Go to Dashboard Post Add New.

To add a blog first you have to add a blog title. You can add the discription about your blog and set a blog image.

Go to Appearance Customize Theme Settings Our Blog..

In this section you can set the section Heading, Background Image & Backround Color.

Headshot photo

  • Setting Options : Includes settings for Our Blog Section display enable / disable option.

  • Background Color Option : Contains background color option for specific section layout.

  • Background Image Option : Contains background image option for specific section layout.

  • Select Category : Contains dropdown options to select category to display specific category Blogs.

  • Title color and fonts : Contains color and font option.

  • Date background, font color and date font : Contains color options for date and it's font family for specific section.

  • Heading color Font Family : Contains color options for Heading and it's font family for specific section.

  • Content color and fonts : Contains color and font option.

  • Button Background color and hover color : Contains color options for button background and mouse over color.

  • Blog Box Background Color : Contains color options for Blog Box.

Footer Text

In order to proceed with Footer section,

Go to Appearance Customize Theme Settings Footer Text..

In this section you add all the Copyright Text which to display.

Contact

In order to proceed with Contact section,

Go to Appearance Customize Theme Settings Contact..

  • Add ShortCode from Contact Form : Add Chort code from contact form 7.

  • Longitude : To set jio location for map.

  • Latitude : To set jio location for map.

  • Contact Form Background Color : Contains color options for contact form Backgroud.

  • Contact Form Font Color and fonts : Contains color and font options contact content.

  • Add your quote content here: Text editor to write what ever you7 want to add to show your creativity.

Theme Plugin

How to set up Pet Shop Pro Post Type Plugin

1. First, you need to download the plugin from the source (which will be a zip file (pet-shop-pro-post-type.zip)). Next, you need to go to WordPress admin area and visit Plugins » Add New .

2. After that, click on the Upload Plugin button on top of the page.

3. This will bring you to the plugin upload page. Here you need to click on the choose file button and select the plugin file you downloaded earlier to your computer.

After you have selected the file, you need to click on the install now button.

WordPress will now upload the plugin file from your computer and install it for you. You will see a success message like this after installation is finished.

Once installed, you need to click on the Activate Plugin link to start using the plugin.

Posttype Configuration

There are three register posttype namely: Our Team, Testimonials and Pet Services on the Dashboard. This will help you to setup team and testimonail Sections.

1. Our Team

In order to showcase your "Our Team" section on your home page

Go to Dashboard:-> Our Team >> Add New

Fill the details event name,description, and it's featured images.

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

it will appear like this on your front page.

2. Pet Services

In order to showcase your "Pet Services" section on your About Us page

Go to Dashboard:-> Pet Services >> Add New

Fill the details event name, description, and it's featured images.

it will appear like this on your front page.

3. Testimonial

Similarly In order to show your Testimonial, follow the below steps.

Go to Testimonial >> Add New Post

Fill the details event name, description, and it's featured images.

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

it will appear like this on your front page.

TC Title Banner

In order to show your Banner Image, follow the below steps.

Go to Pages >> select page

it will appear like this on your front page.

Child Theme & Hooks

Custom theme editor is the easy process for editing the site, if you have to add section in the site, you can easily edit in child theme it can be change in parent theme.

Hook code below Slider

Hook code below Our Services

Hook code below Gallery

Hook code below Our Team

Hook code below Why Choose Us

Hook code below Testimonials

Hook code below Our Blog

Hook code below footer

Page Templates and Sidebars

Page Templates

  • Default Template (The default page template with a right sidebar position)

  • Home Page Template (Front page with the demo content)

  • About Template (The about template with no sidebar position)

  • Shop Template (A page templates with left sidebar position)

  • Blog Template (A page template with right sidebar position)

  • Contact Template (The default Contact template with no sidebar position)

Posts, Categories and Post Formats

Adding category

Review the following article for more information on adding categories: http://codex.wordpress.org/Manage_Categories_SubPanel

  • Log into your WordPress Administration Panel (Dashboard).

  • Click the Posts tab.

  • With that done, click Categories for blog posts.

  • Type in the name of your new category.

  • After that, click the Add New Category button.

Click the Publish button.

Creating a Blog post

  • Log into your WordPress Administration Panel (Dashboard).

  • Click the Posts tab.

  • Click the Add New tab.

  • 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 a powerful content building tool http://codex.wordpress.org/Shortcode Shortcodes are easy to use. First of all, make sure that the editing mode is set to Visual.

All available shortcodes are conditionally divided into these groups:

  • Gallery [tc-innergalleryshow tc_gallery=”142″] - used for Gallery images output.

Custom Widgets

How to Setup Additional Theme Add Ons

1.First, you need to download the plugin from the source (which will be a zip file (tc-title-banner-image.zip and tc-gallery-images.zip)). Next, you need to go to WordPress admin area and visit Plugins » Add New page.

2.After that, click on the Upload Plugin button on top of the page.

3.This will bring you to the plugin upload page. Here you need to click on the choose file button and select the plugin file you downloaded earlier to your computer.

4.After you have selected the file, you need to click on the install now button.

5.WordPress will now upload the plugin file from your computer and install it for you. You will see a success message like this after installation is finished.

6.Once installed, you need to click on the Activate Plugin link to start using the plugin.