1. Start
  2. Theme Installation
  3. Demo Import
  4. Theme Customization
  5. Options Panel
  6. Content Management
  7. Portfolio
  8. Slider
  9. Contact Page
  10. Social Networks
  11. Multi Language Setup
  12. WooCommerce Setup
  13. JavaScript
  14. Credits

Happy Kids

Premium Children WordPress Theme

Thank you very much for your purchase. This guide will walk you through every aspect of setting up your new website. If you ever have any questions, please kindly send us e-mail. You can also follow us on Twitter and Themeforest to keep track of all our theme updates and future themes.

WooCommerce! Please note, in case of importing WooCommerce demo content, don't forget to regenerate thumbnails so that all your product images would look the same as shown on our demo site. The default size of all product images is 200 x 200px.

Theme Installation

Installing your new theme is an easy process. The steps bellow will guide you through:

  1. Download the ZIP package from Themeforest Dashboard and Unzip it.
  2. Inside you will find the file named happykids.zip.
  3. Log in into your Wordpress Dashboard and click Appearance > Themes tab.
  4. Next click the Install Themes button, then click Upload.
  5. Click Browse and locate the above mentioned happykids.zip, click Install Now.
  6. After the theme has been installed click Activate Theme , your new theme is set up and ready!
  7. If you prefer to manually upload the theme via FTP you should unpack happykids.zip into Happy Kids folder and transfer this folder into /wp-content/themes directory on your FTP, so your FTP path should be /wp-content/themes/.

One Click Demo Import

Save your time! One click demo import content is already implemented into this theme!

  1. Activate your theme.
  2. Install all the bundled plugins.
    Click "Begin installing plugins":
    Choose all pluins, select "Install" and click "Apply" button:
    Here's installation result message:
    Now you should activate the plugins:
    To begin importing demo content click Tools -> Import -> CWS Demo Importer:
    Click the "Start demo content importing" button. Please note, if you wish to import the woocommerce demo content, install the plugin first.
    The import results should look like this:
    That's all, your demo content is setup and the site is ready to use.
  3. Final step is to import Revolution Slider demo content:
    Click "Revolution Slider" -> "Import Slider":
    Slect the dummy file and click "Import Slider" button:
    Result should be like this:
    4. All done! Your website should look the same as the demo one!

Theme Customization

Our theme supports child-themes and includes a child theme (called "happykids-child") in the package.
If you plan to customize any page template, stylesheet or any other theme files we highly recommend that you use a child theme.

A child theme is a theme that inherits the functionality of another theme, called the parent theme. Child themes allow you to modify, or add to the functionality of that parent theme. A child theme is the best, safest, and easiest way to modify an existing theme, whether you want to make a few tiny changes or extensive changes. Instead of modifying the theme files directly, you can use a child theme and override within.


Child theme usage gives you a lot of advantages:
There's a nice article explaining when you should use a child theme.

Options Panel

Happy Kids comes with a very powerful, intuitive and very easy-to-use Theme Options panel. You can access the options panel by logging into the WordPress dashboard and clicking the "HappyKids" tab, located under the "Settings" tab. With the help of our Options Panel you can customize our theme's look and functionality according to your needs. Settings like logo, color scheme, patterns, page layouts, typography, social links and many other options are easily setup with its help.

Here's a brief preview of the panel's options:

Content Management

Content management of our theme is divided into two parts: CWS Builder and Shortcode Generator.

These two modules work fine with each other and you can insert any shortcode into a grid cell, created by the CWS Builder:

Portfolio

Portfolio Setup

Happy Kids theme comes with various portfolio pages. All thumbnail images are automatically resized according to one of the following page layouts:

Here are instructions for creating a portfolio page:

  1. First, let's create a Portfolio category that will be used for your portfolio items. Any category can serve as a filter, so you have to create some categories if you plan to create a filtered gallery.
  2. Log into your Wordpress dashboard and click Portfolio > Categories.
  3. Enter a category name and click Add New Category.
  4. Now you are ready to start creating portfolio items. Click Portfolio > Add Portfolio Item.
  5. Name this item and make a brief description in the content section.
  6. Assign a "featured image". If you want to override the popup image which you've just set as featured, you should fill in the "Custom URL" field. The popup item can be an image, youtube video, flash movie or iFrame. Here are samples to show how these URL's should look:
    • Image: http://www.yourdomain.com/wp-content/uploads/project1.jpg
    • YouTube: http://www.youtube.com/embed/L9szn1QQfas?autoplay=1
    • Flash: http://www.adobe.com/jp/events/cs3_web_edition_tour/swfs/perform.swf?width=792&height=294
    • Vimeo: http://player.vimeo.com/video/8245346
    • iFrame: http://www.apple.com?iframe=true&width=850&height=500
  7. Now insert the URL for the popup item (see examples above) into the 'Custom URL' field. If you leave it empty, the featured image will be used as a popup.
  8. Check the "Use direct URL instead of the popup" checkbox in case you'd like to open the URL on a new page.
  9. Repeat those steps for creating as many portfolio items as you wish.
  10. The next step is to create a new Portfolio Page which will show your portfolio items you just created. Click Pages > Add New and insert the portfolio shortcode using Shortcode Generator into the content.
  11. Now you can select the sidebar position located at the bottom of the page and save your changes.
  12. That's all, your portfolio page is ready!

Slider

Our theme uses a very powerful Revolution Slider plugin. The slider's documentation may be found here.

Contact Page Setup

Happy Kids is fully compatible with a list of popular plugins, with which help you can build any contact form, widget, or google map.
The list of the plugins is described bellow: Our demo contact page was build with the help of the above plugins.

Social Networks Setup

With the help of our Theme Options panel you can add any social network as you wish. Image bellow describes the way you can do it:

In case you don't know where to find the Twitter API keys and tokens, the steps bellow will help you create them:

Twitter Setup

That's all, your twitter setting are ready to use.

Multi Language Setup

Our theme supports WPML plugin (wpml.org) with its help you can easily translate your website into any language you wish. In case you need to translate your website, you should install the plugin and activate it. Then you can customize the flag position and its look, save your settings and the flag appear on your website:

WooCommerce Setup

Our theme supports WooCommerce plugin, so you can just install and activate the plugin to start using your shop.

Please note, in case of importing the demo content for WooCommerce, don't forget to regenerate thumbnails so that all your product images would look the same as shown on our demo site. The default size of all product images is 200 x 200px.

JavaScript

This Theme is bundled with the following Javascript files.

  1. jquery.fancybox.js. Refer to the author's documentation for additional notes on how to use it.
  2. owl.carousel.min.js Refer to the author's documentation for additional notes on how to use it.
  3. jquery.mousewheel-3.0.6.pack.js Refer to the author's documentation for additional notes on how to use it.
  4. isotope.pkgd.min.js Refer to the author's documentation for additional notes on how to use it.
  5. jquery.retina.js Refer to the author's documentation for additional notes on how to use it.

Sources and Credits

In our work we've used the following resources:

Once again, thank you so much for purchasing our Theme. We'll be glad to help you in case of having any questions relating to it. We'll do our best to assist and help.