Downtown WP Theme Documentation

Thank You for purchasing Downtown WP Theme. Before asking any questions make sure You read this documentation. If You have any additional questions about this theme You can always create a topic on my support forum. I will try to do my best to help You. If You want some special features that aren't included with this theme feel free to contact me, if more people would like to have these I might add them in upcoming update. If You find any errors or bugs please send me a message and I'll try to fix them as soon as possible. Hopefully You find here all necessary informations to build Your own, amazing site.



Have a question? Open ticket on Our support forum

Please, remember to rate my theme on Themeforest (thanks in advance). You can do this by going to Your Profile -> Downloads. If You have problems with this theme You can always contact me before, I'm sure We can solve them.

Useful plugins that you can use

  1. Contact Form 7 -> used for contact forms on the page
  2. Post Type Order plugin -> you can use it to sort custom post types if you don't like changing dates of publication which is default option in wordpress
  3. Custom Sidebars plugin -> allows you to create all the widgetized areas you need, your own custom sidebars, configure them adding widgets, and replace the default sidebars on the posts or pages you want in just few clicks.

Installation

  1. Login into your wordpress admin panel.
  2. Go into Appearance -> Themes.
  3. Click on "Install Themes".
  4. Click on the "Upload" and then choose zip file called "downtown" from your hard drive.
  5. After this Click on "Install Now", after uploading activate the theme.

  1. Now you should install required plugin. You can find info at the top of the dashboard. If You don't like small information box about plugins to install You can hit "Dismiss this notice" and You won't be bother anymore.
  2. To install plugins click on "Begin installing plugins". Choose from "Bulk action" dropdown list "Install" and select all plugins (recommended aren't required, but they can be used to extend this theme). Click "Apply" and wait couple seconds. After all You should see "All installations and activations have been completed. All plugins installed and activated successfully."
  3. Now you can import xml file with whole demo content. Go to Tools -> Import, install additional plugin (WordPress Importer) if needed, and choose xml file from "demo content" folder. You can choose to download placeholder images by selecting "download and import file attachements". This is no required if You want just content. When import will end you should see message "All done. Have fun!". After that you can go to another step.
  4. Go to Settings -> Reading and check "a static page" and choose your frontpage: Home. You can albo choose blog template, but it can be used with shortcode on any page, so You can just leave it alone and set only frontpage.
  5. Go to Appearance -> Menus -> Manage Locations and set "main menu" as a "Primary Menu" and "footer menu" as a "Footer Menu".
  6. Go to Revolution Slider WP and click on "Import Slider" at the top of the page. Now You can choose both zip files from "demo content" folder and add them in Your theme. They'll recreate sliders from demo page

Last thing to do is to enable css classes on menu items. To do this follow these steps:

  1. Go to Appearance -> Menus
  2. Click on "Screen Options" (right top corner)
  3. Check "CSS Classes" under "Show advanced menu properties"
  4. Now you can add classes to the menu e.g. to use megamenu

Good job, now we have everything set up. In future demo from xml file might be little different than original demo due to updates, but I'll always have the most important content to help You easily startt with Your site.


Information! All options are well described in the panel so I won't describe them here once again. If you'll need any help with them just let me know.













Things to keep in mind:

  • Logo height should be used for resizing retina logo. Retina logo is used only on retina devices like iPads and iPhones.
  • By default top section and footer area will be empty (WordPress Importer doesn't import widget areas). To make them visible go to Appearance-> Widgets and set Your widgets in proper areas. If You want to use multiple areas e.g. for pages use Custom Sidebars plugin
  • If You have problems with Google Fonts and You don't see the list You might want to add Your own API key. It shouldn't happen, but it might, so keep that in mind. If You'll have this problem just let me know and I'll walk You through this.

Portfolio

Portfolio is very useful thing to show off you projects, but you can easily use it to show other items too thanks to fully customizable portfolio single page. There are couple of options that you can set to create your awesome portfolio. But before you'll work on that you have to know how this portfolio works. It's pretty easy to set up and after reading this you shouldn't have any problems at all.

1. Create some categories

The first step will be creating some categories that will be used for your portfolio filter. Go to 'Portfolio' -> 'Portfolio Categories' and add some categories there.

2. Add your new portfolio item

Now we can add new portfolio item. Options are well described, so I just add couple words and things that You should keep in mind.

If you want to change order of the items you can manipulate date of publication. You can also use plugin like 'Post type order' for this.

Things to keep in mind:

  1. Portfolio single page is fully customizable, so you can use it like standard page with all shortcodes You want. That gives You way more flexibility then using prepared column layouts.
  2. Categories - always choose your categories, they'll be used for filter, related projects and taxonomy pages
  3. Featured image - You should always use this! It's used mainly for thumbs in portfolio shortcodes and widgets. It can be switched off on portfolio single page.
  4. Portfolio layout type - choose to use standard or full width layout. Full width layout should be used with "section" shortcode
  5. [portfolio-details] shortcode - this is shortcode that contains clients name, date, categories and custom link. It's used with shortcode because that way it gives You full flexibility on how to use this. It can be mixed with e.g. jumbotron, wells, panels etc. You can check couple examples on my demo page



Team members

1. Create some categories

The first step will be creating some categories that will can be used with the shortcode (slug) to show your team members all over the page. Go to 'Team Members' -> 'Team Members Categories' and add some categories there.

If You want to use only one member You can use it's ID. ID is listed next to the member name on "All Team Members" page.

2. Add your new team member

Now we can add new team member. You can use team members with built in custom shortcode.

  • Title - name of the team member
  • Content area - put here your description. You can use shortcodes and other things here. This will be used only in single Team Member page if you choose to link to it or in modal window
  • Team Members Categories (on the right) - remember to choose your categories for team member if you want to use this later on
  • Date of publication - if you want to change order of the items you can manipulate date of publication to change items order. You can also use plugin like 'Post type order' for this. It's your choice
  • Featured image - remember to always set this up. I'll show photo of your team member in carousels etc. and You can always switch it off on single page
  • Team single page layout type - choose to use standard or full width layout. Full width layout should be used with "section" shortcode
  • Person description link - You can choose if You want to link team member to single page or use custom link to e.g. redirect it to other page
  • Custom link - custom link used only when it was selected under "Person description link"
  • Person position - you can choose here person position or something else like short title
  • Team member social icons - use icons created with shortcode



Galleries are use for showing Your photos divides for albums. Albums can be filtered with jQuery filter by using categories. There are a lot of different options on how to show Your photos on single page and with shortcode. Galleries can be used anywhere on the page with full width pages and sidebars.

1. Create some categories

The first step will be creating some categories that will be used for your gallery album filter. Go to 'Galleries' -> 'Gallery Categories' and add some categories there.

2. Add your new gallery

Now we can add new gallery. Options are well described, so I just add couple words and things that You should keep in mind.

If you want to change order of the items you can manipulate date of publication. You can also use plugin like 'Post type order' for this.

Things to keep in mind:

  1. Categories - always choose your categories, they'll be used for filter, related projects and taxonomy pages
  2. Featured image - You should always use this! It's used mainly for gallery album thumb in shortcode. It won't be used on single page.
  3. Gallery single page layout type - choose to use standard or full width layout. Full width layout should be used with "section" shortcode
  4. Add/Edit Gallery Images - You can add here gallery images that will be used on this gallery.
  5. Gallery ID - You can find this in at the top of the right sidebar. This is ID of this gallery page. If You will add You images and want to use them You can use this ID with "gallery" shortcode and use it wherever you want.



MT Sliders

MT Sliders is basically custom slider generator that is used to create sliders by using different slider plugins. Every plugin has it's own settings. Categories are not used here, because there is no filtering. All You need is shortcode that can be found on MT Sliders -> All Sliders page. You can just copy it and paste wherever You want.

Things to keep in mind:

  1. Slider type - based on this different options and scripts will be loaded. You can't use both at one time.
  2. Slider images - You can add You images here. Only image is required. Title, description and link are optionsal, You can use them or not if You want. You can change images position by drag&drop
  3. Flexslider settings:
    • Images size - by setting this up You can choose different images size that are use for slider. Sometimes You don't need full width images, that's why this options might be sometimes handy. By default I suggest to use standard
  4. TwentyTwenty settings:
    • This slider support only TWO images. Because it's used for showing comparison of two images e.g. for before/after. Also make sure that images are equal in width and height. Slider would work otherwise, but it won't look that good.
    • Images size - by setting this up You can choose different images size that are use for slider. Sometimes You don't need full width images, that's why this options might be sometimes handy. By default I suggest to use standard.
    • Offset - by offset You can set how many % from left comparison border will be placed. 50% will put it in the middle, 0% on the left (only second image will be fully visible on start) and 100% on the right (only first image will be visible on start). Of course Slider will be still movable, it'll just set border position



Revolution Slider WP

Revolution Slider WP is premium plugin that is provided with this theme. Documentation for this plugin is visible under "HELP" tab (on the right top corner) on Revolution Slider WP page. This is actual link to online documentation




Theme uses only one custom template right now - Blank. Blank template can be used for maintenance page or something similar. Everything else can be set on default page template with options and shortcodes.

If You'll use featured image on the page it'll be visible above page title. If You don't want to use it simply remove it.

Page settings



To show just small amount of post use built in "More" button that will divide Your content. I strongly suggest NOT to use shortcodes for preview. Use only short text description. Of course You can use shortcodes, but from my own experience it might not be the best idea, because some plugins use preview text and do not support shortcodes or custom html code.

Main settings

These settings work for every post format. You can choose layout for single post here and choose if You want to use Author biography box. This uses standard WordPress used description text that You can add in Users -> Your profile -> About Yourself -> Biographical Info



Standard

Standard post is just as basic as you can get. Title, description, you can also use featured image or not, based on what you need.



Audio

Choose here Your .mp3 and .ogg files (for self hosted audio) and use embed option for external file or shortcode. If You want to use self-hosted solution just make sure You provided both files to support all main browsers



Gallery

This post format uses slider for images presentation. You can choose here all built in plugins. Photos can be added with default WordPress media and options for every slider are visible when You choose it.



Link

In this post type you can use custom url that will be used with title.



Quote

Description is changed here for the blockquote, name of the author can be set under Quote settings. I suggest to use Title for widgets etc. It won't be used in quote itself, but it is used in widgets and some shortcodes



You can find here a list of all shortcodes you can use in this theme. They are available in visual editor.

If you want to copy/paste these codes in your theme make sure you get rid of pre tags. To do this paste codes in html view or simply paste them first in some kind of notepad and then in your theme.

Button

Options:

  • size: xs, sm, md, lg
  • block: false, true
  • link: actual button link
  • target: _self, _blank
  • icon: no, yes
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
  • xclass: extra class that that can be used for additional styling
[button size="lg" block="" link="#" target="_self" icon="no" animated="yes" anim_type="fadeInUp" anim_delay="700" xclass="extra-class"]Button text[/button]

Button group

Options:

  • size: xs, sm, md, lg
  • vertical: false, true
  • justified: false, true
[button-group size="lg" vertical="" justified=""]
[button link="#"]Button text[/button]
[button link="#"]Button text[/button]
[button link="#"]Button text[/button]
[/button-group]

Alert

Options:

  • type: default, primary, success, info, warning, danger
  • strong: title that is visible on the top right corner of alert
  • dismissable: false, true
[alert type="default" strong="Notice:" dismissable="true"]Content...[/alert]

Code

Options:

  • inline: false, true
  • scrollable: false, true
[code inline="true" scrollable="false"]Code...[/code]

Columns row

[row]Put columns here[/row]

Column

Options:

  • type: xs, sm, md, lg
  • size: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12
  • xclass: extra class that that can be used for additional styling
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[column type="md" size="6" xclass="" animated="no" anim_type="fadeIn" anim_delay="700"]Content[/column]

Label

[label]Label[/label]

Badge

Options:

  • right: true, false
[badge right="false"]Badge[/badge]

List group and list group item

[list-group]
[list-group-item]Integer id massa sit amet diam rutrum luctus[/list-group-item]
[list-group-item]Cras vehicula dictum sapien, quis vestibulum[/list-group-item]
[list-group-item]Vivamus adipiscing accumsan eleifend nec eu[/list-group-item]
[list-group-item]Morbi dignissim ipsum eget sem mollis dicta[/list-group-item]
[/list-group]

Glyphicon

Options:

  • type: icon class
  • color: HEX color value e.g. #ff0000
  • size: 0, 033x, 2x, 3x, 4x, 5x
[glyphicon type="glyphicon glyphicon-asterisk" size="5x" color="#ff0000"]

Font Awesome stack

Options:

  • size: 0, lg, 2x, 3x, 4x, 5x
[fa-stack size="lg"]Put Font Awesome Icons here[/fa-stack]

Font Awesome Icons

Options:

  • type: icon class
  • size: 0, lg, 2x, 3x, 4x, 5x
  • fixedwidth: false, true
  • spin: false, true
  • rotate: rotate-90, rotate-180, rotate-270, flip-horizontal, flip-vertical
  • stack: 1x, 2x - leave empty if icon is not used in stack
  • color: HEX color value e.g. #ff0000
[fa type="fa fa-home" size="lg" fixedwidth="false" spin="false" rotate="" stack="" color="#ff0000"]
[fa-stack size="2x"]
  [fa type="fa fa-camera" stack="1x"]
  [fa type="fa fa-ban" size="2x" stack="2x" color="#F65F41"]
[/fa-stack]

Table wrap

Options:

  • type: default, table-striped, table-bordered, table-hover, table-condensed
  • responsive: false, true
[table-wrap type="table-striped" responsive="false"]table html goes here[/table-wrap]

Well

Options:

  • size: sm, default, lg
[well size="lg"]Content...[/well]

Tabs

Options:

  • type: nav-tabs, nav-pills
  • title: tab title
[tabs type="nav-tabs"]
  [tab title="title 1"]content...[/tab]
  [tab title="title 2"]content...[/tab]
[/tabs]

Tooltip

Options:

  • title: tooltip title
  • placement: top, right, bottom, left
[tooltip title="Tooltip text" placement="top"]Text...[/tooltip]

Button with tooltip. Other elements can be used that way too

[tooltip title="Tooltip text" placement="top"]
  [button size="lg" type="default" block="false" link="#" target="_self" xclass=""]Large button[/button]
[/tooltip]

Popover

Options:

  • title: popover title
  • popcontent: popover content under title
  • placement: top, right, bottom, left
  • trigger: click, hover, focus
[popover title="title" popcontent="popover content" placement="top" trigger="click"]Text...[/popover]

Button with popover. Other elements can be used that way too

[popover title="title" popcontent="popover content" placement="top" trigger="click"]
  [button size="lg" type="default" block="false" link="#" target="_self" xclass=""]Large button[/button]
[/popover]

Panel

Options:

  • title: panel title
  • footer: panel footer text, leave empty if You don't want to use it
[panel title="title" footer="footer text"]Content...[/panel]

Progress

Options:

  • value: choose bewteen 1-100
  • title: panel title
[progress value="80" title="PHP 80%"]

Jumbotron

[jumbotron]Content...[/jumbotron]

Lead

Options:

  • align: left, right, center, justify
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[lead align="center" animated="no" anim_type="fadeIn" anim_delay="700"]Lead text goes here[/lead]

Emphasis

Options:

  • type: default, muted
[emphasis type="default"]Text...[/emphasis]

Modal, modal trigger, modal footer

Options:

  • text: trigger text
  • title: title used in modal
  • id: ID for modal trigger and modal window, must match trigger and window and for every trigger it has to be unique
  • footer: no, yes
[modal-trigger id="modal1"]Click this to open modal[/modal-trigger]
[modal id="modal1" title="modal title" footer="no"]modal content[/modal]

Modal with footer

[modal-trigger id="modal2"]Click this to open modal[/modal-trigger]
[modal id="modal2" title="modal title" footer="yes"]modal content[modal-footer]modal footer text[/modal-footer][/modal]

Responsive

Options:

  • type: visible-xs, visible-sm, visible-md, visible-lg, hidden-xs, hidden-sm, hidden-md, hidden-lg
[responsive type="visible-xs"]Content...[/responsive]

Text align

Options:

  • align: left, right, center, justify
[text-align align="center"]Text...[/text-align]

Custom list

Options:

  • type: unstyled, inline
[custom-list type="unstyled"]Put list here[/custom-list]

Clear

If You're using floated elements and if You see any problems with text, content then after floated elements just put this clear

[clear]

Hr (divider)

Options:

  • type: without-line, single-line, double-line
  • style: solid, dashed, dotted. Border style
  • height: 0, 5, 10, 15, 20, 30, 40, 50, 60. Adds top and bottom margin
  • text: no or yes. Use text in the middle of divider
[hr type="single-line" style="solid" height="20" text="yes"]This is divider text[/hr]

Header

Options:

  • size: 1, 2, 3, 4, 5 or 6
  • type: single, double
[header size="4" type="single"]Header goes here[/header]

Header centered (used with text-align shortcode)

[text-align align="center"][header size="4" type="single"]Header goes here[/header][/text-align]

Blockquote

Options:

  • title: blockquote author/company/title
  • right: false, true. Align text to the right
[blockquote title="Jon doe" right="false"]Content...[/blockquote]

Image

Options:

  • src: image source
  • width: image width
  • height: image height
  • style: default, rounded, circle, thumbnail
  • align: none, left, right, center
  • title: image title
  • alt: image alt text
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[image src="http://site.com/image.jpg" width="200" height="200" style="rounded" align="" title="image title" alt="image alt text" animated="yes" anim_type="fadeIn" anim_delay="700"]

Lightbox

Options:

  • type: image, video. Choose what You want to open in lightbox
  • thumb: thumbnail image source
  • url: big image link/video link
  • width: image width (in pixels)
  • height: image height (in pixels)
  • style: default, rounded, circle, thumbnail
  • align: none, left, right, center
  • title: image title
  • alt: image alt text
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[lightbox type="image" thumb="http://site.com/thumb.jpg" url="http://site.com/image.jpg" width="200px" height="200px" style="rounded" align="" title="image title" alt="image alt text" animated="yes" anim_type="fadeIn" anim_delay="700"]

Testimonial

Options:

  • author: author name
  • company: company/title of testimonial author
  • thumb: thumbnail image source
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[testimonial author="Jon Doe" company="Developer" thumb="http://site.com/thumb.jpg" animated="yes" anim_type="fadeIn" anim_delay="700"]Best theme ever! :)[/testimonial]

Testimonial slider

Options:

  • style: style1, style2
  • author: author name
  • company: company/title of testimonial author
  • thumb: thumbnail image source
[testimonial-slider style="style1"]
  [testimonial-slide author="Jon Doe" company="Developer" thumb="http://site.com/thumb.jpg"]Best theme ever! :)[/testimonial-slide]
  [testimonial-slide author="Billy Smith" company="Great Sound Inc." thumb="http://site.com/thumb.jpg"]Short testimonial[/testimonial-slide]
