circles - wp theme

# circles

## wp theme

- By: Medialayout Team

A set-up guide and general information to help you get the most out of your new theme.

### Intro

Thank you for purchasing our theme This document covers the installation, set up, and use of this theme and provides answers and solutions to common problems and issues - we encourage you to read this document thoroughly
if you are experiencing any difficulties. If you have any questions that are beyond the scope of this
document, feel free to contact us

### 1. Getting Started

1. Getting Started

To install this theme you must have a working version of WordPress already installed. For
information in regard to installing the WordPress platform, please see the WordPress Codex -
http://codex.wordpress.org/Installing_WordPress

1.1 Installation
When you are ready to install a theme, you must first upload the theme files and then activate
the theme itself. The theme files can be uploaded in two ways:

• FTP Upload: Using your FTP program, upload the non-zipped theme folder into the /wpcontent/
themes/ folder on your server.

• WordPress Upload: Navigate to Appearance > Add New Themes > Upload. Go to
browse, and select the zipped theme 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
your chosen theme.

1.2 Setting up the Homepage

To set up one of the homepage layouts, you must create a new page. You can do so by navigating to Pages > Add New. You
can give this page a title yet you do not have to include any content unless you wish to do so.
Select “Homepage” templates from the Page Attributes section and click “Publish”.
Once you have created your new page which uses either “Homepage" page template, navigate
to Settings > Reading and configure the “Front Page Displays” setting. Select the static page
option and choose the page you just created as your front page.

For Create a diffrent Layout of Homepage (just like demo) you have to set an additional options called page option . you can find this just below wp page/post content edior of wordpress .

### 2. Theme Features

2. Theme Features
The theme comes packed with features that control the layout and extend the functionality of
WordPress. This section will document those features and how to use them successfully.

2.1 Custom Menus
The theme has a single custom menu location located in the header. You can assign this
location a custom menu and in addition, custom menus to be used within widgets.
To setup your custom menus, navigate to Appearance > Menus. Give your menu a name
and build it up using the available widgets. You can add a variety of items including pages,
categories, custom links. To extend the available widgets, click the screen options tab
at the very top of the screen and configure your options. Once you have built your menu,
save it and assign it to a location.

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

There are following sections in Theme-option :

2.2.1 general_settings : Includes genral settings like

body class : This theme comes with two body layouts full and boxed . both this can be setted on 1170px or on 960px you can select any of this four layout (wide 1770px , wide 960px , boxed 1170px , boxed 960px)

background color : select background color for theme.

background patterns : Please enable this only if you have selected boxed layout .

background image : If you want some image as background image then upload it here.

background Repeat : allow or not allow background image repeat Property

background position : choose left,right etc.

background attachment : if fixed then background being fixed while scroll webpage else background image normally scrolled with webpage.

background size : choose background size fixed or fits as browser resized.

top line :select option for the top border line of theme

Pre header is header before Main Menus

Pre-header On/Off : select on for enable Pre-header

Pre-headerleft item : left item of the Pre-header

Pre-headerright item : right Item of the Pre-header

Main menu style : select fro two different style of main navigation

Logo : upload your custom Logo and set margins and size for it.

Favicon : upload custom favicon for your website.

Breadcrumbs : Enable or Disable Breadcrumbs

Retina Display Options : High Resolution Retina graphics Option.

2.2.2 fonts : Themes come with most Probely all Google webfonts . All the Font Option That you need to set for your website can be configured from here.

2.2.3 elements_color : Contain options for Select Favorite color for Your themes different different portions .

2.2.4 pages : configure Page settings for Portfolio.

2.2.5 sidebars : create sidebar or edit it from here . after creating each sidebar this sidebar widget will be displayed On widget page . so after create sidebars you can use it from widget page.

2.2.6 integration : Find some custom code and you want to add it on your theme ? don't worry this option give facility to add custom script code on header as well as for footer . just don't forgot to include script tag !

2.2.7 social : All social Icon settings can be configured from here just select which icons you need to display on your site and paste the link of your Social Profile.

2.2.8 contact form : type your Email address for receive e-mail if any visitor contact you from your website.

