How To

Important installation note

After installing and activating the theme, you need to navigate to Settings > Permalinks and click on the “Save Changes” button, even if you haven’t made any changes. This is to register the custom post types used in the theme.

You also need to navigate to Settings > Reading and set front page to display “Your latest posts” if you have previously had a static page as your front page.

Setting up the Homepage

Below is a screenshot of the Kaboodle home page with each of it’s modules explained. More detailed documentation below.

The home page of Kaboodle is based on custom post types, with 4 regions available for placement of custom woo widgets in the footer and sidebar. The featured slider, mini-features and portfolio modules can easily be enabled/disabled under Homepage Layout in the theme options.

Setting up the Featured Slider

The unique home page featured slider can be used to display noteworthy content and has it’s own custom post type called Slides designated to it. This custom post type is hugely flexible in it’s display in the slider. You can have background images for the whole slide, an image left/right aligned to the text, only text, buttons in the text, or content with a video.

The Kaboodle homepage slider pulls the custom Slides post type. The settings for the slider is set under the Homepage Slider options and include options to set the number of slides, animation speed, effect, auto start and slide interval.

Adding a Slide

To add a slide simply follow these steps:

1. Go to Slides > Add New.
2. Type a title for the slide and complete all of the post’s body content.
3. If you want an image to appear as the background to the entire slide than add a Slide Image in the Custom Settings panel.
4. If you don’t use an image as background, insert some text in the content and make it a H2 heading to make a title. The post title isn’t used in the slider on non image slides..
5. Publish the slide.

Add buttons to featured slide

To add a button to a page in the featured area you can use the [simplebutton] shortcode like this:

[slidebutton url="http://woocommerce.test/"]View Our Themes[/slidebutton] [styled_text]Or[/styled_text] [slidebutton url="http://woocommerce.test/"]View Our Pricing Plans[/slidebutton]

To add more buttons, just repeat the shortcode button code, but leave a single space between the shortcodes if you want them to appear on one line.

Add video to featured slide

Adding video is just as simple as adding an image to the page. Simply use the Video Embed Code field in the Custom Settings panel to add the embed code you have from a video sharing site like YouTube or Vimeo.

Setting up the Portfolio

Setup the Portfolio Theme Options

First thing you’ll want to do before adding items to your portfolio is get the portfolio theme options set how you want. Navigate to Kaboodle>Theme Options>Portfolio. You’ll then see the options listed below in the screenshot.

Let’s now walk through what each of these options do. The portfolio title is what your visitors will see when visiting your portfolio page. Then the portfolio description will show next to that. Below this are your portfolio tags, these can be setup as ways to filter your portfolio items. In our demo we have them split into three tags, and let’s take our nature tag for example. Visiting the portfolio page you can click on this tag and filter all portfolio items that are tagged with nature.

Next option up is the permalink you want your portfolio items to have. This is placed before the title of your portfolio item, i.e. – yoururl.com/portfolio-items/nature-shot. Be careful to not set a custom permalink that conflicts with anything else on your site. You may run into minor issues there.

Our last options to setup here are related to a single portfolio option and the gallery feature you can use on them. This is simply a slider of your images inside a single portfolio post. You can enable this slider or disable it here, if enabled you have options for control over the animations speed, auto start, and slide interval.

Add the Portfolio link to navigation

1. Go to Page -> Add New
2. Add a title to the page e.g. “Portfolio”
3. Select the Portfolio page template in the Page Attributes panel on the right
4. Publish your page!
5. Modify your custom menu if needed under Appearance>Menus.

Adding portfolio items

The portfolio section also uses a custom post type called “Portfolio”.

1. Add a new portfolio item in WordPress (Portfolio -> Add New)
2. Add a title to the portfolio item
3. Add a tag to the post if you wish to categorize your portfolio (e.g. “Web” or “Print”)
4. Add some text in the content to describe the portfolio item
5. If using TimThumb upload the Portfolio Thumbnail image of (450x210px) or larger in the Custom Settings area.
6. If using WP Post Thumbnail upload your image via the Featured Image option in the right sidebar.
7. If you want to add more pictures to your Portfolio item you can simply upload multiple photos when uploading the thumbnail.
8. Alternatively if you want your thumbnail to link to a clients site for example, add an URL to their site or link it anywhere else you’d like.
9. Publish the portfolio item and repeat for next portfolio item

Upload multiple images per portfolio item

To have multiple images under the portfolio item, enter the rest of the images by uploading image attachments to the Portfolio Item and click Save Changes.

Showing Portfolio on Homepage

To get the latest portfolio items to display on the home page follow the three steps below:

1. Go to the Homepage Layout theme options panel.
2. Enable the portfolio.
3. Save settings and you’re done!

Implementing the Dribbble portfolio module

The Dribbble portfolio section will show below the normal portfolio posts. To setup your Dribbble stream, download and activate Dave Rupert’s Dribbble plugin.

After activating the plugin, go to Apperance > Widgets and add the widget to a sidebar and set the options exactly like our screenshot. After setting up the widget, remove it from the sidebar.

Please note: The dribble feed will show below the portfolio, if you have the Dribbble plugin active.

Setting up the Mini-Features

The mini-features area of the home page can showcase your services you offer, products you sell, or little pieces of information about your company. The mini-features are custom post types just like the slides documented above, so use them exactly how you wish.

Adding the Mini-Features Module

The number of mini features depends on how many “Mini-Features” you have published. You can enable the mini-features area on the home page under the “Homepage” theme options. You can also add two pieces of content from WordPress pages to the home page if you specify the page IDs of the pages you wish to display.

To add an info box simply follow these steps:

1. Go to Mini Features > Add New.
2. Type a title for the Mini Features and complete all of the post’s body content.
3. Add a “Mini Features Icon” in the Custom Settings panel if you want to display an icon next to the slide.
4. Add an excerpt
5. Publish the mini feature.

Remember to enable the mini features area in the theme options under the “Homepage layout” tab.

Setting up content above/below the Mini-Features

In Kaboodle you can have one page’s content displayed above the Mini-Features and one below. It’s easily setup via the Kaboodle theme settings. Select a page to go above and below if you’d like and it’s content will be displayed nicely around the Mini-Features module.

Setting up blog posts below the Mini-Features

Simply enable this checkbox via the Kaboodle theme settings and choose the number of posts you’d like to show below the Mini-Features module. Simple as that.

Setup Feedback Widget

To setup the Feedback Widget which can be used in the sidebar, go to Appearance > Widgets and add the Woo – Feedback widget to your Primary sidebar.

Now you simply need to add feedback posts using the Feedback Custom Post Type like shown in the screenshot below.

Widgets

Custom Kaboodle widgets

The theme includes 8 custom widgets that you can add to any of your 5 widgetized regions – 1 sidebar and 4 footer widgetized regions.

The custom woo widgets included are:

• Woo – Adspace
• Woo – Search
• Woo – Tabs
• Woo – Twitter Stream
• Woo – Flickr
• Woo – Blog Author Info
• Woo – Embed/Video
• Woo – Subscribe/Connect
• Woo – Feedback
• WP Dribbble

[insert name=”adding-widgets”]

Page Templates

[insert name=”page-templates”]