[/testimonial-slider]

Accordion

Options:

  • name: accordion tab name/title (should be unique)
[accordions]
  [accordion name="Accordion tab 1"]Content...[/accordion]
  [accordion name="Accordion tab 2"]Content...[/accordion]
[/accordions]

Toggle

Options:

  • title: toggle tab name/title (should be unique)
  • margin: no, yes. Adds small bottom margin to toggle
[toggle title="Toggle title" margin="no"]Content...[/toggle]

Social icons

Options:

  • icontype: social icon type
  • icontitle: title used in tooltip
  • url: social link url

Whole list of icons

[social-icons]
[social-icon icontype="twitter" icontitle="Twitter" url="#"]
[social-icon icontype="facebook" icontitle="Facebook" url="#"]
[social-icon icontype="youtube" icontitle="YouTube" url="#"]
[social-icon icontype="vimeo" icontitle="Vimeo" url="#"]
[social-icon icontype="skype" icontitle="Skype" url="#"]
[social-icon icontype="linkedin" icontitle="LinkedIn" url="#"]
[social-icon icontype="google-plus" icontitle="Google+" url="#"]
[social-icon icontype="envelope" icontitle="Email" url="#"]
[social-icon icontype="github" icontitle="GitHub" url="#"]
[social-icon icontype="flickr" icontitle="Flickr" url="#"]
[social-icon icontype="dropbox" icontitle="Dropbox" url="#"]
[social-icon icontype="dribbble" icontitle="Dribbble" url="#"]
[social-icon icontype="behance" icontitle="Behance" url="#"]
[social-icon icontype="instagram" icontitle="Instagram" url="#"]
[social-icon icontype="soundcloud" icontitle="SoundCloud" url="#"]
[social-icon icontype="pinterest" icontitle="Pinterest" url="#"]
[social-icon icontype="evernote" icontitle="Evernote" url="#"]
[social-icon icontype="picasa" icontitle="Picasa" url="#"]
[social-icon icontype="stumbleupon" icontitle="Stumbleupon" url="#"]
[social-icon icontype="lastfm" icontitle="Last FM" url="#"]
[social-icon icontype="tumblr" icontitle="Tumblr" url="#"]
[social-icon icontype="stack-overflow" icontitle="Stack Overflow" url="#"]
[social-icon icontype="bitbucket" icontitle="Bitbucket" url="#"]
[social-icon icontype="smashing" icontitle="Smashing" url="#"]
[social-icon icontype="apple" icontitle="Apple" url="#"]
[social-icon icontype="android" icontitle="Android" url="#"]
[/social-icons]