2.2.9 translations : If You want to display some text after translation then this option can be setted to enable translations. just enable option and Enter your Language's words according to heading Mean .

2.3 Custom Widgets
The theme comes with 4 custom widgets that can be used to configure how your site displays
content - they can be found under Appearance > Widgets.
2.3.1

1.Latest tweets widget :
This widget allows you to display Tweets from Twitter account .

2.Flickr Tiles :

This widget allows you to configure and display Flickr photos from a user’s photostream.

2.3.2 Custom Latest Tweets Widget
This widget allows you to configure and display your latest Twitter tweets.

2.3.3 LayerSlider WP Widget
Insert a slider with LayerSlider WP Widget

2.3.4 revolution slider
Displays a revolution slider on the page

2.3.5 Testimonials Widget
Display testimonials with multiple selection and display options

2.3.6 Multi post
Displays tabs with most popular posts, recent posts and comments

2.4 Custom Page Templates

The theme comes with a number of in built custom page templates. These templates can be
used on individual pages to alter the display or functionality.

you can see each page templates demo on our site . for use this just create a new page and set page templates according to your requirements. theme includes following page templates :

1.default Template

1.Blog Template 1 ,

2.Blog Template 2,

3.Blog Template 3,

4.Contact Form Template 1

5:no margins Template

6.Portfolio Template 1 - 2 Columns

7.Portfolio Template 1 - 3 Columns

8.Portfolio Template 1 - 4 Columns

2.5 Featured Images

The theme supports the use of featured images.
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.
Clicking the link will open up the usual WordPress image uploader where you will upload your
image. 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.
For more on how to use the WP2.9+ Post Thumbnail feature you can view this article - http://
en.support.wordpress.com/featured-images/

2.6 shortcodes : you will find more info about shortcodes in section 3.2

2.7 sidebars : you will find more info about sidebar in section 3.3

2.8 slider : you will find more info about shortcodes in section 3.4

2.9 Page or Post option : At creation or edit time of page or post you can find page/post option just under the post-editor window . options include various feature like Slider, Header image , sidebar position, Page Builder, Header text color, subtitle,author information etc.

### 3.Setting Up Blog

Setting Up Blog

For setup Blog You must create a new page. You can do so by navigating to Pages > Add New. You
can give this page a title yet you do not have to include any content unless you wish to do so.
Select “Blog Template” templates of your choice from the Page Attributes section and click “Publish”.

Remember that Page template is a file which decide your blog style . you can find different style of blog on our theme demo site .so you can choose Blog Template 1,Blog Template 2 or Blog Template 3 as per your requirement in Page attributes
Once you have created your new page , navigate to Settings > Reading and configure the “Front Page Displays” setting. Select the "Posts page" option and choose the page you just created as your Blog page.

The theme supports the use of different post formats in order to change the appearance of
your content. The theme supports Standard Aside,Gallery,Image,Audio,Video,Quote,Status formats.to use any post formats you just need to choose "Format"(located under publish option) as your post format like standard or video.

3.1.1 Standard Post Format
This format functions just as you would expect any other typical post, the appearance of your
content is not altered.

3.1.2 Image Post Format
To use the image post format, select “image” from the format select menu and assign a
featured image. Your featured image image will be shown, any other content will not.

3.1.3 Gallery Post Format To use the gallery post format, select “gallery” from the format select menu and insert your
content as normal. You will find an additional menu used to upload images. Press the “upload
images” button, choose your images from your computer, and press upload. There are no
further steps, all images uploaded will automatically show in your gallery. You can upload an
unlimited number of images.

3.1.4 Audio Post Format
To use the audio post format, select “audio” from the format select menu and insert your
content as normal. You will find an additional menu used to upload your audio files in post option. Ensure
you include the correct paths to the .mp3 and .ogg file formats hosted on your server.
You may also provide a poster image (optional). Note: You must provide both formats for
consistent display across all browsers.

