Overview of the theme, its contents, and how to get started with the theme.
by Pixelwars
Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, you can sign in to our support forums with your Item Purchase Code. And please rate the theme on ThemeForest if you liked it. Thanks so much!
- Pixelwars Team
Any questions that are beyond the scope of this help file, use support forums.
Follow us on ThemeForest and don't miss new upcoming premium themes.
If you liked the theme you can rate it on ThemeForest in your downloads menu.
We assume you have basic knowledge of WordPress. In this doc you will learn how to setup, use and customize the theme.
Install the theme via WordPress admin.
Go to: Appearance > Themes > Add New > Upload.
Install and activate the theme.
This theme uses custom image sizes. If you have images in your Media Library, run Regenerate Thumbnails plugin once.
Go to: Tools > Import > WordPress.
WordPress might offer you to install the WordPress Importer plugin, if you haven't installed it before do it now.
Install and activate the plugin.
Once you've installed WordPress Importer plugin, browse to the package folder, select XML data file and upload it.
Go to: Settings > Reading. Select homepage and blog page.
Go to: Appearance > Menus. Select theme location for the imported custom menu.
Go to: Appearance > Menus. Create a custom menu.
Check theme location for the custom menu.
This theme has custom widgets. Drag and drop widgets to widget locations.
Go to: Appearance > Widgets.
Before you update, it is best practice to always make a backup of your theme folder.
Download the new theme package from your ThemeForest account.
The theme is under "Theme" folder in the package.
Choose to upload the theme via WordPress or via FTP.
There are two ways of getting files onto your site, and once there, changing them.
Use shortcode generator to add shortcodes. Click the "Insert Shortcode" button from the content editor.
Write this type of conversation.
Example:
JOHN: Hey there MARY: Aye, matey! JOHN: Huh?
Create WordPress gallery or use slider shortcode.
Example:
[slider items="" loop="" center="" mouse_drag="" nav="" dots="" autoplay="" speed="" timeout=""] [slide title="" image=""] [slide title="" image=""] [slide title="" image=""] [/slider] items="" ... 1 loop="" ... true, false center="" ... true, false mouse_drag="" ... true, false nav="" ... true, false dots="" ... true, false autoplay="" ... true, false speed="" ... 600 (millisecond) timeout="" ... 2000 (millisecond) image="" ... An image url. Upload your image to your Media Library, then copy its url and use in this parameter. title="" ... Image caption. Example 1: [slider] [slide image="image-url-here"] [slide image="image-url-here"] [slide image="image-url-here"] [/slider] Example 2: [slider items="1" loop="true" center="false" mouse_drag="true" nav="true" dots="true" autoplay="false" speed="600" timeout="2000"] [slide title="Image Caption Here" image="image-url-here"] [slide title="Image Caption Here" image="image-url-here"] [slide title="Image Caption Here" image="image-url-here"] [/slider]
Use [quote] shortcode.
Example:
[quote align="" name=""]Text here.[/quote] align="" ... alignleft, alignright
Activate the slider from Theme Options > Main Slider > Activate.
Main Slider shows sticky posts.
Go to: Posts > Add New.
Set featured image.
Edit visibility options to make sticky post.
Publish your post.
This theme uses custom image sizes. If you have images in your Media Library, run Regenerate Thumbnails plugin once.
This theme have custom page templates you can use for certain pages that might have additional features or custom layouts. You can see them in the Template dropdown menu.
Select a template for your pages from Page Attributes box.
Note: If you have images in your site, use Regenerate Thumbnails plugin once.
Go to: Portfolio > Add New.
Set featured image.
Select type.
Click Add Media button above the content editor.
Choose "Create Gallery" and select multiple images.
Note: Read carefully and try to understand how this functionality works.
You need a page with the template “Portfolio” if you want to use only one page portfolio on your site. But you don’t need any page for multiple portfolios on your site. Because the unlimited portfolio functionality doesn’t need any page to show portfolio items on your site. It works based on departments.
In multiple portfolios, every parent department works like a different portfolio page.
Shortly:
Create parent departments. They will be your different portfolio pages. And create sub departments for your parent departments. These will be your portfolio filters.
Go to Appearance > Menus. Open the Departments box from the Screen Options panel.
Add your parent departments to your menu. These are portfolio pages.
Add new portfolio items to your sub departments.
Create a page. Select "Gallery" template from Page Attributes box.
Create a new page. Select "Books" template from Page Attributes box.
Go to: Books > Add New.
Use content editor and Details box.
Use shortcode generator to add shortcodes. Click the "Insert Shortcode" button from the content editor.
[row] Column shortcode here. [/row] [column width=""] Content here. [/column] width="" ... 1 to 12. (required). 12 = 100%, 6 = 50%, 3 = 25%. width_xs="" ... 1 to 12. (optional). Extra small devices - Phones (<768px). width_md="" ... 1 to 12. (optional). Medium devices - Desktops (≥992px). width_lg="" ... 1 to 12. (optional). Large devices - Desktops (≥1200px). Example 1: (Two Columns) [row] [column width="6"] Content here. [/column] [column width="6"] Content here. [/column] [/row] Example 2: (Three Columns) [row] [column width="4"] Content here. [/column] [column width="4"] Content here. [/column] [column width="4"] Content here. [/column] [/row] Example 3: (Four Columns) [row] [column width="3"] Content here. [/column] [column width="3"] Content here. [/column] [column width="3"] Content here. [/column] [column width="3"] Content here. [/column] [/row]
[section_title align="" text=""] align="" ... center Example 1: [section_title text="My Title"] Example 2: [section_title align="center" text="My Title"]
[button text="" url="" target="" color="" size="" icon=""] target="" ... _blank color="" ... red, green, blue, yellow size="" ... big. icon="" ... heart, paper-plane, down-outline, thumbs-up Example: [button text="My Button" url="http://www.example.com"]
[launch_button]Button shortcode here.[/launch_button] Example: [launch_button][button text="My Button" url="http://www.example.com"][/launch_button]
[call_to_action title="" text=""]Button shortcode here.[/call_to_action] Example: [call_to_action title="My Title" text="My description"][button text="My Button" url="http://www.example.com"][/call_to_action]
[project_action]Button shortcode here.[/project_action] Example: [project_action] [button text="Preview" url="http://www.example.com/preview/"] [button text="Download" url="http://www.example.com/download/"] [/project_action]
[social_icon_wrap] [social_icon type="" same_tab="" url=""] [social_icon type="" same_tab="" url=""] [social_icon type="" same_tab="" url=""] [/social_icon_wrap] same_tab="" ... yes type="" ... facebook, twitter, linkedin, google-plus, pinterest, github, behance, dribbble, instagram, lastfm, vimeo, forrst, skype, picasa, youtube, flickr, tumblr, blogger, delicious, digg, friendfeed, wordpress, foursquare, xing, soundcloud, slideshare, fivehundredpx, weibo, stack-overflow, vine, vkontakte, rss Note: You can use your site's feed url for the rss icon: http://www.yoursite.com/feed/ Example 1: [social_icon_wrap] [social_icon type="facebook" url="http://www.facebook.com/username"] [social_icon type="twitter" url="http://twitter.com/username"] [/social_icon_wrap] Example 2: [social_icon_wrap] [social_icon type="facebook" same_tab="yes" url="http://www.facebook.com/username"] [social_icon type="twitter" same_tab="yes" url="http://twitter.com/username"] [/social_icon_wrap]
[intro] [rotate_words titles=""] [/intro] titles="" ... Seperate with commas. Example: [intro] Hello. I am a [rotate_words titles="writer,freelancer"] [/intro]
[tagline]Text here.[/tagline]
[drop_cap]Text here.[/drop_cap]
[quote align="" name=""]Text here.[/quote] align="" ... alignleft, alignright
[alert type=""]Text here.[/alert] type="" ... success, error. Example 1: [alert]My alert text.[/alert] Example 2: [alert type="success"]My alert text.[/alert] Example 3: [alert type="error"]My alert text.[/alert]
[contact_form captcha="" to="" subject=""] to="" ... Your email address. captcha="yes" Example: [contact_form to="yourname@example.com" subject="New Message from My Site"]
[latest_from_the_blog items=""] items="" ... Number of items to show. Example: [latest_from_the_blog items="5"]
[slider items="" loop="" center="" mouse_drag="" nav="" dots="" autoplay="" speed="" timeout=""] [slide title="" image=""] [slide title="" image=""] [slide title="" image=""] [/slider] items="" ... 1 loop="" ... true, false center="" ... true, false mouse_drag="" ... true, false nav="" ... true, false dots="" ... true, false autoplay="" ... true, false speed="" ... 600 (millisecond) timeout="" ... 2000 (millisecond) image="" ... An image url. Upload your image to your Media Library, then copy its url and use in this parameter. title="" ... Image caption. Example 1: [slider] [slide image="image-url-here"] [slide image="image-url-here"] [slide image="image-url-here"] [/slider] Example 2: [slider items="1" loop="true" center="false" mouse_drag="true" nav="true" dots="true" autoplay="false" speed="600" timeout="2000"] [slide title="Image Caption Here" image="image-url-here"] [slide title="Image Caption Here" image="image-url-here"] [slide title="Image Caption Here" image="image-url-here"] [/slider]
[tab_wrap titles="" active=""] [tab]Text here.[/tab] [tab]Text here.[/tab] [tab]Text here.[/tab] [/tab_wrap] titles="" ... Separate with commas. Example: [tab_wrap titles="Tab One,Tab Two,Tab Three"] [tab] Tab one text here. [/tab] [tab] Tab two text here. [/tab] [tab] Tab three text here. [/tab] [/tab_wrap]
[accordion_wrap] [accordion title=""]Text here.[/accordion] [accordion title=""]Text here.[/accordion] [accordion title=""]Text here.[/accordion] [/accordion_wrap]
[toggle_wrap] [toggle title=""]Text here.[/toggle] [toggle title=""]Text here.[/toggle] [toggle title=""]Text here.[/toggle] [/toggle_wrap]
[service icon="" title="" text=""]
[fun_fact icon="" text=""]
[skill_wrap] [skill title="Fireworks" percent="90"] [skill title="Photoshop" percent="70"] [skill title="Illustrator" percent="50"] [/skill_wrap]
[testimonial_wrap] [testimonial image="" title="" sub_title=""]Description text here.[/testimonial] [testimonial image="" title="" sub_title=""]Description text here.[/testimonial] [testimonial image="" title="" sub_title=""]Description text here.[/testimonial] [/testimonial_wrap] title="" ... Person's name. sub_title="" ... Person's job. image="" ... An image url. Upload your image to your Media Library, then copy its url and use in this parameter.
[tag_wrap] [tag text=""] [tag text=""] [tag text=""] [/tag_wrap]
[link_wrap]Link here.[/link_wrap]
[aside_wrap]Text here.[/aside_wrap]
[timeline] [event_group_title icon="" text=""] [event current="" date="" title="" sub_title=""]Text here.[/event] [event current="" date="" title="" sub_title=""]Text here.[/event] [event current="" date="" title="" sub_title=""]Text here.[/event] [/timeline] icon="" ... bookmark-empty, graduation-cap current="" ... current
Edit images in your content. Add full keyword as a CSS class to your image from advanced options.
Available icons here. Select your icon from the list. Don't use the prefix pw-icon-. Only use icon name for the icon="" parameter of the shortcodes.
This theme has a settings panel for customization.
Go to: Appearance > Theme Options.
This theme supports the live theme customizer.
Go to: Appearance > Customize.
Every post/page has a "Quick Edit" link when you hover in the item list. Click the link to open "QUICK EDIT" menu then uncheck the "Allow Comments" option.
This theme is ready for localization. We have made every string translatable, use a plugin or Poedit editor.
Note: The translation files are located under languages folder in the theme folder.