Service

Options:

  • style: style1, style2. Choose between icon on the left (1) or centered on top (2)
  • title: service title
  • icon: choose icon. By default only Font Awesome icons are available, but if You want to use Glyphicon You can just add proper class manually
  • url: if You want to use custom link on service title put Your url here
  • target: _self, _blank
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[service style="style3" title="Bootstrap 3 powered" icon="fa fa-check" url="" target="" animated="yes" anim_type="fadeIn" anim_delay="700"]Content...[/service]

Team

Options:

  • postid: use ID of team member if You want to show only one member
  • slug: category slug (can be user to show members divider by e.g. positions)
  • limit: number of members to show
  • size: 2, 3, 4, 6, 12
  • order: ASC, DESC
  • orderby: date, title, author, ID, rand
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[team postid="" slug="team1" limit="3" size="4" order="DESC" orderby="date" animated="yes" anim_type="fadeIn" anim_delay="700"]

Team carousel

Options:

  • columns: 3 or 4
  • limit: number of members to show
  • order: ASC, DESC
  • orderby: date, title, author, ID, rand
  • slug: category slug (can be user to show members divider by e.g. positions)
[team-carousel columns="3" limit="9" order="DESC" orderby="date" slug="team3"]

Pricing

Pricing columns are block elements. To divide them for 3 or 4 columns simply wrap them with column shortcode.

