Installing Cloth

Backbone Installation

Before you can fully use the powerful features of Cloth theme you need to install Backbone as it parent theme:

1. Download and install Backbone theme from your member area. After you finish downloading open your WordPress dashboard → Appearance → Themes → Install upload your backbone.zip or
2. After downloading backbone.zip extract that file into your computer drive then open your FTP using 3rd party software like FileZilla then go to Public HTML → WP-content → themes. Upload your Backbone folder there

Start of page

There are two ways to install Cloth theme on your WordPress:

1. Installing via WordPress Dashboard

1. Navigate to your WordPress Admin Menu and open Appearance → Themes section
2. Switch to Install Themes tab
3. Select Upload
4. Browse for backbone.zip file on your computer and install it
5. Browse for cloth.zip file on your computer and install it
6. Activate Cloth theme

2. Installing via FTP

1. Open your FTP Client Application (example : FileZilla)
2. Fill the login details (host, username, and password) then press Quickconnect
3. Go to ‘wp-content’ folder
4. Go to ‘themes’ folder
5. Extract backbone.zip and cloth.zip files into your local drive search the current location and upload backbone and cloth folder

Got an error during installation process? Try the following:

• If you are upgrading the vidio theme via WordPress Admin menu open your ‘cloth.zip’, rename the ‘cloth’ folder before uploading. Eg: cloth2. Then press Enter
• Make sure if you already got the lastest version of Backbone
• Make sure you are using the latest version of WordPress
• Make sure your hosting is running the latest version of PHP and MySQL
  Try to upload manually via FTP (FileZilla)

Start of page

Theme Overview

Front Page

Category Page

Single Product Page

Start of page

Installing Plugin

Sneakers Addict theme can be run within of of these 3 plugins. They are WP e-Commerce plugin, Jigoshop plugin and WooCommerce plugin.

1. Installing WP e-Commerce plugin

1. Navigate to WP e-Commerce plugin homepage and download the plugin package
2. Navigate to your WordPress Admin Menu and open Plugins → Add New → Upload
3. Browse for .zip file on your computer and install it
4. Activate plugin

2. Installing Jigoshop plugin

1. Navigate to Jigoshop plugin homepage and download the plugin package
2. Navigate to your WordPress Admin Menu and open Plugins → Add New → Upload
3. Browse for .zip file on your computer and install it
4. Activate plugin

3. Installing WooCommerce plugin

1. Navigate to WooCommerce plugin homepage and download the plugin package
2. Navigate to your WordPress Admin Menu and open Plugins → Add New → Upload
3. Browse for .zip file on your computer and install it
4. Activate plugin

Start of page

General Settings

Before you can start creating some content these are the first-time settings that you have to do:

1. Go to Cloth dashboard → General Settings. (To operate our new theme panel you can drag and drop the menu icon to the right blank space)
2. You can choose to use logo or blog title at logo/title section.
   The best resolution for the logo is 100 x 42 px, and for both logo or title at the bottom of it you there will be your blog tagline (blog description, you can set this at WordPress dashboard → Settings → General).
3. At Cloth theme you can set at where comments template should visible. You can set it visible at post or page only or maybe visible for both of them
4. There will be an option to choose pagination styling you can choose to use WordPress Page Navi like or maybe Blog like (next and previous link)
5. Some of you maybe want to erase or hide the breadcrumbs at the top of your post(s) or page(s). Now at cloth template we provide that for you, you can choose whether the breadcrumbs will be visible or not
6. Spam is a serious problem for some people, Cloth theme already integrated with Re-Captcha to protect your site from spam. But to activate this feature you will need Re-Catpcha private and public key

Start of page

Front Page Settings

You can set your front page look like by following these instructions:

1. Go to Cloth dashboard → Front Page Settings
2. Cloth have slider area called headline slider. At this section you can set which product category (product category is coming from the e-commerce plugin there are: WooCommerce, JigoShop, and WP-E Commerce) you want to display there
3. There are also New Arrivals section which will take every new product you publish but this section will not displaying any product which category attached to slider section, so there will be no double post at your front page.
   At this option you can set how many new arrivals products you want to display
4. There will be an option to set how many featured products you want to display. Featured section setting available when you add a product, at add product page you will notice if there will be an option to set your product will be set as featured or not. And this section will take every posts you set as featured product, you can also limit how many items you want to display at featured section
5. And the last is blog section, besides you can sell a product you can also create a regular post. At front page Cloth will displaying your blog post(s) depends on your choice at this option, you can set how many blog post you want to display at front page

