breeze – professional corporate and portfolio wp

Breeze – Professional Corporate and Portfolio WP Updated: 2011/04/14 By: UniSphere Thank you for purchasing my 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. Thanks so much!

INTRODUCTION Breeze is a Wordpress theme designed with corporate businesses in mind. It has a custom CMS integrated into the Wordpress administration area that allows you to build a fully functional professional website in minutes. The theme is also well suited for online portfolios and blogs.

GENERAL FEATURES • Complete and easy to use custom admin panel (CMS) for setting the theme preferences • Wordpress built in automatic thumbnail generation and image resizing (no more timthumb

incompatibilities and no need to set custom fields, all automatic) • Translation ready, theme comes with a .PO file with English localization • Theme available in six languages: English, Italian, Spanish, Portuguese, French and German • WPML ready, all dynamic fields from the custom admin panel are provided to WPML for translation

(use WPML version 1.8.1 or higher) • CSS and jQuery Drop Down Menu • 2 Home page templates with jQuery filtering or paging • 3 Home page Sliders: Normal Slider, Full Width Slider supporting images up to 1920px width and a

new Stage Slider with Text Description and Video support (YouTube, Vimeo, FLV and MP4) • A Full Width page template • 3 Portfolio templates • Portfolio item detail template • Blog and Post detail templates • Wordpress Gallery with Lightbox supporting full width pages, pages with sidebar and posts • 4 extra HOT page templates to showcase how easy and powerful the different shortcodes are to use • Lots of different shortcodes for you to use: Column Layouts, Sliders, Buttons, Info Boxes, Titles,

Dropcaps, List Styles, Blockquotes, Price Tables, FAQ, Lightbox, Video, Testimonials, Maps and more • 3 Sub-‐Header variations: Text only, Image only and Image + Text • Contact page with validation and fully functional Ajax contact form (3 layers of SPAM protection) • 7 specific widget areas as well as an independent dynamic sidebar widget area for every page • Complete separation from the portfolio and blog • Custom widgets for displaying Popular posts, Recent Posts, Twitter, Flickr and Contact Form widget • 125x125 Ads ready (plugin: WP125) • Skins: 5 Light, 5 Dark, 5 Extra Dark and another 3 Unique Skins • Transparent Skins: 5 Dark and 5 Extra Dark

• Possibility to select between 16 different Backgrounds for any of the skins or upload your own • Seamless out of the box Twitter and Facebook button integration • Choose between 7 Fonts for your headings (some support all characters) • Select between Narrow or Wide content layout • So many different skin variations that I can't even count them :) • Works in all major browsers (not IE6 compatible and CSS3 features not supported by IE7 and IE8) • Styled and built in wp-‐pagenavi plugin used for pagination • Threaded Comments and Gravatar ready • Valid XHTML and CSS code • SEO Friendly

DOWNLOADED ZIP FOLDER STRUCTURE After you download the ZIP file from ThemeForest, you’ll notice it has several files and folders:

• PSD folder: contains the layered PSD file • breeze folder: this is the directory which contain the theme files and that you need to upload to your

wordpress installation in /wp-‐content/themes/ • breeze.import.xml file: this file provides dummy data ready to be imported to your wordpress

installation as a starting point • Documentation.pdf file: the same file you are reading right now

INSTALLATION INSTRUCTIONS • Either upload the theme folder “breeze” via ftp to your wordpress installation theme folder (/wp-‐

content/themes/) or use the built in wordpress theme installer but make sure to create a new zip file with only the “breeze” folder (don’t upload the whole zip file you’ve downloaded from ThemeForest)

• Login to the Wordpress administration area and activate the theme by going to Appearance » Themes and activate the Breeze theme

