### “SmartIT Theme” Documentation by “ThemeMakers” v1.0

# “SmartIT Theme”

Created: 09/18/2012
By: ThemeMakers
http://themeforest.net/user/ThemeMakers

Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

## Table of Contents

1. Installation
2. Custom Menus
3. Theme Options
4. Custom Widgets & Locations
5. Supported Plugins
6. Shortcodes
7. Custom Page Templates
8. Post Thumbnails
9. CSS Files and Colour Schemes
10. JavaScript
11. PSD Files
12. Sources and Credits
13. Extended Video Documentation

### A) Installation - top

The theme can be uploaded in two ways:

- FTP upload: Using your FTP program, upload the non-zipped SmartIT folder into the /wp-content/themes/ folder on your server.
- WordPress upload: Navigate to Appearance > Add New Themes > Upload. Go to browse, and select the zipped SmartIT folder. Hit Install Now and the theme will be uploaded and installed.

Once the theme is uploaded, you need to activate it. Go to Appearance > Themes and activate SmartIT theme.

### B) Custom Menus - top

If you use version 3.0+ of WordPress, you can setup custom menus to use with our theme. SmartIT comes with one custom menu location. It is used for the site's main navigation, also you can create more and place them into sidebars if needed.

#### Setting up custom menus (WP3.0+)

Go to Appearance > Menus. Give your menu a name and build it up using little widgets on the right. You can add pages, categories or custom URLs.

Now simply select the theme location for your newly created menus using a widget on the left. Under Primary Navigation, select your menu from the dropdown list, to use it as the site's main navigation.

### C) Theme Options - top

SmartIT comes with a simple to use administration panel. You can access it by navigating to Appearance -> Theme Options. The theme options are conveniently spread over a number of tabs. Each tab contains the options that pertain to a particular area of the theme.

### D) Custom Widgets & Locations - top

SmartIT comes with unlimited widget areas and 6 custom built widgets that can be used multiple times. They can be found under Appearance -> Theme Options > Custom Sidebars. Widget areas are as follow:

### E) Supported Plugins - top

SmartIT comes with a few already inbuilt custom plugins such as:

- Nivo Slider
- Flex Slider
- Revolution Slider
- Fancybox
- Contact Form
- WP-PageNavi
- SEO

Notice: Please understand that we cannot offer compatibility with each and every plugin out there.

### F) Shortcodes - top

The SmartIT theme supports the use of over 20 visual shortcodes for styling purposes. Since current theme we created shortcodes visually, so it would be easiest way to use them, they are come with preview window, so just click to a green PLUS button in your editor and give it a rty.

Feel Free to contact us if you will have any questions.

#### See below a short description about main part of them:

Alerts. Alerts allows to add a blog to the page with four notification's types:info, warning, error, success. In case if you need to warn about something, to share any information or simply to point some particular text out, please use this Alerts shortcode.

Audio. This one helps to add audiofiles to the pages. You need just upload file you would like to add and press Insert Shortcode.

Button. This shortcode helps to add a button to the page. In this shortcode options you can pick color, size, URL and button text.

Charts. Charts shortcode allows the adding of 7 diagram types: Pie Chart, Bar Chart, Column Chart, Geochart, Line chart, Area chart, Combo Chart. In settings to this shortcode you need specify Chart Type, Title, Chart width, Chart height, Background color, Font family, Default font size, Chart titles and Chart data.