3.1.5 Video Post Format
To use the video post format, select “video” from the format select menu and insert your
content as normal. You will find an additional menu used to upload your video in post option. Each post
can display either a self hosted video or video embedded from YouTube or Vimeo. To add a
video from either Vimeo or YouTube, simply copy and paste the provided embed code in the
appropriate section. The dimensions are 580px x unlimited.
To display self hosted video, ensure to include the correct paths to the .m4v and .ogv file
formats and declare the video height. You may also provide a poster image (optional). Note:
You must provide both formats for consistent display across all browsers.

3.1.6 Aside Post Format
To use the quote post format, select “aside” from the format select menu and insert your
content as normal. Your post content will be shown, your post title will not.

3.1.7 Quote Post Format
To use the quote post format, select “quote” from the format select menu and insert your
content as normal. You will find an additional menu used to enter your quote. Your post title
will be used as the quote source.

### 3.2 Shortcodes

Shortcodes is just like superpower of any theme to use it you just need to open Post editor here you will find Shortcodes window just under post editor window here click on any Shortcodes of your choice and you will find code . copy this code and paste it into post editor and configure it as per your needs . Shortcodes is easy to use because you can find all available Shortcodes in one window so you will get maximum benifits of theme.

All shortcodes are as follows :

Accordion : [accordion style="normal" open="yes"][accordion_toggle title="title 1"]Your content goes here...[/accordion_toggle][/accordion]
Button : [button color="#555555" background="#AFAFAF" size="small" url="http://yourdomain.com" target="_blank" ]Your content here...[/button],color - text color,background - background, size - small, regular, large - default: regular,target - _blank, _parent, _self, _top
Call To Action : [call_to_action button_text="test" text="test" color="gray" size="regular" url="" target="" position="bottom"],color - gray, black, red, orange, blue, green,size - small, regular, large,target - _blank, _parent, _self, _top,position - left, right, bottom
Call To Action 2 : [call_to_action_2 style="1" header="Header text" content="Content text" buttontext="Button label" background="#FF0000" background_hover="#FFFF00" url="http://url.." target="_self"]
Dropcaps : [dropcaps type="circle" color="#C4C4C4" background="#A4A4A4"]Your text here...[/dropcaps],type - circle - optional
Divider : [divider style="1" align="left" size="normal" scrolltext="Scroll to top"]Your text here...[/divider],align - left, right, center,size - smaller, normal, larger,scrolltext - optional
Heading : [heading type="1"]Your text here...[/heading]
Highlight : [highlight color="#ebebeb" fullwidth="yes"]Your text here...[/highlight],color - background color,fullwidth - yes, no - from edge to edge of the screen
Icon : [icon icon="img-1" title="Your title" content="Your content here..."]
Icons : [icons][icon type="icon-music" url="http://..." title="Your title..."]Your content...[/icon][/icons]
Images Slider : [images_slider][image_item url="http://test.com" target="_blank"]image.png[/image_item]
[image_item url="http://test2.com"]image2.png[/image_item][/images_slider],url - optional,target - _blank, _parent, _self, _top
Latest posts : [latest_posts header="Latest posts" limit="12"]
Latest works : [latest_works header="Latest Works" limit=10]
List : [list type="icon-check-empty"]Your UL list here...[/list],type - icon-ok, icon-check, icon-check-empty, icon-circle, icon-angle-right, icon-check-empty
Message : [message type="info"]Your content here...[/message],type - info, alert, success, error
Our clients : [our_clients header="Your header..."][our_clients_item url="http://test.com" target="_blank"]image.png[/our_clients_item][/our_clients]
Person : [person id=1]
Person details : [person_details id=1]
Posts slider : [posts_slider id="2,4,3" post_type="post/page" category="1,-2,-3" limit="4" orderby="date" order="desc" description="excerpt" excerpt="12"],id - included posts (optional),post_type - post type to show (default: post),category - list of categories to show or to exclude (optional),orderby - sort retrieved posts by parameter (default: date),order - designates the ascending or descending order (default: DESC),description - no, excerpt - show or hide description (default: excerpt)
Recent posts : [recent_posts header="Latest posts" limit="12"]
Skill bars : [skillbar type="vertical" height="100"][skillbar_item percentage="80" title="Cooking"][skillbar_item percentage="99" title="Sleeping"][/skillbar]
Space : [space height="20"]
Steps : [steps][step icon="..." title="Your title" subtitle="Your subtitle" url="http://.." target="_blank"][/steps]
Tabs : [tabs orientation="horizontal" position="top-left" style="normal" autoplay="no" animation="fadein"][tab url="http://test.com" target="_blank"]Your text here...[/tab][/tabs]
Teaser : [teaser style="1" image="image.png" icon="..." title="Your title" subtitle="Your subtitle" url="http://..." target="_self"]
Teaser 2 : [teaser_2 image="image.png" title="Your title" button="Click me" url="http://..." target="_self"]Your content..[/teaser_2]
Testimonials : [testimonials type="static" header="Your header..." category="3" limit="3"],type - static/slider - default: slider,category - testimonial categories,limit - default: 3
Text : [text]Your text here...[/text]