Start of page

Page Settings

This page settings contains settings for landing page. Before launching your site make sure if you already set this option well. Further instruction to make page template you can check it at the bottom of this page.

1. Go to Cloth dashboard → Page Settings
2. Set a page without template as a landing page for new arrivals product
3. Set a page with ‘featured product’ template as a landing page for featured product
4. Set a page with ‘blog’ template as a blog posts page

Start of page

Social Networking

Like our others theme, Cloth also can integrated with some social networking. To set them you have to:

1. Go to Cloth dashboard → Social Networking.
   Any social networking link you filled that social networking will active so if you don’t want some social networking appear at your site don’t type anything at that link box
2. You can also display auto share at your page(s) or post(s) by click (choose) any of available share buttons. To make it works make sure if you already fill the social link at point #2

Start of page

Subscribe Settings

1. To set Cloth subscribe settings please go to Cloth dashboard → Subscribe Settings
2. You visitors can be your subscribers. To make it happen first you have to get your own FeedBurner ID and fill it at the subsrcibe box
3. If you don’t want to display RSS icon and subscribe box or don’t have FeedBurner ID you can deactivate this option to hide it from your site. But if you already have FeedBurner ID please check this box to make RSS icon and subscribe box visible at your site

Start of page

Analytics ID, RSS Feed Settings

1. Go to Cloth dashboard → Analytics ID, RSS feed
2. Presstrends tracking is our feature to know how our customer use our theme, we use this feature for the next upgrade of theme you use. But there will be no personal information we get, so your privacy is safe.
   It’s your choice to use it or not
3. If you want to have a subscriber then you will need FeedBurner URL (you can get this when you get FeedBurner ID), by this feature your subscribers will get an e-mail about your new post(s) or product(s)

Start of page

Footer Settings

1. Go to Cloth dashboard → Footer Settings
2. If you want to have your own text at footer you can check ‘enable custom footer left/right’ then type your text at available box. At this box you can type any HTML code like © (copyright icon)

Start of page

Post Settings

1. Go to Cloth dashboard → Post Settings
2. At this option you can choose to display or hide the author information below post
3. Cloth also have a feature to displaying related posts by tags at the end of your post

Start of page

Single Ad

1. Go to Cloth dashboard → Single Ad
2. You can choose these option enable or disable by click on it.
   At this option you can also insert any AdSense code or image (the best resolution is 468 x 60px) with a destination link

Start of page

Adding Product

1. Go to your e-commerce plugin add product page, after typing the title or product name please create product category so you can add the categories to headline slider section
2. Insert any additional information about this product like price, dimensions, etc.
3. For product image make sure if you add it at featured image not post image

Start of page

Creating a Page With Template

Cloth have several page templates you can use. Please follow the instructions below:

Start with make a new page then have a look for right sidebar at ‘Page Attributes’. You can select Blog, Contact Form, Featured Product, and Sitemap.
All of them don’t need any body content so after type the title and select the template you can go on to publish the page. And also there is an option to set the content alignment. You can set to hide the sidebar (full width content), left content or right content.

Start of page

Blog Template

Contact Template

Sitemap Template

Left Content

Right Content

No Sidebar (Full Width Content)

Start of page

Menu Configuration

Cloth theme support one slot WordPress Custom Menu. Here are the instructions to set it up:

1. Navigate to Appearance → Menus section.
   Click on “+” to create a new menu, press Save Menu button to register your newly created menu
2. Add Pages, Categories or Custom Links to your menu. Drag and drop items from your menu to put them in the order you want it to create parent-child menus. Don’t forget to save your modification
3. Assign your menu to Theme Locations

Start of page

Import / Export Settings

At the new ColorLabs theme we added import / export feature for you who have to manage several sites but want all of it have the same settings. To make it please follow these instructions:

Start of page

1. If you take a look at cloth.zip you will find dummy content folder which contains 2 files: json and xml file.
   If your site want to be setted like our demo you can upload the json file at these option
2. Or if you already have one site and want to make or manage the other to have the same settings as you did at your first site. You can download the export file (json file) and upload it to your another site then it will have the same settings

Start of page

Using WP e-Commerce plugin