Options:

  • title: pricing column title/package title/plan title
  • value: price value e.g. $19
  • span: small text under value e.g. monthly, daily, per month etc.
  • url: link url for button
  • button: button text
[pricing title="Basic" value="$19" span="per month" url="#" button="Purchase"]Put unordered list here[/pricing]

Google map

Options:

  • width: map width
  • height: map height
  • src: map link generated on Google Maps site
[gmap width="{{width}}" height="{{height}}" src="{{src}}"]

Portfolio carousel

Options:

  • columns: 3 or 4
  • limit: number of items to show
  • order: ASC, DESC
  • orderby: date, title, author, ID, rand
  • slug: category slug
[portfolio-carousel columns="3" limit="9" order="DESC" orderby="date" slug=""]

Portfolio details

This shortcode should be used only on portfolio single page to show details that are set under portfolio item

[portfolio-details]

Clients carousel

Options:

  • columns: 3, 4, 5, 6
  • thumb: logo source
  • title: title used in tootlip
  • url: custom link url (will create link from thumbnail)
[clients-carousel columns="5"]
[client thumb="http://placehold.it/200x100/eeeeee" title="Client name" url="#"]
[client thumb="http://placehold.it/200x100/dddddd" title="Client name" url="#"]
....
[client thumb="http://placehold.it/200x100/666666" title="Client name" url="#"]
[client thumb="http://placehold.it/200x100/555555" title="Client name" url="#"]
[/clients-carousel]

