Karma Additional Information
Karma Wordpress Theme Documentation
A Premium WordPress Theme by TrueThemes
Thank You
First and foremost we want to give a huge thank you for purchasing this theme. We truly appreciate your support!
As a TrueThemes customer you now have full access to our amazing support services. We highly encourage you to watch the Training Videos before proceeding any further. The Training Videos are super helpful and will walk you through every single aspect of setting up and using your awesome new theme.
Wordpress Optimization
This section provides you with instructions for optimizing your Wordpress installation. These steps are not required, however, we highly recommend them.
Modify Upload Path
Modifying your upload path is a very beneficial modification. It keeps things nice and tidy and makes it much easier should you ever have to move your website and locate files in the future.
- Log into your Wordpress Dashboard.
- Click on
Settings > Media
. - Scroll to the bottom and un-check the box labeled "Organize my uploads into month- and year-based folders"
- Save Changes.
Update Permalink Structure
This will give you SEO-friendly page links.
- Log into your Wordpress Dashboard.
- Click on
Settings > Permalinks
. - Choose
Custom Structure
and type/%postname%
into the provided field. - Save Changes.
Theme Installation
Please follow these steps to install your new Wordpress Theme:
- Download the ZIP package from Themeforest and Unzip it.
- Within the unzipped folder you will see a file named
Karma.zip
- this is the actual Wordpress Theme. - Log into your Wordpress Dashboard and click on
Appearance > Themes
. - Next click on
Install Themes
then click onUpload
. - Click
Browse
then locate the file namedKarma.zip
and clickInstall Now
. - After the theme has installed click on
Activate Theme
and you are all set! Your new theme is now installed!
Site Options Panel
This theme comes with a very powerful Site Options panel. After the theme is installed you can access this panel by logging into the Wordpress dashboard and clicking on Appearance > Site Options
. All options are very self explanitory and are covered in detail in the instructional Training Videos.
Menus and Navigation
You can access the Menu control panel by clicking on Appearance > Menus
. Full details are also covered in the Training Videos.
Main Menu, Footer Menu & Top Menu Setup:
- Log into your Wordpress dashboard and click on
Appearance > Menus
. - Enter a Name for your Menu and click on
Create Menu
. - Add Pages to your menu by checking off the check boxes and hitting
Add to Menu
- To re-order the pages of your menu items simply drag and drop them into place.
- After your menu is completed hit
Save Menu
. - After Your menu is saved you'll need to choose your navigation from the dropdown list under the 'Theme Locations' section.
- Hit save and you are all complete. Your menu is now setup.
Install Premium Plugins
Karma comes with 3rd-party premium plugins as well as a list of recommended plugins to improve your website experience completely free of charge. To install these plugins simply click on 'Appearance > Install Plugins' and follow the on-screen instructions. You can also visit the LayerSlider section of this documentation for additional information.
Page Setup
Overview:
Karma offers a variety of different page templates for all of your website needs. All page templates within the theme are fully interchangeable and can be used for any area of your website. We've eliminated the need for "page-specific templates" by adding the ability to add a Slider or Contact form to every page template. For example, if you'd like for your Homepage to have a Sidebar and a jQuery-1 Slider, you will simply create a new page and choose the "Right Sidebar" or "Left Sidebar" page template. You will then use Karma's "Slider Settings" box on the page editing screen to define a slider for that page. For more details about Slider setup please visit the Karma jQuery Sliders section of this documentation.
Available Page Templates:
Default Template:
This is "locked in" by Wordpress and is similar to a full width page template. We encourage against using this template.Blank Canvas:
Great for home pages or landing pages. This is a full width template which strips out the utility bar/search box, etc. It's literally a completely empty content area ready for awesomeness.Blog:
Standard Blog page.Contact (Google Map):
This is a full width page template which has a full-width Google map under the header area of the page.Contact (iPhone):
This is similar to a Right Sidebar page template. It's got a widget-ready sidebar which has an iPhone background for some really nice visual appeal.Filterable Gallery:
Perfect for image galleries or portfolios. This is a full width page template that will pull in Gallery Posts and "auto-magically" add some awesome filtering and animation.Full Width:
Standard full width page template.Left Nav:
Great for "content pages" such as a "company" section within your site. This page template will automatically pull in child pages of the current section and display them in a beautiful left-sub-navigation. You can also create a Custom Menu under 'Appearance > Menus' and display it on your left-nav-template instead.Left Nav + Sidebar:
Same as Left Nav template but this one's also got a Right Sidebar.Left Sidebar:
Standard Left Sidebar page template.Right Nav:
Same as Left Nav template but this nab is displayed on the right.Right Nav + Sidebar:
Same as above but this one's also got a Left Sidebar.Right Sidebar:
Standard Right Sidebar page template.Sitemap:
This page template "auto-magically" pulls in all pages on your website and organizes them into a beautiful Sitemap. Simply create the page, choose this template and you're done. (any content inputted into Wordpress' WYSIWYG editor will not display on this page)Sitemap 2:
Another great option for Sitemaps. This one's also got a widget-ready sidebar and a few customization options so don't forget to visit the following areas if using this template:Appearance > Widgets' and 'Appearance > Site Options > Utility Pages
Blog Setup
Setting up your Blog section is a very straightforward process. It simply entails creating a new page, choosing the proper page template and pointing Wordpress to your new Blog page. Full details are also covered in the Training Videos.
Creating the Blog page:
- Log into your Wordpress Dashboard.
- Click on
Pages > Add New
. - Give your Page a title and choose the
Blog
page template. - Save and rejoice! :)
Pointing Wordpress to your Blog page:
- Log into your Wordpress Dashboard.
- Click on
Settings > Reading
. - Choose the radio button labeled
A static page (select below)
. - Choose your Homepage for
Front Page
, and choose your Blog page forPosts Page
. - All done. Your Blog is now fully functional.
- You can visit the Site Options Panel for further Blog customizing.
Appearance > Site Options
Gallery
Create Gallery Posts:
- Karma has a custom post type called "Gallery Posts". All available options are clearly described on the Gallery Posts editing screen.
- To create a post simply click on
Gallery Posts > Add New
and follow the on-screen instructions. - The most important thing to make note of is the Category that you assign to your post. Full details are listed below:
Filtering Categories
- A "filtering category" is the category displayed in the small menu at the top of a Gallery Page. When your visitors click one of these categories the Posts below will animate to only display posts within that category.
- Assigning the categories works just like a normal Wordpress post so no new learning curve here.
- There is one important difference: Each Gallery Post must be saved into a Child Category. This will enable you to choose it's Parent Category when configuring the actual gallery page.
Here's an example:
Let's say we want to create a Gallery Page which has 3 filtering categories: Web, Print, Video We will need to house these 3 categories under a Parent Category so that we can properly configure our gallery page. These categories look something like this: Work Posts <----- Parent Category Web Print Video Organizing them like this will enable us to choose "Work Posts" when creating our Gallery page and the Gallery page will then automatically display posts within Web, Print and Video. Please note that the name of the Parent Category never gets displayed on the front end of your website. Confused by Parent/Child Categories? A quick search on Google for "wordpress parent/child categories" will take the bacon.- Configuring the Gallery page is a very straightforward process. You can have an unlimited amount of Gallery pages all displaying their own unique content.
- To create a Gallery page simply do as normal and click on
Pages > Add New
- On the right side of the screen within the
Page Attributes
section chooseFilterable Gallery
for the page template. - Scroll down the page a bit and under the Wordpress Content Editor you will see Karma's "Gallery Settings" options. This is where you configure the page as per your desired layout, image frame style, etc.
- All items are very self explanatory however the most important part of this section is choosing the proper category to pull from. Using the example above we would choose the "Work Posts" category and our gallery would display posts from Web, Print and Video.
Karma jQuery Sliders
Karma comes with 3 custom jQuery sliders that are all powered by the very popular FlexSlider Plugin. You can create an unlimited amount of sliders, all with unique content, and display them on any of the page templates. The first step is to create the Slider Posts that you plan to display within the slider. Full details outlined below.
Create Slider Posts
- Karma has a custom post type called "Slider Posts". All available options are clearly described on the Slider Posts editing screen.
- To create a post simply click on
Slider Posts > Add New
and follow the on-screen instructions. - Just make note of the Category you've saved your posts in so that you can properly display them on the page of your choice. Note: Parent/Child categories are not required for Slider Posts.
Add a Slider to any page
- Once you've finished creating your Slider Posts you are now ready to add them to a Slider on your desired page.
- Edit your desired page just as you normally would. Click on
Pages
and then hover over the desired page and clickingEdit
. - Once the Page Editing Screen scroll down and you will see a
Slider Settings
box located the Wordpress WYSIWYG Editor. All options are very self explanatory. Choose your desired slider type (Karma jQuery 1, Karma jQuery 2 or Karma jQuery 3), then use the on-screen instructions to customize your slider.
Premium Sliders
3D CU3ER Slider
The 3D sliders in this theme are powered by the amazing new CU3ER v1. Slider setup is covered in full detail in the online Training Videos.
3D Slider plugin
The folks at CU3ER did an amazing job with their 3D plugin. This plugin will allow you to easily create, modify and insert an unlimited amount of sliders on your website. You can download the plugin here.
Layer Slider
Karma saves you money by including the very popular LayerSlider and Revolution Sliders completely free of charge.
- To install these premium plugins simply click on
Appearance > Install Plugins
. - On this page you will be presented with a list of premium and free plugins that are ready to be installed.
- To install a plugin simply hover the item on the list and click 'Install'
Official LayerSlider Documentation:
http://www.docs.purethemes.net/sukces/layerslider/documentation/documentation.html
Revolution Slider
To install the Revolution Slider plugin simply follow the instructions as outlines above in the LayerSlider section.
Official Revolution Slider Video documentation:
http://www.themepunch.com/codecanyon/revolution_wp/liveguide/01.video.html
Shortcodes
This theme comes with over 100 built-in shortcodes. To insert a Shortcode simply edit the page or post you wish to modify, and click on the Shortcode Manager button located directly in the Wordpress WYSIWYG editor. Instructions are listed within each Shortcode Panel. Full details are also covered in the Training Videos.
Homepage Layouts
Homepage Layout 3 Columns + Images
[callout1] Callout Content goes here... [/callout1] [one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_large"] Content goes here... [/one_third] [one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_large"] Content goes here... [/one_third] [one_third_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_large"] Content goes here... [/one_third_last]
Homepage Layout 4 Columns + Images
[callout1] Callout Content goes here... [/callout1] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth_last]
Homepage Layout Video Left
[video_left] [video_frame] [iframe url="URL to video here..." width="572" height="312"] [/video_frame] [video_text] [h2]Title goes here...[/h2] Content goes here... [/video_text] [/video_left] [callout1] Callout Content goes here... [/callout1] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth_last]
Homepage Layout Video Right
[video_right] [video_frame] [iframe url="URL to video here..." width="572" height="312"] [/video_frame] [video_text] [h2]Title goes here...[/h2] Content goes here... [/video_text] [/video_right] [callout1] Callout Content goes here... [/callout1] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth_last]
Columns
Two Columns
[one_half] Content goes here... [/one_half] [one_half_last] Content goes here... [/one_half_last]
Three Columns
[one_third] Content goes here... [/one_third] [one_third] Content goes here... [/one_third] [one_third_last] Content goes here... [/one_third_last]
Four Columns
[one_fourth] Content goes here... [/one_fourth] [one_fourth] Content goes here... [/one_fourth] [one_fourth] Content goes here... [/one_fourth] [one_fourth_last] Content goes here... [/one_fourth_last]
Five Columns
[one_fifth] Content goes here... [/one_fifth] [one_fifth] Content goes here... [/one_fifth] [one_fifth] Content goes here... [/one_fifth] [one_fifth] Content goes here... [/one_fifth] [one_fifth_last] Content goes here... [/one_fifth_last]
Six Columns
[one_sixth] Content goes here... [/one_sixth] [one_sixth] Content goes here... [/one_sixth] [one_sixth] Content goes here... [/one_sixth] [one_sixth] Content goes here... [/one_sixth] [one_sixth] Content goes here... [/one_sixth] [one_sixth_last] Content goes here... [/one_sixth_last]
One Fourth and Three Fourth Column Layout
[one_fourth] Content goes here... [/one_fourth] [three_fourth_last] Content goes here... [/three_fourth_last]
Three Fourth and One Fourth Column Layout
[three_fourth] Content goes here... [/three_fourth] [one_fourth_last] Content goes here... [/one_fourth_last]
Two Third and One Third Column Layout
[two_thirds] Content goes here... [/two_thirds] [one_third_last] Content goes here... [/one_third_last]
One Third and Two Third Column Layout
[one_third] Content goes here... [/one_third] [two_thirds_last] Content goes here... [/two_thirds_last]
Columns and Images/Lightboxes
Full Width - Two Column + Images
[one_half] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" float="" lightbox="" lightbox_group="" size="two_col_large"] Content goes here... [/one_half] [one_half_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="two_col_large"] Content goes here... [/one_half_last]
Full Width - Three Column + Images
[one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_large"] Content goes here... [/one_third] [one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_large"] Content goes here... [/one_third] [one_third_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_large"] Content goes here... [/one_third_last]
Full Width - Three Column + Portrait Images
[one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="portrait_thumb"] Content goes here... [/one_third] [one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="portrait_thumb"] Content goes here... [/one_third] [one_third_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="portrait_thumb"] Content goes here... [/one_third_last]
Full Width - Four Column + Images
[one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth] [one_fourth_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"] Content goes here... [/one_fourth_last]
Side Nav - Two Column + Images
[one_half] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="two_col_small"] Content goes here... [/one_half] [one_half_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="two_col_small"] Content goes here... [/one_half_last]
Side Nav - Three Column + Images
[one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_small"] Content goes here... [/one_third] [one_third] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_small"] Content goes here... [/one_third] [one_third_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_small"] Content goes here... [/one_third_last]
Side Nav - Four Column + Images
[one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_small"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_small"] Content goes here... [/one_fourth] [one_fourth] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_small"] Content goes here... [/one_fourth] [one_fourth_last] [frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_small"] Content goes here... [/one_fourth_last]
Various Shortcodes
Business Contact
[business_contact phone_number="" skype_username="" skype_label="Skype" email_address="" directions_url="" directions_label="get driving directions"]
FontAwesome Icon
[tt_vector icon="" size="fa-3x" border="false" pull="" color=""]
FontAwesome IconBox
[tt_vector_box icon="" size="fa-4x" color="" link_to_page="" target="" description=""] <h3>Title here</h3> ...content here... [/tt_vector_box]
Social Icons - Vector
[social style="vector" show_title="true" rss="" twitter="" facebook="" email="" flickr="" youtube="" linkedin="" pinterest="" foursquare="" delicious="" digg="" google="" dribbble="" skype="" rss_title="RSS" twitter_title="Twitter" facebook_title="Facebook" email_title="Email" flickr_title="Flickr" youtube_title="YouTube" linkedin_title="Linkedin" pinterest_title="Pinterest" foursquare_title="FourSquare" delicious_title="Delicious" digg_title="Digg" google_title="Google +" dribbble_title="Dribbble" skype_title="Skype"]
Social Icons - Vector Color
[social style="vector_color" show_title="true" rss="" twitter="" facebook="" email="" flickr="" youtube="" linkedin="" pinterest="" foursquare="" delicious="" digg="" google="" dribbble="" skype="" rss_title="RSS" twitter_title="Twitter" facebook_title="Facebook" email_title="Email" flickr_title="Flickr" youtube_title="YouTube" linkedin_title="Linkedin" pinterest_title="Pinterest" foursquare_title="FourSquare" delicious_title="Delicious" digg_title="Digg" google_title="Google +" dribbble_title="Dribbble" skype_title="Skype"]
Latest Tweets
[latest_tweets user="your_user_name_here" num="3"]
Related Posts
[related_posts limit="5" title="Related Posts"]
Single Accordion
[accordion class='accord1'] [slide name="title1"]slide content 1[/slide] [slide name="title2"]slide content 2[/slide] [slide name="title3"]slide content 3[/slide] [/accordion]
Multiple Accordion
[accordion class='accord1' active='1'] [slide name="Accordion 1 title 1"]You can make this slide open by default by using active='1'[/slide] [slide name="title 2"]slide content 2[/slide] [slide name="title 3"]slide content 3[/slide] [/accordion] [accordion class='accord2' active='2'] [slide name="Accordion 2 title 1"]slide content 1[/slide] [slide name="title 2"]You can make this slide open by default by using active='2'[/slide] [slide name="title 3"]slide content 3[/slide] [/accordion]
Tabs
[tabset tab1="tab 1 title" tab2="tab 2 title"] [tab]tab 1 content[/tab] [tab]tab 2 content[/tab] [/tabset]
Testimonials
[testimonial_wrap] [testimonial]Content goes here... [client_name]John Doe, Company Name[/client_name] [/testimonial] [testimonial]Content goes here... [client_name]John Doe, Company Name[/client_name] [/testimonial] [testimonial]Content goes here... [client_name]John Doe, Company Name[/client_name] [/testimonial] [/testimonial_wrap]
Team Members
[team_member members_name="" members_title="" style="modern" image_path="" link_to_page="" description=""] <h4>John Doe, CEO</h4> <p>Insert Bio Here</p> [/team_member]
Left Video Layout
[video_left] [video_frame] [iframe url="URL to video here..." width="572" height="312"] [/video_frame] [video_text] [h2]Title goes here...[/h2] Content goes here... [/video_text] [/video_left]
Right Video Layout
[video_right] [video_frame] [iframe url="URL to video here..." width="572" height="312"] [/video_frame] [video_text] [h2]Title goes here...[/h2] Content goes here... [/video_text] [/video_right]
Text Styling
Heading With Horizontal Line
[heading_horizontal type="h6" margin_top="20px" margin_bottom="20px"] Text goes here... [/heading_horizontal]
Callout Text 1
[callout1] Content goes here... [/callout1]
Callout Text 2
[callout2] Content goes here... [/callout2]
Heading 1 (H1)
[h1] Text goes here... [/h1]
Heading 2 (H2)
[h2] Text goes here... [/h2]
Heading 3 (H3)
[h3] Text goes here... [/h3]
Heading 4 (H4)
[h4] Text goes here... [/h4]
Heading 5 (H5)
[h5] Text goes here... [/h5]
Heading 6 (H6)
[h6] Text goes here... [/h6]
Bulleted List Shortcodes
Arrow List
[arrow_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/arrow_list]
Caret List
[caret_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/caret_list]
Check List
[check_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/check_list]
Circle List
[circle_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/circle_list]
Double Angle List
[double_angle_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/double_angle_list]
Full Arrow List
[full_arrow_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/full_arrow_list]
Plus List
[plus_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/plus_list]
Star List
[star_list] [list_item]Item 1...[/list_item] [list_item]Item 2...[/list_item] [list_item]Item 3...[/list_item] [/star_list]
Callout Boxes
This is an example of a Callout Box shortcode.
[callout font_size="13px" style="alphagreen"] Content goes here... [/callout]
Buttons
This is an example of a Button shortcode.
[button url="http://" target="" size="small" style="alphagreen" icon="" popup="" title=""] Content goes here... [/button]
Notification Boxes
This is an example of a Notification Box shortcode.
[notify_box font_size="13px" style="green"] Content goes here... [/notify_box]
Dividers
Basic Divider.
[hr]
Shadow Divider.
[hr_shadow]
Top Link Divider.
[top_link] text for link [/top_link]
Individual Image Frames
Full width (Banner).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="banner_full"]
Full width (Portrait Fullsize).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="portrait_full"]
Full width (Portrait Thumbnail).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="portrait_full"]
Full width (One Half).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="two_col_large"]
Full width (One Third).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_large"]
Full width (One Fourth).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_large"]
Side Nav (Banner).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="banner_regular"]
Side Nav (One Half).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="two_col_small"]
Side Nav (One Third).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="three_col_small"]
Side Nav (One Fourth).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="four_col_small"]
Sidebar + Side Nav (Banner).
[frame style="modern" image_path="" link_to_page="" target="" description="" float="" lightbox="" lightbox_group="" size="banner_small"]
Latest Blog Posts
Default Layout (Small Thumbnails).
[blog_posts count="4" post_category="" title="From the Blog" link_text="Read More" character_count="115" layout="default"]
Full Width - 2 Columns.
[blog_posts count="2" post_category="" title="From the Blog" link_text="Read More" character_count="115" layout="two_col_large" style="modern"]
Full Width - 3 Columns.
[blog_posts count="3" post_category="" title="From the Blog" link_text="Read More" character_count="115" layout="three_col_large" style="modern"]
Full Width - 4 Columns.
[blog_posts count="4" post_category="" title="From the Blog" link_text="Read More" character_count="115" layout="four_col_large" style="modern"]
Side Nav - 2 Columns.
[blog_posts count="2" post_category="" title="From the Blog" link_text="Read More" character_count="115" layout="two_col_small" style="modern"]
Side Nav - 3 Columns.
[blog_posts count="3" post_category="" title="From the Blog" link_text="Read More" character_count="115" layout="three_col_small" style="modern"]
Side Nav - 4 Columns.
[blog_posts count="4" post_category="" title="From the Blog" link_text="Read More" character_count="115" layout="four_col_small" style="modern"]
Image Frame Shortcodes
All images within the image frames get automatically re-sized to the dimensions below.
- large banner -
922px x 201px
banner image for full width page templates. - medium banner -
703px x 201px
banner image for the following page templates: Left Nav, Left Sidebar, Right Nav, Right Sidebar. - small banner -
493px x 201px
banner image for the following page templates: Left Nav + Sidebar, Right Nav + Sidebar. - 2 columns -
437px x 234px
two column layout on full width page templates. - 2 columns small -
324px x 180px
two column layout on the following page templates: Left Nav, Left Sidebar, Right Nav, Right Sidebar. - 3 columns -
275px x 145px
three column layout on full width page templates. - 3 columns small -
202px x 113px
three column layout on the following page templates: Left Nav, Left Sidebar, Right Nav, Right Sidebar. - 4 columns -
190px x 111px
four column layout on full width page templates. - 4 columns small -
135px x 76px
four column layout on the following page templates: Left Nav, Left Sidebar, Right Nav, Right Sidebar.
Sidebars
Creating Sidebars is an absolute breeze. Simply create the Sidebar, add your Widgets and assign the Sidebar to your chosen page. Full details are also covered in the Training Videos.
Creating a new Sidebar:
- Log into your Wordpress Dashboard.
- Click on
Appearance > Sidebars
. - Click on
+ Add New Sidebar
. - Give your Sidebar a name and click
OK
. (note: the name of the sidebar is never displayed to your end users.)
Adding Widgets to a Sidebar:
- Log into your Wordpress Dashboard.
- Click on
Appearance > Widgets
. - Locate the Sidebar you just created. It will be located toward the bottom right of your screen.
- Drag your desired Widgets into your Sidebar.
Assigning Sidebar to Page:
- Log into your Wordpress Dashboard.
- Click on
Pages
and edit your desired page. (please note that you must be using either a
Left Sidebar
orRight Sidebar
page template.) - Scroll down and locate the custom meta box labeled
Sidebars
. - Select your Sidebar from the Dropdown list.
- Save your page and rejoice! :)
WooCommerce
This theme is fully compatible with the WooCommerce Plugin. This is a popular E-Commerce plugin that enables you to turn your website into a fully functional E-Commerce shop.
** Please note: We did not develop the WooCommerce Plugin so we are only available to provide support for our Wordpress Theme as it relates to the plugin. **
Sidebars:
- This theme comes with 2 custom sidebars that are automatically displayed on all WooCommerce Pages.
WooCommerce Sidebar
← This Sidebar is displayed on all default WooCommerce Pages.WooCommerce - Cart + Checkout
← This Sidebar is displayed on all WooCommerce Checkout Pages.- The sidebars are modified and widgets are added just like any regular sidebar.
From within the Wordpress Dashboard:Appearance > Widgets
WooCommerce Resources:
Copyright © TrueThemes Inc. All rights reserved.