### 3.3 Sidebar

Sidebar

This Theme comes with various sidebar types. for set sidebar you just need to navigate to theme-option => sidebar

here you can create new sidebar or edit existing one . Remember after you create sidebar click save and you will find relevant sidebar portion on widget page you can open it by navigating appearance => widget

here you will find your sidebar . you just need to drag and drop widget to this sidebar area .

to use this sidebar : to use your custom sidebar you need to change Post/page option (you can find this under post/page editor window on post/page editing Page)

select default sidebar if you just want to use default sidebar else you can choose left or right sidebar in Sidebar position option . as you select left or right sidebar potion you will find drop-down menu . you can simply choose your sidebar from that dropdown.

The Main advantage of using custom sidebar is you can show different different sidebar on each post/page to your visitor.

### 3.4 Sliders

This Theme Supported four Slider Plugin :

1.Flexslider slider : for Flexslider just navigate to Flexslider=>add new slideshow

2.Camera slider : for Flexslider just navigate to Flexslider=>add new slideshow (third tab)

3. Revolution slider : for Flexslider just navigate to Flexslider=>add new slideshow

4. layer slider : for Flexslider just navigate to Flexslider=>add new slideshow

After create slideshow you just need to open post/page editor and look into post/page option here in slider section choose slider as per your requirement and click publish.

### 4.Setting Up Portfolio

Set Up Portfolio

Theme comes with custom post type "portfolio" . For setup Portfolio You must create a new page. You can do so by navigating to Pages > Add New. Youcan give this page a title yet you do not have to include any content unless you wish to do so.Select “Portfolio Template” templates of your choice from the Page Attributes section .you find verity of portfolio templates like 1-3 and 1-4 and 1-2 . this all are display column so choose it as per your requirement of displaying columns. click “Publish”.

Once you have created your new page , navigate
to Portfolio > add new and here you can create portfolio items just like any simple post. But this post only support gallery, standard and video.

### 5. contact page

contact page

For setup contact page all you need to do is : create a new page. You can do so by navigating to Pages > Add New. You can give this page a title yet you do not have to include any content unless you wish to do so.
Select “contact Template” templates of your choice from the Page Attributes section and click “Publish”.

Once you have created your new page , navigate
to theme-option > contact and here you can Add mail on which mail will be sended if any one contact you from contact page.

for display maps : for display maps you need to install this plugin => http://wordpress.org/extend/plugins/wp-gmappity-easy-google-maps/

for install this navigate to Plugins=>add new => search this plugin and install it after activate it configure it from Plugins=> wp gmappity configure

After this Place this shortcode : [wpgmappity id="1"] on contact page at upper side of your contact details.

remember in shortcode id is unique id for map so place proper id that you created in wp gmappity Plugin configuration.

### 6. Setting Up Testimonials

For setup Testimonials navigate
to Testimonials > new Testimonials

here you can create Testimonials just like any simple post.and after this include the shortcode on any page . shortcode will look like this one :

[testimonialswidget_list ids="533"]

Here 533 is Testimonials id so use your own id for appropriate Testimonials.

### Thanks

Again, thank you for purchasing this theme!
If you have any questions that are beyond the scope of this document,
feel free to pose them in the dedicated support forum (http://arenaofthemes.com/support/)