### “Freely Premium WP Theme” Documentation by “ThemeMakers” v1.0

# “Freely Premium WP Theme”

Created: 08/08/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. Additional help (Screencasts)

### A) Installation - top

The theme can be uploaded in two ways:

- FTP upload: Using your FTP program, upload the non-zipped Freely 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 Freely 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 Freely Premium WP Theme.

Once you get the message below "The theme has been unable to change permissions to cache folder on your hosting, please set permissions (to 775 or 777) manually to a folder ../freely/timthumb_cache" right after activation theme, please don't forget to do that manually.

### B) Custom Menus - top

If you use version 3.0+ of WordPress, you can setup custom menus to use with our theme. Freely 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

Freely 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

Freely has ability to create unlimited amount of custom sidebars and 5 inbuilt custom widgets as per list below:

- ThemeMakers Contact Form
- ThemeMakers Latest Tweets
- ThemeMakers Recent Posts
- ThemeMakers Social Links
- ThemeMakers Testimonials

There is a screencast at the very bottom of this page where is explanations of how to use unlimited sidebars.

### E) Supported Plugins - top

Freely comes with no one style any popular plugin which you may wish to use, because it already contains most of them. There is no needs to install such plugins as per list below:

- Pagination plugin
- Breadcrumbs plugin
- SEO plugin
- Any Slider plugin
- Shortcodes
- etc.

### F) Shortcodes - top

The Freely Premium WP Theme supports the use of over 20 shortcodes for styling purposes. We've completed all of them as visual ones, so no needs to describe each one, because now you can try all of them by only clicking the buttons and filling the necessary fields with no needs to remember any code of them.

Please See below the examples where to find and how to use:

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

### G) Custom Page Templates - top

The Freely Premium WP Theme comes with 7 inbuilt custom page templates. One default fullwidth page layout (Default Template), two blog listing templates(Blog, Blog Alternate), One gallery template (Gallery) and three portfolio templates (Portfolio 1 column, Portfolio 2 column, Portfolio 3 column). These templates can be used on individual pages to alter the display or functionality.

All page layouts can be managed from Pages

### H) Post Thumbnails - top

The Freely Premium WP 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 385 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 Freely Premium WP Theme includes 1 main CSS file that is used once the site's display. Main CSS file (styles.css) can be found in the core folder of theme.

#### Using style.css to Modify the theme

When modifying the theme's CSS it is advised to use "style.css" as this will make updating to a newer version of the theme much simpler without overwriting your changes. You may need to use the !important declaration to overwrite any other styles in the theme for the same elements.

    /* Example: Change the background colour to black
    (!important is used to overwrite any duplicate classes in styles.css) */
    body { background: #000!important; }

#### style.css - Main Stylesheet Index

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
    -------------------------

     RESET
     GLOBAL STYLES

     LAYOUT
            PORTFOLIO
            GALLERY

    GENERAL STRUCTURE
            CONTENT AREA
                    BLOG
                    COMMENTLIST
                    COMMENTFORM

    SIDEBAR AREA
    FOOTER AREA
    NAVIGATION

    TYPOGRAPHY
            STYLED ELEMENT
                    DIVIDERS
                    LISTS STYLES
                    CUSTOM BOX STYLES
                    BORDERS
                    STYLES FOR BUTTONS
                    FEATURES TABLES

    CONTACT AREA
            CONTACT FORM

    WIDGETS
            TWITTER
            LATEST POSTS
            SOCIAL
            CATEGORIES
            PAGENAVI
            ACCORDION
            TABBED
            TOGGLE

    */

### J) JavaScript - top

This theme imports various Javascript files.

1. jQuery - is a Javascript library that greatly reduces the amount of code that you must write. For more information, please visit http://www.jquery.com/
2. jQuery Fancybox for images, videos, YouTube, iframes. Refer to the author's documentation for additional notes on how to use it.
3. General There you'll find all the necessary scripts which are used in this theme.

### K) PSD Files - top

I've included two psd with this theme:

1. The main page layout (01_Home.psd)
2. The blog page layout (02_Blog.psd)

If you'd like to change the footer image, open "home.psd", make the necessary adjustments, and then save the file as "bg_footer.png". Do the same for the buttons or other elements.

### L) Sources and Credits - top

Purchased images:

- Icons
- Image from photodune: Perfect customer support
- Image from photodune: Business woman pointing at you
- Image from photodune: Mature couple using laptop computer and smiling
- Image from photodune: Group of happy business people laughing
- Image from photodune: Glass globe or earth in grass
- Image from photodune: Business development hands
- Image from photodune: Beautiful customer support
- Image from photodune: Relaxed Business man smiling
- Rama Slider was purchased from here (see help in the same directory named "Rama slider documentation")

### M) Additional help (Screencasts) - top

I've also made few screencasts below, they may help when setting up the theme:

1. Freely: Installing via WP uploader
2. Freely: Setting up the main navigation
3. Freely: Activating slider, Adding slides with captions
4. Freely: Setting up home page as a main page
5. Freely: Creating Gallery Page, Adding Gallery Items
6. Freely: Creating Portfolio Page, Adding Portfolio Items
7. Freely: Creating Blog Page
8. Freely: Managing Unlimited Sidebars

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