Latest posts

Options:

  • limit: number of posts to show
  • order: ASC, DESC
  • orderby: date, title, author, ID, rand
  • cat: category ID
  • slug: category slug
[latest-posts limit="6" order="DESC" orderby="date" cat="" slug=""]

Full

Options:

  • full: no, yes
  • style: default, light, dark
  • paddingtop: section top padding
  • paddingbottom: section bottom padding
  • backgroundcolor: section background color
  • bordercolor: section top and bottom border color
  • backgroundimage: section background image
  • backgroundrepeat: background image repeat
  • backgroundposition: background image position
  • backgroundattachment: background image attachment
  • backgroundsize: background image size
  • parallax: no, yes (use parallax effect in this section)
  • parallax_speed: choose between 1 and 9
[section full="no" style="default" paddingtop="60px" paddingbottom="60px" backgroundcolor="#fafafa" bordercolor="#eee" backgroundimage="http://placehold.it/200x200" backgroundrepeat="repeat" backgroundposition="left top" backgroundattachment="scroll" backgroundsize="auto" parallax="no" parallax_speed="1"]Section content goes here[/section]

YouTube

Options:

  • id: video ID. For example youtube.com/watch?v=YE7VzlLtp-4
  • width: video width
  • height: video height
  • autoplay: false, true