WP e-Commerce plugin will generate a new additional panel on your WordPress dashboard. It is Products panel. It contains 6 sub menus, they are:

1. Products: Similar to All Post panel, you can add, edit or delete product you want to show on your website
2. Ad New: Within this menu, you can add new product on your website. There are some additional sub-panel to specify your product specification. They are:
• Product Tags: Similar to post tags, you can specify tags for your each product
• Product Categories: Similar to post categories, you can specify which categories your product belongs to
• Price Control: Specify a price for your product
• Stock Control: You can control the stock of your product in this menu
• Taxes: Specify a taxable amount if your product is taxable
• Variation Panel: Use this panel if your product has a variation. (e.g. color, size, etc)
• Off Site Product Link: Use this panel if your product is also for sale on another website. Specify an external link where your product is sold
• Additional Description
• Product Download: If your product is available to download, you can attached its file into this panel. A maximum file size allowed is 128 M
• Product Images: Specify an image for your product
• Shipping: Specify a shipping information for your product
• Advanced Settings: Within this menu, you can specify an advanced settings for your product (e.g. custom meta, merchant notes, enable/disable comment, etc)
3. Product Tags: Similar to post tags, you can add, edit, and delete your product tags you would use in your website
4. Product Categories: Similar to Categories, you can add, edit, and delete your ad categories you would use in your website
5. Variations: Add, edit, and delete your product variations on your website
6. Coupon: Specify a coupon details if any

Start of page

Using Jigoshop plugin

After you have installed Jigoshop plugin, it will generate some new additional panels on your WordPress dashboard. They are Jigoshop, Products and Orders panel.

1. Jigoshop panel contains 3 sub menus. They are:
• Dashboard: Dashboard panel contains a general information about your products (e.g. stock) and sales performance (e.g. number of sales per day, orders)
• Settings: Within this menu, you will find some configuration options for Jigoshop plugin
• System Information
2. Products panel. It contains 6 sub-menus. They are:
• All Products: Similar to All Post panel, you can add, edit or delete product you want to show on your website
• Add Products: Within this menu, you can add new product on your website. There are some additional sub-panel to specify your product specification. They are:
1. Product Categories: Similar to post categories, you can specify which categories your product belongs to
2. Product Tags: Similar to post tags, you can specify tags for your each product
3. Product Data: Within this menu, you can specify the specification of your product. There are general information, pricing information, inventory information and attributes information available to specify
• Product Categories: Similar to Categories, you can add, edit, and delete your ad categories you would use in your website
• Product Tags: Similar to post tags, you can add, edit, and delete your product tags you would use in your website
• Variations: Add, edit and delete your product variations on your website
• Attributes: You can specify an extra data for your product (e.g. size, color)
3. Orders. It contains 2 sub-menus. They are
• All Orders: Within this menu, you can manage all orders of your products sold on your website
• Add Order: Within this menu, you can add new order based on your customer information

Start of page

Using WooCommerce plugin

WooCommerce plugin will generate 2 new additional panels on your WordPress dashboard. They are WooCommerce panel and Products panel.

1. WooCommerce panel contains 4 sub menus. They are:
• Settings: Within this menu, you will find some configuration options for Jigoshop plugin
• Reports: Dashboard panel contains some report about your sales, customers and stock
• Orders: Within this menu, you can manage all orders of your products
• Coupons: Specify a coupon details if any
2. Products panel. It contains 5 sub-menus. They are:
• Products: Similar to All Post panel, you can add, edit or delete product you want to show on your website
• Add Products: Within this menu, you can add new product on your website. There are some additional sub-panel to specify your product specification. They are:
1. Product Type and visibility: Specify your product type and visibility. Specify is your product a virtual product or not, a downloadable product or not and is it featured product or not
2. Product Data: You can specify the specification of your product. There are general information, tax information, inventory, sells information, attributes information and grouping information available to specify
3. Product categories: Similar to post categories, you can specify which categories your product belongs to
4. Product Tags: Similar to post tags, you can specify tags for your each product
• Product Categories: Similar to Categories, you can add, edit and delete your ad categories you would use in your website
• Product Tags: Similar to post tags, you can add, edit and delete your product tags you would use in your website
• Attributes: You can specify an extra data for your product (e.g. size, color)

Start of page

Read Me

Our team also add read me file which you can access from Cloth → Read Me.
At this file we add several important guides for you to set the site or information about useful plugins and tips to make your site better.

Start of page