Columns. This one helps to split up the text into few columns. To do this you need to pick in Columns settings the following:Column Type (One Third, One Third Last, Two Thirds, Two Thirds Last, One Fourth, One Fourth Last, Three Fourth, Three Fourth Last, One Half, One Half Last and column content in Column Content part. For example, if you need to split up the text into three columns, for first one use shortcode with Column Type One Third, and for the following two columns - One third Last.

Contact form. This shortcode adds to the page the form of contact information,which was created before. To do this you simply need choose the form needed and press "Insert Shortcode"

Dividers. Shortcode of this type adds some divider to the page. Just pick the Divider Style (Solid, Dotted, Dotted With Top Link) and press Insert Shortcode.

Dropcap. Dropcap allows a visual selection of the first letter. In settings you need specify the letter needed, Dropcap Style (No background, Disk Background, Circle Background, Square Green Background or Custom background, also font, color and size.

Google map. This shortcode adds Google map to the page. Settings allow to select hight, width, latitude, length, measure\scale (from 1 to 19), also to add extra functions to work with map - Controls, turn on or turn off the scaling with the help of scrolling up or down, to specify the Map Type (ROADMAP, SATELLITE, HYBRID, TERRAIN), to set marker, to add informational unit or block starting up with map (if the Popup field is ON and text field HTML is not empty than starting up with map the informational window will be shown).

Image. This one adds an image with advanced settings. Upload the image needed, point the link where exactly the new window will be opened due to this link (self, blank), than point Action (No link on Image, Open link, Show Image in Fancybox), if the Show Image was picked in Fancybox than mark fancybox group, further set is to specify the necessary sizes (Thumb width, Thumb height), pop-up help window - Image alt,Right indent, Left indent, Top indent, Bottom indent, and Link float for an image.

Inline box. Inline box shortcode makes possible adding of blocks\units with title and text by using of six icon types. In settings write some title, link, block text, title for icons and the icon itself Inline box icons set.

List. Here you can make numbered and marked lists. In settings choose List Style (Unordered, Ordered), List type (Type 1 – Type 6), in List items field put list elements using the divider symbol "`"

Pricing tables. This shortcode can create styled tables with prices. In setting note some Table Title, Table Style (Dark Large, Light Medium, Dark Small), Currency, Integer Price, Fractional Price, Price description, Table Position (Non Last, Last), Text Content, List Content, Button link, Button text, Button type (Green, Gray, Dark Gray, Black, Orange, Cyan, Red, Dark Violet, Violet, Blue).

Quotes. Overhere you can make a selection needed in text. And simply put text you would like to add in input field and pick Float (none, Left, Right).

Table. Table shortcode adds data tables of different types. Put a Heading and pick the Data Type and Column Name, the next step is to put table rows\lines in Data Area following specified Types and dividing rows\lines by special Tilda Symbol.

Twitter. This one can add all your last messages from Twitter. You simply need to put your Twitter username and count of tweets.

Tabbed Content. With the help of this shortcode you can add styled tables to the page. Put Tab Titles and Tab Content.

Title. By dint of this shortcode it's possible to add styled titels to the page. Follow this scheme - specify Title text, than - Hide or Show border, Title size (h1-h3), font size, Line height, Font family, bottom indent, and Align

Toggle Content. Here you can make toggles using the ability to show and hide the content of this toggle. Simply put the Taggle Content Title and Toggle Content and press "Insert Shortcode"

### G) Custom Page Templates - top

The SmartIT theme comes with eight inbuilt custom page templates: Default Template, Blog layout, Blog Alternate Layout, Gallery, Portfolio 3 column, Portfolio 4 column, Portfolio 6 column. These templates can be used on individual pages to alter the display or functionality. It's also possible to change Custom Page Background and Setup sidebar position.

### H) Post Thumbnails - top

The SmartIT theme supports the use of Post Thumbnails. Note: you must have WordPress version 2.9 or later to use this feature. The theme supports auto-resizing of the post thumbnails and so there is only the requirement to specify a single image. Auto-resizing will only occur however when the image is uploaded for the first time, images that have previously been uploaded will not be resized.

To ensure the correct display of images across your site, ensure you specify an image with dimensions of 930 x 450 or larger.

To upload a post thumbnail, go to Posts -> Add New or open an existing post in editing mode. Locate the Featured Image module and click the Set featured image link. If you are using WordPress 2.9 it will refer to it as a Post Thumbnail.

Clicking the link will open up the usual WordPress image uploader where you will upload the image as usual. Simply make sure that it is either the same size or larger than what the final thumbnail will be. Once you’re done uploading the image, simply click the link that says “Set Featured Image”, which is next to the button to insert it into the post.

Once you’re done, a preview of the image should appear in the right-hand box and you are free to insert the image into the post as with any other image.

For more on how to use the WP2.9+ Post Thumbnail feature you can view this article - http://en.support.wordpress.com/featured-images/

### I) CSS Files and Colour Schemes - top

The SmartIT theme includes 1 main CSS file that is used at various times depending on user-controlled options that determine the site's display. It can be found in the theme's main folder style.css.

The main stylesheet is organised by section and includes a styles index for quick navigation. To locate the styles for a particular section, view the index and locate them by comment title.

    ----------------------
    Stylesheet Guide
    -------------------------

    01. Reset

    02. Basic Elements
    	1. Clearfix
    	2. General Classes
    	3. Dropcaps
    	4. Dividers
    	5. Ordered / Unordered List Styles
    	6. Buttons
    	7. Forms
    	8. Alert Boxes

    03. Top Line

    04. Home

    05. Header
    	1. Logo
    	2. Search

    06. Main Navigation
    	1. Social Icons

    07. Main

    08. Content
    	1. Breadcrumbs
    	2. Page Header
    	3. Pricing Table
    	4. 404 Page
    	5. Team List

    09. Blog
    	1. Alternative Blog
    	2. Comments
    	3. Pagination

    10. Portfolio
    	1. Portfolio Items
    	2. Single Portfolio

    11. Contact Us

    12. Sidebar
    	1. Widgets
    		- Chat
    		- Testimonials
    		- Twitter
    		- Flickr
    		- Recent
    		- Categories
    		- Archive
    		- Custom Menu
    		- Links
    		- Meta
    		- Pages

    13. Footer
    	1. Widgets
    		- Our Contact
    		- Text Widget
    		- Email
    		- Social Icons

    12. Widgets + Shortcodes
    	1. Content Tabs
    	2. FAQ Toggle
    	3. Table

    13. Media Queries

#### Using Theme Options to Modify the theme gamma

### J) JavaScript - top

This theme imports various Javascript files.

1. jQuery
2. Nivo-Slider
3. Flex Slider
4. Revolution Slider
5. jCarousel
6. Theme's Custom JS
7. Fancybox
8. jQuery UI Tabs

1. jQuery is a Javascript library that greatly reduces the amount of code that you must write.
2. Nivo Slider is the most awesome jQuery image slider around. More Info here
3. Flex Slider. More Info here
4. Revolution Slider. More Info here. Authors documentation also included.
5. Mosaic slider. More Info here
6. jCarousel. More Info here
7. The theme's custom JS file defines various colour transitions, opacity transitions and dropdown menu settings.
8. jQuery Fancybox plugin. It’s a full blown media lightbox. More Info here
9. jQuery UI. More Info here

### K) PSD Files - top

I've included three main psds with this theme:

1. 01_Home
2. 02_News
3. 03_News_single_page

All the PSDs contain styling for all necessary elements including layers and slices.

### L) Sources and Credits - top

I've used the following sources, icons or other files as listed.

- Revolution - The jQuery Slider Plugin

Purchased images:

- Young Man Using Laptop Or Working From Home
- Cute female executive smiling
- Portrait Of A Cute Business Woman With A World Globe, Sitting At
- Endless Computer Power
- Doctors using computer
- Isolated Modern Laptop
- Serious executive using computer
- Confident business man
- Successful business woman
- Funny business man
- Thinking business woman
- Handsome business man smiling
- Smiling Cute Business Woman With Colleagues At The Back

### M) Extended Video Documentation - top

#### SmartIT: Installing the Theme

#### SmartIT: Creating a Blog Page

#### SmartIT: Creating different post types (default, video, audio, link, quote and gallery)

#### SmartIT: Creating Portfolio Page

#### SmartIT: Portfolio Page Settings

#### SmartIT: Creating Gallery Page

#### SmartIT: Adding Video to Portfolio and Gallery pages

#### SmartIT: Creating Slider's Groups & Creating a page with slider

#### SmartIT: Setting up the home page as a Front Page and lining up a main nav order

#### Video Title is coming soon...

Please stay tuned...

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

ThemeMakers

Go To Table of Contents