[youtube id="YE7VzlLtp-4" width="1000" height="563" autoplay="false"]

Vimeo

Options:

  • id: video ID. For example vimeo.com/1084537
  • width: video width
  • height: video height
  • autoplay: false, true
[vimeo id="1084537" width="1000" height="562" autoplay="false"]

Milestone

Options:

  • number: milesone number
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[milestone number="24" animated="no" anim_type="fadeIn" anim_delay="700"]Cups of coffee daily[/milestone]

Piechart

Options:

  • number: piechart number
  • percent: yes, no (show % sign after number)
  • trackcolor: circle border color in HEX e.g. #f2f2f2
  • barcolor: bar (related to number) border color in HEX e.g. #4AE2BC
  • linewidth: border width in pixels
  • size: piechart size. Keep in mind that it's not responsive
  • easing: easing type
  • animated: no, yes
  • anim_type: animation type, 26 animations to choose
  • anim_delay: animation delay in milliseconds
[piechart number="65" percent="yes" trackcolor="#f2f2f2" barcolor="#FF3C1F" linewidth="4" size="140" easing="swing" animated="no" anim_type="fadeIn" anim_delay="700"][/piechart]

Blog

Options:

  • limit: number of posts to show. If You're using pagination it's number of items per page
  • order: ASC, DESC
  • orderby: date, title, author, ID, rand
  • cat: category ID
  • slug: category slug
  • pagination: no, yes. Shows pagination at the bottom of the blog