• If you’ve activated the theme in a Wordpress installation that already had items in the Media Library, these images need to be resized. There’s a plugin called “Regenerate Thumbnails” (http://wordpress.org/extend/plugins/regenerate-‐thumbnails/) that does just that so make sure to install it and run it. NOTE: use this plugin only after activating the theme.

IMPORTING DUMMY DATA As stated above, the zip file you downloaded contains an xml file that can be used to import dummy data to your wordpress installation. Some users prefer this approach as it gives them a good starting point and the ability to easily change the data to their needs without having to create all the pages by hand.

NOTE: importing the dummy data in existing wordpress installations with some data already can cause problems so make sure you have a clean wordpress installation before doing this.

Importing the data is an easy process:

• Delete all the pages and posts as well as any categories other than the default “Uncategorized” category

• Go to Tools » Import and select the option “Wordpress” (at this point Wordpress might ask you to install the Import Plugin, confirm)

• Click the button “browse” and select the file “breeze.import.xml” contained in the downloaded zip • Click the button “Upload file and import” • Check the option “Download and import file attachments” • Click the button “Submit” and all the dummy data should be imported

The next chapter explains how to create the pages manually so skip it if you’ve imported the data automatically, although read the part about setting a static homepage.

MANUALLY CREATING PAGES In order for this theme to work like you see in the live preview, you have to create and set a static home page. In order to accomplish this you need to do three things:

• Go to Pages » Add New and just set the page title as “Home” and select either “Home Page” or “Home Page with Blog” in the Template dropdown

• Create another page just like above but this time for your Blog. In the template leave the “Default Template”

• Go to Settings » Reading and where it says Front page displays select “A static page” and set your previously created home page in the Front page dropdown, as well as your blog page in the Posts page dropdown.

• If you want a Portfolio create another page just like above. In the template set either “Portfolio 1 Column”, “Portfolio 3 Columns” or “Portfolio 4 Columns”. Make sure to select one or more portfolio categories in the page custom field.

• If you want a Contact Page create another page just like above. In the template set “Contact Page”. • If you want a Full Width Page create a page just like above. In the template set “Full Width Page”.

INSTALLING THE THEME IN OTHER LANGUAGES Installing the theme in another language other than the default English translation is very easy. Breeze includes translation to English, Italian, Spanish, Portuguese, French and German. To use one of these languages it’s recommended that you download Wordpress already with the translation to that language.

I’ll give you an example on how to install the theme in Portuguese:

• Download Wordpress from the official Wordpress Portuguese page: http://pt.wordpress.org/ • Install it like you normally would • Activate the theme and add your content

I recommend starting with an official Wordpress translation because not only does it already provide translation to that specific language in all Wordpress frontend and backend pages, it also has configured by default to instruct plugins and themes that have that language available to use it.

TRANSLATING THE THEME TO ANOTHER LANGUAGE

NOT AVAILABLE BY DEFAULT Translating the theme to another language is very easy.

The theme comes with a GNU Gettext Catalog file (.PO) and you can find it in the folder language/breeze.po.

As an example, say you want to translate the theme’s frontend to Portuguese. First thing you need to do is to create a copy of the breeze.po file and name it pt_PT.po. Notice the language tags in the file name and make sure to select your tags correctly. Look at the following examples:

• English: en_GB (British English), en_US (American English), en_CA (Canadian English) • Spanish: es_ES (Castilian Spanish, Spanish as written and spoken in Spain), es_MX (Mexican Spanish),

es_AR (Argentine Spanish), es_CO (Colombian Spanish) • Portuguese: pt_PT (European Portuguese, Portuguese as written and spoken in Portugal), pt_BR

(Brazilian Portuguese)

So now that you have a copy of the original breeze.po file, you need to open this new file using an application called Poedit: http://www.poedit.net/.

When you Install the app and open your file, you’ll see a column with the theme’s original strings in English and a column for the translation.

Click each individual original string and at the bottom provide a translation for it in your destination language.

When you have all the original strings translated save the file in Poedit.

You’ll now see that the app has created a new file called pt_PT.mo which has all your translations compiled. Copy this file to the languages folder of the breeze theme in your Wordpress installation.

Now that you have a compiled translated file you need to instruct Wordpress to use it (if you’ve already installed Wordpress in another language you might have the next step done already). Open the file wp-‐config at the root of your Wordpress installation and look for the following code:

define ('WPLANG', '');

In our above example, we are translating to Portuguese so change this line of code to:

define ('WPLANG', 'pt_PT');

You should now see the frontend of your site using the translated strings.

CUSTOMIZING THE THEME Breeze comes with a fully functional custom admin panel that lets you customize your site to your needs. To access the custom admin panel click the Breeze option in the left menu.

In this admin panel you have 6 sections: General Settings, Home Page Settings, Blog Settings, Portfolio Settings, Contact Page Settings and Footer Settings.

GENERAL SECTIONS

• Upload your company logo and paste the image URL………………………………………… • Select the skin you want for your site from the available skins

o NOTE: you can create a new skin by changing one of the existing skins. The skins directory (which includes images and a css file) is located in /wp-‐content/themes/breeze/css/skins

• Select the layout you want for the site: Wide or Narrow • Select the background image from the 16 available backgrounds or disable it • You also have the option to upload your custom background image and paste the image url • You can disable the background image repeat • If you disable the background you can set a background color of your choosing • Select the cufon font you want for your site from the 7 available. If you want you can also disable

cufon completely • You can hide the Search Box in the inner pages • You can hide the Breadcrumbs in the inner pages • Set your custom CSS entries • Set your custom Scripts

HOME PAGE SETTINGS

• Choose what Slider you want to use: Disable Slider, Normal, Full Width, Stage Slider Wide or Stage Slider Tall

• Set the number of posts to show in your home page slider • Set the speed between transitions in your home page slider • Set the transition animation speed in your home page slider (only works with normal slider) • Set the number of slices in the animation (only works with normal slider) • Set the animation effect of each slider transition (only works with normal slider) • Show/Hide the 3 Home sections • Set the 1st , 2nd and 3rd section’s HTML (a default structure is provided, you just have to edit) • Show/Hide the 3 most recent Portfolio items • Set the home page Portfolio section Title • Set the home page Portfolio section Sub-‐Title • Set the “View Portfolio” Button Text • Set the “View Portfolio” Button Link • Show/Hide the 4 most recent Blog posts • Set the home page Blog section Title • Set the home page Blog section Sub-‐Title • Set the “Read the Blog” Button Text • Set the “Read the Blog” Button Link

CONTACT PAGE SETTINGS

• Set the Destination E-‐mail you want your messages to be sent to • Set the Success Message displayed when the email is successfully sent • Set the Error Message displayed when an error occurs sending the email

BLOG SETTINGS

• Select if you want to display full blog posts content in the blog posts list or if you want to just display the post excerpt

• Select if you want to show the "Tweet" button on the post detail page • Select if you want to show the Facebook "Like" button on the post detail page

PORTFOLIO SETTINGS

• Select the default text present when you insert a new portfolio item • Select if you want to show the "Tweet" button on the portfolio item detail page • Select if you want to show the Facebook "Like" button on the portfolio item detail page

FOOTER SETTINGS

• Set the copyright text displayed in the footer • Set your Twitter link • Set your Facebook link • Set your Flickr link • Set your Linkdin Link

WORDPRESS THUMBNAIL FEATURE Breeze supports the new post thumbnail feature introduced in Wordpress. What this means is that there is no need to use any sort of auto image resize script like timthumb, wordpress does this out of the box.

In Breeze, adding an image to be displayed as a thumbnail in a post is very easy. When adding, editing a post, notice an option in the lower right section of the post admin page:

Click “Set featured image”, upload the image as you would normally do in previous versions and click the option “Use as featured image”:

If you set a thumbnail like explained above when adding a blog post, portfolio post or slider image post, you won’t have to set any custom fields, it’s that easy (although you can override the thumbs generated by wordpress by setting the custom fields). This process is the same for setting sub-‐header page images.

If you are adding the theme to an existing wordpress installation which already contains images, you’ll notice that the theme does not update previous inserted images to the new sizes. To regenerate these images download and run the following plugin: http://wordpress.org/extend/plugins/regenerate-‐thumbnails/

ADDING SLIDER ITEMS Breeze takes advantage of the new custom post types feature introduced in Wordpress 3.0. What this means to you is that there is no need to create a specific category to serve slider items. When you log in to your wordpress admin area you’ll notice a new custom post type option called “Slider Items”.

When adding new Slider Items, take a look at the custom options:

To insert a slider item click “Add new” and do the following:

• Set the title of the Slider Item

• Settings that apply to all Slider types: o If you want to display an image click the option “Set featured image” (bottom right) and

make sure to select the option “Use as featured image”. Like explained above, because Breeze uses the wordpress post thumbnail feature you don’t have to set any custom field for the image, although you can still override the default image generated by wordpress by setting the custom field “Override the default thumbnail generated for this Slider Image” with your image url

o If you want the slider item to link to another page, make sure to set the custom field “Slider Item custom destination URL” with the destination URL. Leave it blank if you don’t want to link anywhere. Keep in mind that this custom URL won’t work if you decide to display a video instead of an image.

o If you want to open a Video in a lightbox when clicking a Slider Item’s image, make sure to set the custom field “Play Video in Lightbox when clicking an image” with the video URL (flash, youtube, vimeo and quicktime supported)

• Settings that apply just to the Stage Slider o If you want to play a video directly in Slider, make sure to set the custom field “Play Video

directly in Slider” with the video URL (YouTube, Vimeo, FLV and MP4 are supported) o You have the option to not auto-‐play the video once it’s displayed in the slider by checking

the custom field “Don’t Autoplay Video?” o If you want to display a text description to the left or right of the slider image or video you

can choose to do so by selecting the position in the custom field “Text description position”. This feature doesn’t work in Videos when using the Stage Slider Tall, only on the Stage Slider Wide. For images it works on both

o You can make the text description background transparent and to do so you need to check the custom field “Make text description background transparent”

o If you choose to display a FLV or MP4 video without autoplay, you have the option to display a thumbnail “splash” image by setting the image url in the custom field “Set the video splash image when adding a FLV or MP4 video without autoplay”.

• Settings that apply just to the Full Width Slider o When using the full width slider with smaller images than 1920px, you can set the

background color for the slider item so it blends well with your image. Just add your desired hex color to the custom field “Background Color”

ADDING A PORTFOLIO PAGE Breeze comes with 3 portfolio page templates, one with 1 Column, one with 3 Columns and one with 4 Columns.

To add a Portfolio page just add a new page in Wordpress and select either one of the 3 available Portfolio page templates. At this point if you navigate to this page in the frontend you’ll see that it doesn’t list any portfolio categories. You now have the ability to set the categories you want to display in each portfolio page as well as the number of portfolio items you want to show per page (leave blank if you don’t want to paginate the records). Set it like in the following screenshot (this screenshot displays the custom fields of a page):

To set the order in which the Portfolio Categories appear in the Portfolio Page, sort them by dragging and dropping them in the order you want.

ADDING PORTFOLIO ITEMS Breeze takes advantage of the new custom post types feature introduced in Wordpress 3.0. What this means to you is that there is no need to create blog categories to serve portfolio items. When you log in to your wordpress admin area you’ll notice a new custom post type option called “Portfolio”.

When adding new Portfolio items, take a look at the custom options:

To insert a portfolio item click “Add new” and do the following:

• Set the title of the Portfolio Item • Breeze provides you with a default description in two columns. You can override it of course • If using the 1 Column layout make sure to fill in the excerpt

• Click the option “Set featured image” (bottom right) and make sure to select the option “Use as featured image”. Like explained above, because Breeze uses the wordpress post thumbnail feature you don’t have to set any custom field for the image, although you can still override the default image generated by wordpress by setting the custom field “Override the default thumbnail generated for the Portfolio items” with your image url

• Choose how you want to display images in the item detail page by selecting your preferred option in the custom field “How to display images in detail page?”

• If you don’t want the thumbnail image that appears on your portfolio page list to appear as an image in the portfolio detail page, make sure to check the custom field “Exclude the thumbnail (featured image) from the image listing in the Portfolio Item detail page?”

• If you want the thumbnail to link directly to the detail page instead of opening a lightbox then make sure to check the custom field “Thumbnail links to Portfolio Item Detail?”

• If you want the Portfolio item to link to another page, make sure to set the custom field “Portfolio Item custom destination URL” with the destination url. Leave it blank if you don’t want to link anywhere

• If you want to open a Video in a lightbox when clicking the Portfolio item, make sure to set the custom field “Portfolio Video in lightbox” with the video url (flash, youtube, vimeo and quicktime supported)

• In version 2.0 of the theme you can now set custom sub-‐header titles and images in the portfolio items (see the first 2 options in the screenshot above)

ADDING BLOG POSTS When adding Blog posts, take a look at the custom options:

To insert a blog post click “Add new” and do the following:

• Set the title and description of the Blog post • Click the option “Set featured image” (bottom right) and make sure to select the option “Use as

featured image”. Like explained above, because Breeze uses the wordpress post thumbnail feature you don’t have to set any custom field for the image, although you can still override the default image generated by wordpress by setting the custom fields “Override the default thumbnail generated for the Blog posts listing” and “Override the default image generated for the Blog posts detail” with your images url

• If you want you can hide the related posts list in the blog post detail by checking the custom field “Hide related posts list” (Related posts are found by similar tags in other posts)

• In version 2.0 of the theme you can now set custom sub-‐header titles and images in the blog posts (see the corresponding options in the screenshot above)

ADDING A TITLE AND IMAGE TO THE SUB-HEADER OF

A PAGE Take a look at the Page custom options:

To add a Title to the sub-‐header of a page simply create a page and set your desired Title in the custom field “Page Sub-‐Title” of the Breeze Page Settings.

To add an Image to the sub-‐header of a page click the option “Set featured image” (bottom right) and make sure to select the option “Use as featured image”. Like explained above, because Breeze uses the wordpress post thumbnail feature you don’t have to set any custom field for the image, although you can still override the default image generated by wordpress by setting the custom field “Override the default Image generated for this Page” with your image url.

ADDING A GALLERY TO YOUR PAGES AND POSTS Breeze enables to add image galleries to your pages and posts with lightbox functionality using the default wordpress gallery. When adding a gallery to a blog post or a page with a sidebar, make sure to set 5 columns. When adding a gallery to a full width page, use 8 columns instead.

Once again, no need to previously resize the thumbs, it’s all auto generated.

SHORTCODES Breeze implements several shortcodes that help you build rich layouts for your pages. Version 1.9 introduced a new easier way to add shortcodes to your pages and posts directly from the WordPress Rich Text Editor. Just click the shortcode button and select the shortcode you want to include:

Alternatively you can copy the following code samples to your pages content text.

NOTE: if experiencing weird spacing when using shortcodes, just put the shortcode content and tag all in one line.

COLUMN SHORTCODES For a visual reference visit: http://breeze.unispheredesign.com/

These columns shortcodes help you display your content in columns. Make sure that the last column ends with “last”:

HALF COLUMN [one_half]Content…[/one_half] [one_half_last]Content…[/one_half_last]

ONE THIRD COLUMN [one_third]Content…[/one_third] [one_third]Content…[/one_third] [one_third_last]Content…[/one_third_last]

TWO THIRDS COLUMN [two_third]Content…[/two_third] [one_third_last]Content…[/one_third_last] [one_third]Content…[/one_third] [two_third_last]Content…[/two_third_last]

ONE FOURTH COLUMN [one_fourth]Content…[/one_fourth] [one_fourth]Content…[/one_fourth] [one_fourth]Content…[/one_fourth] [one_fourth_last]Content…[/one_fourt_last]

ONE FOURTH AND HALF COLUMN [one_half]Content…[/one_half] [one_fourth]Content…[/one_fourth] [one_fourth_last]Content…[/one_fourt_last]

ONE FOURTH COLUMN [one_fourth]Content…[/one_fourth] [one_fourth]Content…[/one_fourth] [one_half_last]Content…[/one_half_last]

THREE FOURTH COLUMN [three_fourth]Content…[/three_fourth] [one_fourth_last]Content…[/one_fourt_last] [one_fourth]Content…[/one_fourth] [three_fourth_last]Content…[/three_fourth_last]

ONE FIFTH COLUMN [one_fifth]Content…[/one_fifth] [one_fifth]Content…[/one_fifth] [one_fifth]Content…[/one_fifth] [one_fifth]Content…[/one_fifth] [one_fifth_last]Content…[/one_fifth_last]

ONE FIFTH AND TWO FIFTH COLUMN [two_fifth]Content…[/two_fifth] [one_fifth]Content…[/one_fifth] [two_fifth_last]Content…[/two_fifth_last]

THREE FIFTH COLUMN [three_fifth]Content…[/three_fifth] [one_fifth]Content…[/one_fifth] [one_fifth_last]Content…[/one_fifth_last] [two_fifth]Content…[/two_fifth] [three_fifth_last]Content…[/three_fifth_last]

FOUR FIFTH AND ONE FIFTH COLUMN [four_fifth]Content…[/four_fifth] [one_fifth_last]Content…[/one_fifth_last] [one_fifth]Content…[/one_fifth] [four_fifth_last]Content…[/four_fifth_last]

BUTTON SHORTCODES These button shortcodes help you display styled buttons:

SMALL BUTTON [button text="Button" url="http://www.google.com" /]

BIG BUTTON [button text="Button" size="big" url="http://www.google.com" /]

SMALL UNSELECTED BUTTON [button text="Button" style="unselected" url="http://www.google.com" /]

BIG UNSELECTED BUTTON [button text="Button" style="unselected" size="big" url="http://www.google.com" /]

BUTTON WITH CUSTOMIZABLE COLORS [button text="Button" url="http://www.google.com" txtColor="#fff" bgColor="#0697d6" txtColorHover="#b0d5e5" bgColorHover="#026894" /]

Available parameters:

• size: big (optional) • style: unselected (optional) • text: the button text • url: the target url of the button (optional when used with the [lightbox] shortcode) • newWindow: true (optional) • txtColor: hexadecimal value for custom text color (optional) • bgColor: hexadecimal value for custom background color (optional) • txtColorHover: hexadecimal value for custom text color on mouse hover (optional) • bgColorHover: hexadecimal value for custom background color on mouse hover (optional)

SLIDER SHORTCODES

There are 2 different slider shortcodes. The first one show post/page image attachments and has the following arguments:

• size: big, medium, small. (default: medium) • effect: random, fold, fade, sliceDown, sliceUp, sliceDownRight, sliceDownLeft, sliceUpRight,

sliceUpLeft, sliceUpDown. (default: random) • slices: number of slices used in the animation. (default: 15) • animspeed: number of milliseconds of each transition animation. (default: 500) • pausetime: number of milliseconds between transitions (default: 4000) • numberimages: number of images to get from post/page attachments (default: 20) • lightbox: true, false (default: true) • exclude: use this argument to exclude attachments from the slider using a comma separated list of

IDs • include: use this argument to only include the attachments you specify using a comma separated list

of IDs

Example usage:

[slider size="big" effect="fade" slices="10" numberimages="5" exclude="14,16" /]

The second one enables you to build a slider from images URLs (they can be hosted elsewhere) and has the following arguments:

• size: big, medium, small. (default: medium) • effect: random, fold, fade, sliceDown, sliceUp, sliceDownRight, sliceDownLeft, sliceUpRight,

sliceUpLeft, sliceUpDown. (default: random) • slices: number of slices used in the animation. (default: 15) • animspeed: number of milliseconds of each transition animation. (default: 500) • pausetime: number of milliseconds between transitions (default: 4000)

Example usage:

[slider_custom size="big"] <a href="#" rel="lightbox[1]"><img src="900x300.jpg" alt="" title="Image 1" /></a> <a href="#" rel="lightbox[1]"><img src="900x300.jpg" alt="" title="Image 2" /></a> <a href="#" rel="lightbox[1]"><img src="900x300.jpg" alt="" title="Image 3" /></a> [/slider_custom]

You can also use the [image] shortcode to add the images to the [slider_custom] shortcode like for example:

[slider_custom size="big"] [image img="900x300.jpg" url="900x300.jpg" alt="Image 1"/] [image img="900x300.jpg" url="900x300.jpg" alt="Image 2"/] [image img="900x300.jpg" url="900x300.jpg" alt="Image 3"/] [/slider_custom]

Note: If you use the [slider_custom] shortcode make sure to resize the images as they won’t automatically resize.

INFORMATION BOXES SHORTCODES These information box shortcodes help you display styled info boxes and info bars:

BAR INFORMATION BOX 1 [bar_info_box_1 buttontext="Text…" buttonurl="url…" text="description…" /]



INFORMATION BOX 1 [info_box_1 title="Title…"]Content…[/info_box_1]



FAQS SHORTCODE These FAQs shortcodes help you display styled frequently asked questions:

[faq question="Question...?" dropcap_question="Q" dropcap_answer="A"]The answer text…[/faq]

TESTIMONIAL SHORTCODES These Testimonial shortcodes help you display styled testimonials:

FEATURED TESTIMONIAL [testimonial featured="true" img="imgurl…" company="Company" url="company_url" person="John Doe"] Sagittis fringilla, massa et nunc. Fusce sollicitudin eros non mauris convallis gravida. Aenean fringilla magna eu nulla euismod id tincidunt tortor. Sagittis fringilla, massa et nunc. Fusce sollicitudin eros non mauris convallis gravida. Aenean fringilla magna eu nulla euismod id tincidunt tortor mauris convallis gravida. Aenean fringilla magna eu nulla euismod id tincidunt tortor. [/testimonial]

NORMAL TESTIMONIAL [testimonial img="imgurl…" company="Company" url="company_url" person="John Doe"] Sagittis fringilla, massa et nunc. Fusce sollicitudin eros non mauris convallis gravida. Aenean fringilla magna eu nulla euismod id tincidunt tortor. Sagittis fringilla, massa et nunc. Fusce sollicitudin eros non mauris convallis gravida. Aenean fringilla magna eu nulla euismod id tincidunt tortor mauris convallis gravida. Aenean fringilla magna eu nulla euismod id tincidunt tortor. [/testimonial]

TITLE SHORTCODE [title]This is a title[/title]

HORIZONTAL SEPARATOR SHORTCODE [hr/]

IMAGE SHORTCODES [image /]


• img: the image url • url: the target url of the image (optional) • alt: the image alt attribute (optional) • rounded: all, top, right, bottom, left (optional) • lightbox: true or false (default: true) • group: the lightbox group this image belongs to (optional) • align: left, center, right (optional)

DROPCAP SHORTCODES DROPCAP WITH BACKGROUND [dropcap1]T[/dropcap1]his is a dropcap

DROPCAP WITHOUT BACKGROUND [dropcap2]T[/dropcap2]his is a dropcap

LIST SHORTCODES LIST WITH CIRCLE BULLETS [list bullet="circle"] <li>list item...</li> <li>list item...</li> <li>list item...</li> [/list]

LIST WITH ARROW BULLETS [list bullet="arrow"] <li>list item...</li> <li>list item...</li> <li>list item...</li> [/list]

BLOCKQUOTE SHORTCODES BLOCKQUOTE LEFT [blockquote align="left"]Lorem ipsum dolor sit amet…[/blockquote]

BLOCKQUOTE RIGHT [blockquote align="right"]Lorem ipsum dolor sit amet…[/blockquote]

BLOCKQUOTE [blockquote]Lorem ipsum dolor sit amet…[/blockquote]

TOGGLE SHORTCODE [toggle title="Text…"]Lorem ipsum dolor sit amet…[/toggle]

TABS SHORTCODE [tabs titles="Tab 1 title, Tab 2 title, Tab 3 title"] [tab]Tab 1 content…[/tab] [tab]Tab 2 content…[/tab] [tab]Tab 3 content…[/tab] [/tabs]

PRICE TABLE SHORTCODE

Every Price Table begins with the [price_table] shortcode that sets the number of columns to be displayed. Example usage: [price_table columns="3"]…[/price_table]

Inside the [price_table] shortcode you add [price_column] shortcodes for each specific column of the price table. This shortcode can have the 3 following arguments:

• title: this is mandatory • featured: true, false. (default: false) • color: green, blue, pink, red, yellow, nature-‐brown, nature-‐green, spring-‐blue, spring-‐green.

(default: current skin color is applied)

Example usage:

[price_table columns="3"] [price_column title="First" color="spring-blue"] <li>[price_tag value="Free!" /]</li> <li>dolor sit</li> <li>dolor sit</li> <li>dolor sit</li> <li>dolor sit</li> <li>[button text="Sign Up" url="http://www.google.com/"]</li> [/price_column] [price_column featured="true" title="Second" color="spring-green"] <li>[price_tag value="$10" period="per month" /]</li> <li>dolor sit</li> <li>dolor sit</li> <li>dolor sit</li> <li>dolor sit</li> <li>[button text="Sign Up" url="http://www.google.com/"]</li> [/price_column] [price_column title="Third" color="red"] <li>[price_tag value="$20" period="per month" /]</li> <li>dolor sit</li> <li>dolor sit</li> <li>dolor sit</li> <li>dolor sit</li> <li>[button text="Sign Up" url="http://www.google.com/"]</li> [/price_column] [/price_table]

Inside the [price_column] shortcode you add the lines of text inside <li> tags and you can use the [price_tag] shortcode to show the price for that individual column.

Example usage: [price_tag value="$10" period="per month" /] and [price_tag value="Free!" /]

HIGHLIGHT SHORTCODE LIGHT HIGHLIGHT [highlight]Lorem ipsum dolor sit amet…[/highlight]

DARK HIGHLIGHT [highlight dark="true"]Lorem ipsum dolor sit amet…[/highlight]

VIDEO SHORTCODE YOUTUBE [video type="youtube" url="http://www.youtube.com/watch?v=B0ky-VMi9fI" /]

VIMEO [video type="vimeo" url="http://vimeo.com/8245346" /]

HTML5 [video type="html5" thumbnail="http://video-js.zencoder.com/oceans-clip.png" mp4="http://video-js.zencoder.com/oceans-clip.mp4" webm="http://video-js.zencoder.com/oceans-clip.webm" ogg="http://video-js.zencoder.com/oceans-clip.ogv" /]

FLV [video type="flv" url="http://download.gametrailers.com/gt_vault/12821/t_portal2_pax10_coop_hd.flv" /]


• type: youtube, vimeo, flv, html5 • url: the url of the video • autoplay: true or false (default: false) • mp4: if video type is HTML5, set the MP4 video here • webm: if video type is HTML5, set the WEBM video here • ogg: if video type is HTML5, set the OGG video here • width: the width in pixels of the video (optional) • height: the height in pixels of the video (optional)

LIGHTBOX SHORTCODE SINGLE LIGHTBOX IMAGE FROM TEXT LINK [lightbox url="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" title="Image title"]single image[/lightbox]

GROUPED LIGHTBOX IMAGES FROM TEXT LINKS [lightbox url="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" group="1" title="Image 1"]Grouped Image 1[/lightbox] [lightbox url="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" group="1" title="Image 2"]Grouped Image 2[/lightbox] [lightbox url="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" group="1" title="Image 3"]Grouped Image 3[/lightbox]

GOOGLE.COM IN LIGHTBOX FROM IMAGE LINK [lightbox url="http://www.google.com" width="100%" height="100%" iframe="true"][image img="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/280x110.jpg" /][/lightbox]

LIGHTBOX VIDEO FROM BUTTON [lightbox url="http://download.gametrailers.com/gt_vault/12821/t_portal2_pax10_coop_hd.flv" width="1280" height="720"][button text="Open Video" /][/lightbox]

INLINE CONTENT FROM TEXT LINK [lightbox url="#inline-content"]Inline Content[/lightbox] <div id="inline-content" style="display: none;"> What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. </div>


• url: the url of the content to open in the lightbox • title: the title displayed in the lightbox (optional) • group: the lightbox group this belongs to (optional) • iframe: set iframe to true if opening a web page inside a lightbox (optional) • width: the width in pixels of the lightbox (optional) • height: the height in pixels of the lightbox (optional)

MAP SHORTCODE

TERRAIN TYPE MAP FROM A POINT'S LATITUDE/LONGITUDE [map width="960" height="400" zoom="3" type="TERRAIN" latitude="39.045923" longitude="-8.085937" /]

ROADMAP TYPE MAP FROM AN ADDRESS (WITH POPUP TEXT) [map width="960" height="400" zoom="16" type="ROADMAP" popuptext="This is a popup's text" address="Avenida da Boavista, Porto, Portugal" /]

HYBRID TYPE MAP WITHOUT CONTROLS</H3> [map width="960" height="400" zoom="14" type="HYBRID" address="Avenida da Boavista, Porto, Portugal" showMapTypeControl="false" showZoomControl="false" showPanControl="false" showScaleControl="false" showStreetViewControl="false" /]

SATELLITE TYPE MAP [map width="960" height="400" zoom="17" type="SATELLITE" address="Avenida da Boavista, Porto, Portugal" /]


• type: ROADMAP (default), TERRAIN, HYBRID, SATELLITE • width: the width in pixels of the map • height: the height in pixels of the map • address: the address you want the map marker to be placed (use this parameter or the lat/long) • latitude: the latitude coordinate you want the map marker to be placed

• longitude: the longitude coordinate you want the map marker to be placed • popuptext: the text that appears inside the popup once a marker is clicked (optional) • zoom: the zoom of the map • showMapTypeControl • showZoomControl • showPanControl • showScaleControl • showStreetViewcontrol

TWITTER SHORTCODE [twitter title="Latest Tweets" numberTweets="3" username="unispheredesign" /]

FLICKR SHORTCODE [flickr title="From Flickr" numberImages="18" flickrID="52617155@N08" lightbox="true" /]

RECENT POSTS SHORTCODE [recent_posts title="Recent Posts" numberPosts="3" /]

POPULAR POSTS SHORTCODE [popular_posts title="Popular Posts" numberPosts="3" /]

BREEZE CUSTOM WIDGETS Breeze comes packed with 5 multi instance custom widgets:

• Ajax Contact Form widget • Popular Posts widget • Recent Posts widget • Twitter widget • Flickr widget

AJAX CONTACT FORM WIDGET Easily place a contact form in any widgetized area of the theme.

The widget lets you set several parameters:

• Title • Destination Email • The submit Button Text • Email delivery Success Message • Email delivery Error Message

POPULAR POSTS WIDGET Easily list most popular posts from your blog in any widgetized area of the theme.


• Title • Number of posts to show

RECENT POSTS WIDGET Easily list most recent posts from your blog in any widgetized area of the theme.


• Title • Number of posts to show

TWITTER WIDGET Easily list most recent tweets from a Twitter account in any widgetized area of the theme.


• Title • Username • Number of tweets to show • Your tweets cache interval in seconds (because of API request limit)

FLICKR WIDGET Easily list most recent photos from a Flickr ID in any widgetized area of the theme.


• Title • Flickr ID • Number of images to show • Option to display images in lightbox when clicked • Your Flickr API call cache interval in seconds

OTHER WORDPRESS FEATURES WIDGET-READY This theme is Widget-‐Ready and comes with 7 widgetized and styled areas:

• Home Section 1 (Home page bottom box 1) • Home Section 2 (Home page bottom box 2) • Home Section 3 (Home page bottom box 3) • Blog Sidebar (Blog only sidebar widget area) • Page Sidebar (Page only sidebar widget area) • Shared Sidebar (Blog and Page shared sidebar widget area) • Contact Page Sidebar (Contact Page only sidebar widget area)

Breeze also adds an independent dynamic sidebar widget area for every page you create.

Feel free to add your widgets to these widgetized areas by going to Appearance » Widgets.

125x125 Ads Widget If you are looking to display 125x125 ads in your site, then download the following plugin: http://www.webmaster-‐source.com/wp125-‐ad-‐plugin-‐wordpress/

Breeze adds styling to the above 125x125 Ads plugin so it blends with the theme’s design.

THREADED COMMENTS This theme has styling support for threaded comments and you can enable them by going to Settings » Discussion and selecting Enable threaded (nested) comments.

PSD FILES This theme comes with 1 PSD file layered and labeled.

CREDITS • jQuery (http://jquery.com/) • Nivo Slider (http://nivo.dev7studios.com/) • InnerFade (http://medienfreunde.com/lab/innerfade/) • Superfish Dropdown (http://users.tpg.com.au/j_birch/plugins/superfish/) • prettyPhoto (http://www.no-‐margin-‐for-‐errors.com/projects/prettyphoto-‐jquery-‐lightbox-‐clone/) • Quicksand (http://razorjack.net/quicksand/) • 108 Free Matte White Square Social Networking Icons (http://webtreats.mysitemyway.com/108-‐

free-‐matte-‐white-‐square-‐social-‐networking-‐icons/) • WP125 (http://www.webmaster-‐source.com/wp125-‐ad-‐plugin-‐wordpress/) • jQuery Cycle (http://jquery.malsup.com/cycle/) • flowplayer (http://flowplayer.org/)

Fonts:

• Sansation Font (http://www.dafont.com/sansation.font) • Museo (http://www.josbuivenga.demon.nl/museo.html) • Diavlo (http://www.josbuivenga.demon.nl/diavlo.html) • Vegur (http://www.fontspace.com/arro/vegur) • Fertigo Pro (http://www.josbuivenga.demon.nl/fertigo.html) • Comfortaa (http://aajohan.deviantart.com/art/Comfortaa-‐font-‐105395949) • Tertre (http://www.dafont.com/tertre.font)

Textures:

• Wood (http://nortago.deviantart.com/art/Bg-‐Texture-‐wood-‐38841113) • Summer Garden (http://www.flickr.com/photos/zooboing/4482466337/in/set-‐

72157624157169304/) • Square Dance (http://www.flickr.com/photos/zooboing/4599739763/in/set-‐72157624157169304/) • Deep Water Blues (http://webtreats.mysitemyway.com/seamless-‐pattern-‐set-‐deep-‐water-‐blues/) • Tileable Dark Wood (http://webtreats.mysitemyway.com/8-‐tileable-‐dark-‐wood-‐texture-‐patterns/) • Tileable Light Blurs (http://webtreats.mysitemyway.com/tileable-‐light-‐blurs-‐and-‐abstract-‐circle-‐

patterns/) • Floral Pattern (http://www.backgroundlabs.com/detail/link-‐238.html) • Paper Textures & Patterns (http://tileabl.es/) • Turbulent Blue (http://webtreats.mysitemyway.com/turbulent-‐blue-‐photoshop-‐patterns/) • Tileable Clouds (http://webtreats.mysitemyway.com/tileable-‐cloud-‐patterns-‐and-‐textures/)

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.

UniSphere

breeze – professional corporate and portfolio wp

Documents