[blog limit="5" order="DESC" orderby="date" cat="" slug="" pagination="yes"]

Gallery album

Options:

  • limit: number of items to show. If You're using pagination it's number of items per page
  • order: ASC, DESC
  • orderby: date, title, author, ID, rand
  • slug: category slug
  • filter: no, yes. Shows filter at the top of gallery. At least there must be two categories
  • pagination: no, yes. Shows pagination at the bottom of the gallery
  • size: 2, 3, 4, 6
  • images_size: standard, masonry
  • layout_type: standard, grid
[mt-gallery-album limit="-1" order="DESC" orderby="date" slug="" filter="no" pagination="no" size="6" images_size="standard" layout_type="standard"]

Gallery

Options:

  • id: gallery ID
  • size: 2, 3, 4, 6
  • images_size: standard, masonry
  • layout_type: standard, grid
[mt-gallery id="45" size="6" images_size="standard" layout_type="standard"]

Portfolio

Options:

  • limit: number of items to show. If You're using pagination it's number of items per page
  • order: ASC, DESC
  • orderby: date, title, author, ID, rand
  • slug: category slug
  • filter: no, yes. Shows filter at the top of portfolio. At least there must be two categories
  • pagination: no, yes. Shows pagination at the bottom of the portfolio
  • size: 2, 3, 4
  • images_size: standard, masonry
  • layout_type: standard, grid
[mt-portfolio limit="-1" order="DESC" orderby="date" slug="" filter="no" pagination="no" size="2" images_size="standard" layout_type="standard"]

MT Slider

This shortcode is available to copy under MT Sliders -> All Sliders

Options:

  • id: slider ID
[mt-slider id="417"]

Custom Latest Posts

With this widget You can show You latest blog posts in Your sidebar.


Custom Latest Projects

With this widget You can show You latest portfolio projects in Your sidebar.


Flickr Widget

With this widget You can show photos from Your Flickr account. You can choose number of photos and how they should display (randow or from latest). If You don't know Your FlickrID use idGettr to get it.

Theme is compatibile with translation plugins (for example WPML) and includes .mo and .po files that can be used for translations. Below You can find couple basic steps on how to start with translation. Keep in mind that WPML is external plugin and has it's own extended documentation. If You have problems with the plugin ask Your questions at WPML Support Forum. Extended plugin documentation can be found here.



Translation only with mo and po files


Firstly I suggest to check out original WordPress documentation. There are couple steps You should take to translate theme in Your language easily.

  1. You should have a tool to help You with translation. Nice list of tools can be found here (Poedit is nice solution for beginners).
  2. After You translate theme strings You should save mo and po files as a new files (for example fr_FR.mo, fr_FR.po for french language)
  3. The last thing to do is to add extra line in Your wp-config.php file - link


Translation with WPML plugin


WPML plugin is really powerful solution if You want to use multilingual site. Keep in mind that WPML is paid solution and is not available with this theme, You have to buy it Yourself.

These are extensions recommended (and tested) by WPML team. You can see description of the different modules here

If You're using some additional extensions and found a bug with translations just let Us now and We will release a fix.

Short instructions on how to start with translations:

  1. Install WPML Multilingual CMS and all necessary add-ons
  2. You'll need to go throught coulpe steps like settings default site language etc. After this You'll see list of additional menu items under WPML in sidebar
  3. By default mo/po files are translatable via WPML. You can change this if You want by going in WPML -> Theme and plugins localization.
  4. To translate theme options and every other translatable string go to WPML -> String translation. Click on "translations" next to the string, translate it to Your language, check "translation is complete" and save.
  5. Categories and tags can be translated in WPML -> Taxonomy Translation
  6. If You'll end You translations You can choose where to show language switcher. To do this go to WPML -> Languages -> Language switcher options and set Your options there. You can use different styles and places where You can put language switcher.
  7. Now We should get work on pages and posts. Sometimes pages and posts disappear from their list. To solve this go WPML -> Support -> troubleshooting and click on "Remove ghost entries from translations table", "General clean up" and then "Set language information". That should solve the issue. If not describe Your problem on WPML forum. It's not theme issue. Original support forum post on this can be found here
  8. To translate pages and posts go to Pages -> the page You want to translate, and then You'll see WPML box on the right side. Find "Translate yourself" and click on "+" button to add translation. You can then duplicate You content or translate everything from scratch.

This is just basic help with this plugin. If You need more help You should head to the WPML Official Page and read original plugin documentation.

Answer: To get support use Our free support forum. Please don't ask post-purchase questions in comments section at ThemeForest. If you need to send me wp admin details you can do this by sending an email via contact form in my profile page at ThemeForest.

Once again Thank You very much for purchasing this theme. If You'll have any trouble with it don't hesitate to create a topic on my support forum. I'll do everything what's in my power to help. Any feedback and ideas for future will be useful.

Best Regards
Marcin Michalak