Documentation for Kidzone – Kids & Baby Store Elementor WooCommerce WordPress Theme

WELCOME TO KidZone THEME DOCUMENTATION

Firstly, a huge thanks for purchasing this theme. In this document, we will covers the installation and use and answers to common problems and issues for KidZone. We encourage you to read throughout this document in case there is any difficulties. You can find more tutorials via the Frequently Asked Questions, WPThemeGo Forum and also contact us via our Ticket Support System.

 

KidZone Features:

 

KidZone is a multipurpose WooCommerce WordPress theme. With multi-homepage designs, mobile layouts ready, multi vendor marketplace support and full ecommerce features, KidZone will surely a suitable theme for any multi-vendor marketplace or any shopping store website. KidZone is now compatible with the best multi vendor marketplace plugins including Dokan, WC Vendors, WCFM Marketplace and WC Marketplace.

 

KidZone Tutorial Videos:

 

You can find tutorial videos for KidZone installation and use on WPThemeGo Youtube Channel. We will update new videos in this playlist then please stay tunned!

 

Also, follow us on Facebook and Twitter for freebies, discounts and theme updates.

GETTING STARTED

To install this theme you must have a working version of WordPress already installed. If you need help installing WordPress, follow the instructions in WordPress Support.

 

Below are all the useful links for WordPress information.

 

  1. WordPress Codex – General info about WordPress and how to install on your server.
  2. First Steps With WordPress – General info about multiple topics about WordPress.
  3. FAQ New To WordPress – The most popular FAQ’s regarding WordPress.

Before installing the theme, please make sure that your hosting provider and website meet the minimum requirements as below:

 

To run KidZone, we recommend your host and website support:

 

  1. Your web host has the minimum requirements to run WordPress.
  2. Your site with latest version of WordPress is prefered.
  3. Always create secure passwords for FTP and Database.

 

Important Note about PHP Configuration:

 

In several cases, you may deal with problems related to low PHP configuration limits, such as: white screen, demo content fails when importing, empty page content and other similar issues. The solution is to increase the PHP limits. You can do this on your own by editing the file php.ini file in the root directory or contact your web host and ask them to increase those limits to a minimum as follows:

 

  1. max_execution_time 360
  2. memory_limit 256M
  3. post_max_size 64M
  4. upload_max_filesize 64M

FILE STRUCTURE

After downloading the theme package on WPThemeGo, when extracting it, you will see the files included as below:

 

Download KidZone theme on WPThemeGo:

 

To download the theme, log into your WPThemeGo account and go to Download tab of your account. Here you can find KidZone Theme, click on the download button and select the All files & documentation to get all the files included in KidZone package.

 

Files included in KidZone theme package:

 

Below is a full list of everything that is included when you download the main files:

 

  1. code – includes sw_kidzone_theme_vx.x.x.zip and sw_kidzone-child-theme.zip.
  2. userguide – online documentation for KidZone theme.
  3. licensing – license for theme on ThemeForest.
  4. psd – includes PSD for KidZone theme.

 

Plugins included in theme package:

 

You can find the plugins in folder sw_kidzone_theme_vx.x.x.zip\kidzone\lib\plugins. They are sw_ajax_woocommerce_search.zip, one-click-demo-import.zip, sw_core.zip, sw-product-brand.zip, sw_wooswatches.zip, sw-add-to-cart-notification.zip, .sw-woo-elements.zip .

 

For plugin Elementor, and Revolution Slider, we include the link of them in the theme and you can install it through the demo.

 

Included Plugins Licenses:

 

For Revolution Slider, we are not allowed to include the license key in the theme package due to the copyright. If there is any update, we are accountable for updating the theme with the newest version of plugin. After that, you can update in your site.

 

For Elementor, you can contact us via our Ticket Support System to get help.

 

KidZone quickstart file:

 

We also provide you sw_kidzone_quickstart_vx.x.x.zip for Quickstart Installation 01 time only for the first installation. You can create a ticket at the Support System and provide us the Item Purchase Code or Order ID ( if you bought on our site wpthemego.com ) to send us your request.

INSTALLATION

There are 02 ways to install KidZone theme: Quickstart Installation and Manual Installation.

 

  1. Quickstart Installation: With this one, you will replace your whole site with a new one like our site in demo. This one is suitable for you if you build a fresh site and want to get demo content. Please note that with this way, all your old data will be replaced.
  2. Manual Installation (or Theme Installation): By this way, you can install the theme into your site and import demo data while remaining current data of your site. If you have a WordPress website with full of content and you want to keep it, this is a suitable choice for you.

 

Info Before install the theme, please make sure that your site meets all the system requirements and the theme package is available in your computer. You may need to contact us to get the quickstart file for this installation.

To install Quickstart, please follow steps as below:

 

  1. Have the sw_kidzone_quickstart_vx.x.x.zip available in your computer.
  2. Create the Database and a User for your site. You can skip this step if there is available one.
  3. Upload and Extract the quickstart files to the desired location on your web server using FTP or CPanel. It could be a folder in xampp > htdocs if you install on your localhost.
  4. Go to the URL where you uploaded the file to load the WordPress Installer.
  5. Now all is the same to WordPress Installation. You will go step by step with Language Settings, Database Settings and WordPress Info Settings.
  6. You can choose the demo style you want in option Choose Demo at the end of window Database Settings.
  7. After the successful installation, you can go to your site and enjoy the result.

 

Info For more detail, you can see the tutorial for this Quickstart Installation here: How to Install Quickstart for WordPress Theme.

Before installing KidZone theme, you need to have a WordPress site that meets all the theme requirements and have the latest KidZone theme package available in your computer.

 

KidZone theme installation:

 

There are 02 ways for you to upload the theme into your site: Upload theme via WordPress Admin and Upload theme via FTP.

 

Info If the theme file size is larger than 8M, it should be uploaded via FTP.

  1. Navigate to the Admin Panel of your site (i.e. yoursite.com/wp-admin/).
  2. Login to your WordPress Dashboard and go to Appearance > Theme and click Add New to add new theme.
  3. Click the Upload Theme button then Choose File and select sw-kidzone_theme_vx.x.x.zip file and click Install Now.
  4. It will take a few minutes to install the theme.
  5. After seeing the message Theme installed successfully, you can Activate KidZone in your site.
  1. Access your FTP client, such as FileZilla to start upload KidZone theme.
  2. Navigate to the folder of your website (i.e. yoursite.com/wp-content/themes) then upload and extract theme file sw_kidzone_theme_vx.x.x.zip to this directory. After that, you will have a theme folder named as KidZone in your site’s directory.
  3. Login to the Admin Panel of your site (i.e. yoursite.com/wp-admin/). Go to Appearance > Themes to find KidZone theme.
  4. After seeing KidZone theme’s thumnail, choose and click on Activate to install it in your site.

KidZone theme activation:

 

After install KidZone theme, you need to enter the theme purchase code of KidZone to then click on Save Changes to activate KidZone theme on your website. You can find theme purchase code following these steps.

 

“The package could not be installed…”

 

One of the most common reasons people have issues is because they try uploading the full zip that includes demo content, theme, userguide …etc which displays the “The package could not be installed. The theme is missing the style.css stylesheet.” error. Please make sure you upload only the theme which is called sw_kidzone_theme_vx.x.x.zip.

 

To have the theme works well with full features, after installing the theme, all the required plugins should be installed and activated. Below are the required plugins for KidZone theme:

These are the required plugins of KidZone theme.

 

  1. One Click Demo Import (Please Deactivate it after the Demo Import to not prevent your site performance.)
  2. SW Core
  3. SW Ajax WooCommerce Search
  4. SW Product Brand
  5. SW WooCommerce Swatches
  6. SW Woo Elements
  7. SW Post Elements
  8. Sw LookBook
  9. SW Add To Cart Notification
  10. WooCommerce
  11. Slider Revolution
  12. Elementor
  13. YITH WooCommerce Compare
  14. YITH WooCommerce Wishlist

These are the plugins compatible with KidZone theme.

 

  1. Dokan: Plugin for front end multi vendor marketplace on WordPress, powered by WooCommerce.
  2. WC Vendor: Plugin for multivendor with WooCommerce.
  3. WC Marketplace: Plugin for multivendor with WooCommerce.
  4. WCFM Marketplace: Plugin for multivendor with WooCommerce.
  5. WP Rocket: Plugin to speed up your site .
  6. Loco Translate: Loco Translate provides in-browser editing of WordPress translation files.
  7. WPML: WPML allows running fully multilingual websites with WordPress.
  8. AliDropship: Allows direct import of AliExpress products to the user’s dropshipping store.

Required plugins installation for KidZone:

 

  1. After activating the theme, it will direct you to Install Required Plugins window for SW KidZone theme.
  2. Choose all of required plugins then select Install and click Apply.
  3. After successful installation, return to the Plugin Install window, choose all of them then select Activate and click Apply.
  4. When activating the plugins successfully, you will see a message at the top of the page.

 

Important:

 

When installing, if there is notice that any plugin is unsuccessful installed, please choose each of them and install one by one again. If your server does not permit automatic installation, you need to install them manually with plugins in folder data/plugins.

A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme. Child themes are the recommended way of modifying an existing theme. If you plan on doing any customization on your site, you will definitely need to set up this child theme on your site.

 

After installing and activating KidZone theme, you can install KidZone Child Theme following steps below:

 

  1. In the Dashboard, go to Appearance > Theme and click Add New to add new theme.
  2. Click the Upload Theme button then Choose File and select sw_kidzone-child-theme.zip file and click Install Now.
  3. It will take a few minutes to install the theme.
  4. After seeing the message Theme installed successfully, you can Activate KidZone Child Theme in your site.

 

Info For more detail, you can see a tutorial about Child Theme: How to Use Child Theme.

Update KidZone Manually:

 

To update the theme in your site, please follow steps as below:

 

  1. Back up your site to save your data and custom code or CSS. It will save your life in the worst situation.
  2. Copy the custom code you made in your site and save it in your computer to add it later.
  3. Uninstall the theme and install new version sw_kidzone_theme_vx.x.x.zip of KidZone.
  4. Click on Begin updating plugins link and install new version of plugins. This step is essential to update the required plugins for bug fix and feature improvement.
  5. Now the theme is updated successfully. You can paste your custom code in the new theme.
  6. After all, check your site again to ensure that the update works.

 

Info For more detail, you can see the tutorial here: How to Update WordPress Theme for Your Site?.

Ussually, when a required plugin is updated, we also update the theme package. Therefore, when updating KidZone theme, you can also choose to update plugin automatically.

 

To update plugin in KidZone theme, please follow steps as below:

 

  1. Back up your site! to save your customization.
  2. Download the latest version of KidZone theme on WPThemeGo. There is latest version of plugin in the theme package/data folder. Or else you can get it from plugin provider.
  3. Deactive and remove old version of this plugin. You can directly delete this plugin’s files in folder /public_html/wp-content/plugins of your site using FTP.
  4. Now you can install new version in your site. If the max_size_upload > 8M, you can upload it via Admin Panel. Or else, you need to extract the plugin then add it to folder /public_html/wp-content/plugins of your site using FTP.
  5. Now the theme is updated successfully. You can paste your custom code in the new theme.
  6. After all, check your site again to ensure that the update works.

 

Warning Before updating any plugin in your site, you need to have a test first to make sure that it won’t damage your site! When a plugin is updated, we will check if it’s compatible with our current theme version. After that, we will update theme package then you can update in your site later. If you see there is bug after the update in the test process, you should wait for our update for latest version of plugin to update in you live site.

IMPORT KidZone DEMO DATA

Importing demo data (post, pages, images, theme settings and more) is the easiest way to setup your theme. It will allow you to quickly edit everything instead of creating content from scratch.

 

Info Before install the theme, please make sure that your site meets all the system requirements.

 

KidZone supports 03 options to import demo data:

 

  1. Import All Content: Import the homepage you choose, detail pages, posts, menu, widgets, post and other elements.
  2. Import All Pages Only: Import homepage you choose and all the detail pages as in the demo.
  3. Import All Pages and Menu: Import homepage you choose, all the detail pages and menus as in the demo.

 

To import all demo content of KidZone demo you want, please follow steps as below:

 

Step 1 – Choose demo to import:

 

  1. In the Dashboard, go to Appearance > Import Demo Data to open the One Click Demo Import window.
  2. Choose option Import All Content of the demo homepage you want, click on Import (01 time only). Confirm Yes, Import! to continue.
  3. It can take a few minutes to import everything. Please be patient and wait for it to complete. Once it loads, you will see a That’s it, all done! message.

 

Step 2 – Final setups:

 

Now, there are some things you need to change. To do them, please see the steps below:

 

  1. Megamenu: Hover on Edit with Elementor > Choose Menu > Edit element.
  2. Header Style: Hover on Edit with Elementor > Choose Header > Edit element.
  3. Footer: Hover on Edit with Elementor > Choose Footer > Edit element. You can also drag-n-drop other element into the page with Elementor.

 

 

Warning The data will be downloaded from our server, these images are copyrighted and are for demo use only.

To import all pages of KidZone demo you want, please follow steps as below:

 

Step 1 – Choose demo to import:

 

  1. In the Dashboard, go to Appearance > Import Demo Data to open the One Click Demo Import window.
  2. Choose option Import All Pages Only of the demo homepage you want, click on Import (01 time only). Confirm Yes, Import! to continue.
  3. It can take a few minutes to import everything. Please be patient and wait for it to complete. Once it loads, you will see a That’s it, all done! message.

 

Step 2 – Final setups:

 

Now, there are some things you need to change. To do them, please see the steps below:

 

  1. Megamenu: Hover on Edit with Elementor > Choose Menu > Edit element.
  2. Header Style: Hover on Edit with Elementor > Choose Header > Edit element.
  3. Footer: Hover on Edit with Elementor > Choose Footer > Edit element. You can also drag-n-drop other element into the page with Elementor.

To import all pages and menu of KidZone demo you want, please follow steps as below:

 

Step 1 – Choose demo to import:

 

  1. In the Dashboard, go to Appearance > Import Demo Data to open the One Click Demo Import window.
  2. Choose option Import All Pages and Menu of the demo homepage you want, click on Import (01 time only). Confirm Yes, Import! to continue.
  3. It can take a few minutes to import everything. Please be patient and wait for it to complete. Once it loads, you will see a That’s it, all done! message.

 

Step 2 – Final setups:

 

Now, there are some things you need to change. To do them, please see the steps below:

 

  1. Megamenu: Hover on Edit with Elementor > Choose Menu > Edit element.
  2. Header Style: Hover on Edit with Elementor > Choose Header > Edit element.
  3. Footer: Hover on Edit with Elementor > Choose Footer > Edit element. You can also drag-n-drop other element into the page with Elementor.


KidZone HOMEPAGE DEMOS

How to edit Homepage with Elementor:

 

To edit homepage, on the admin bar of the page, click on Edit with Elementor then you can edit the page elements with Elementor.

 

Create KidZone Homepage:

 

Please choose Demo Homepage when importing demo data.

 

Homepage Settings:

 

  • Home Template : Home.
  • Header Style: Header.
  • Footer Style: Footer.

 

Homepage Elements:

 

Please see the image for more detail about the theme elements and styles of this homepage.

Create KidZone Homepage 2:

 

Please choose Demo Homepage 2 when importing demo data.

 

Homepage 2 Settings:

 

  • Home Template : Home Page 2.
  • Header Style: Header 2.
  • Footer Style: Footer 2.

 

Homepage Elements:

 

Please see the image for more detail about the theme elements and styles of this homepage.


KidZone HEADER & FOOTER

BASIC SETTINGS

Pages is one of the most important elements in a WordPress website. In this section, we will cover issues related to page including: Create a New Page, Set up Home Page and Page with Elementor.

 

How to create a new page?

 

To create a new page with Elementor, please follow steps here: Create a New Page

 

How to set up Home Page?

 

To set up home page or static front page for your website, please follow steps here: Creating a Static Front Page

 

Blog Post is one of the most important elements to create a Blog Page in a WordPress website. In this section, we will cover issues related to page including: Create a New Blog Post, Set up Blog page and Blog Post in KidZone theme.

 

How to create a new post?

 

To create a new Post please follow steps as below:

 

  1. In the Dashboard, go to Posts > Add New option to begin writing a new post.
  2. Configure Options for new post including post Title, post link, Public Status, Content, Tags, Feature Image, Post Type.
  3. Scrolling down to the end of the window, you will see the Page Metabox area of KidZone theme. Here you can configure the options including Header, Footer and Sidebar for this post. Please note that if there is no change here, the settings in the page including this post will be applied.
  4. After all, save the change and check the result in the front end of your site.

 

For more detail, you can see the WordPress Documentation here: WordPress Posts.

 

How to set up Blog page in KidZone Theme?

 

To set up blog page for your website, please follow steps as below:

 

  1. In the Dashboard, create a new page > Choose Edit with Elementor > Choose Add Template.
  2. In tab My Template, find post type you want then > Click Insert.
  3. Now, configure the options as you want then choose Public and check your site again.

 

Other Settings

 

1. Categories: To add new category, please go to Post > Categories then complete information for the new category in Add New Category window and Save it.

2. Tags: To add new tag, please go to Post > Tags then complete information for the new tag in Add New Tag window and Save it.

 

Post Image Size

 

In KidZone theme, we recommend to configure image dimensions for post image size. You can go to Settings > Media and set up the Image Dimentions to use when adding an image to the Media Library.

Portfolio Post is one of the most important elements to create a Portfolio Page in a WordPress website. In this section, we will cover issues related to page including: Create a New Portfolio Post, Set up Portfolio page and Portfolio Post in KidZone theme.

 

How to create a new portfolio?

 

To create a new portfolio please follow steps as below:

 

  1. In the Dashboard, choose the Portfolio > Add New option to begin writing a new portfolio.
  2. Configure Options for new portfolio including portfolio Title, Portfolio Link, Public Status, Content, Tags, Feature Image, Post Type.
  3. Scrolling down to the end of the window, you will see the Portfolio Meta area of KidZone theme. Here you can configure the options including Skill Needed, URL, Copyright and Image Size Mansonry Layout for this portfolio.
  4. After all, save the change and check the result in the front end of your site.

 

How to set up Portfolio page in KidZone Theme?

 

To set up portfolio page for your website, please follow steps as below:

 

  1. In the Dashboard, create a new page > Choose Edit with Elementor > Choose Add Template.
  2. In tab My Template, find portfolio type you want then > Click Insert.
  3. Now, configure the options as you want then choose Public and check your site again.

 

Other Settings

 

1. Portfolio Categories: To add new category, please go to Portfolio > Categories Portfolio then complete information for the new category in Add New Category window and Save it.

2. Tags: To add new tag, please go to Portfolio > Tags then complete information for the new tag in Add New Tag window and Save it.

Product is one of the most important elements to create a Shop Page in a WordPress website. In this section, we will cover issues related to this one including: Create a New Product, Set up Product Page and other related things in KidZone theme.

Please make sure that you install and activate WooCommerce plugin before this process.

 

WooCommerce Knowledge Base

 

Firstly, please make sure that you have background knowledge of WooCommerce. You can find the link here that have additional information about using WooCommerce: WooCommerce Documentation

 

How to create a new product?

 

To create a new product, please follow steps as below:

 

  1. In the Dashboard, choose Products > Add Product option to begin writing a new product.
  2. Configure Options for new product including product Title, Product Link, Public Status, Content, Tags, Feature Image, Feature Video, Categories, Brand and others.
  3. Scrolling down to the end of the window, you will see the Page Metabox for Product of KidZone theme. Here you can configure the options including Header, Footer and Sidebar for this product.
  4. After all, save the change and check the result in the front end of your site.

 

For more detail about this process, you can check the WooCommerce Documentation: Set Up Products.

 

How to set up Product page in KidZone Theme?

 

To set up product page for your website, please follow steps as below:

 

  1. In the Dashboard, create a new page > Choose Edit with Elementor > Choose Add Template.
  2. In tab My Template, find post type you want then > Click Insert.
  3. Now, configure the options as you want then choose Public and check your site again.

 

Product Image Size

 

In KidZone theme, to have the most beautiful shop page, we recommend to configure image dimensions for product image size as below:

  1. Homepage 1, 2, 3– 600 x 600 pixels

 

Featured Video Product

 

In KidZone theme, you can use Featured Video for Product in stead of Image. To use this feature, while creating new product, you can enter the Youtube Video ID in the Featured Product Video option.

Currently, this feature only supports Youtube Video, we will update to support Vimeo video in the next version.

 

Color & Image Swatches

 

KidZone supports product with color and image swatches, you can see the userguide here

 

Bundle Product

 

KidZone supports bundle product, you can see the userguide here

 

Brand Image

 

KidZone supports to add Brand Image into single product page, you can see the userguide here

KidZone theme supports YITH Plugins with feature Wishlist and Compare. After installing the theme, you need to do some configurations as below:

 

  1. Configure General Settings for Compare in YITH Plugins > Compare. See screenshot: Compare
  2. Configure General Settings for Wishlist in YITH Plugins > Wishlist. See screenshot: Wishlist

 

After installing the theme, the Compare and Wishlist button may be duplicated. To remove this bug, you need to do some configurations here.

 

  1. In YITH Plugins > Compare, uncheck the option Show button in single product page. See screenshot: Compare
  2. In YITH Plugins > Wishlist, choose Use shortcode for option Position. See screenshot: Wishlist

THEME OPTIONS

Our stunning KidZone theme provides an advanced Theme Options panel that is loaded with many options to customize your page effectively. After installing KidZone successfully, the Theme Options will be available in your site.

 

KidZone Theme Options:

 

To access KidZone Theme Options, please go to Appearance > Theme Options. There you can see logical tabs including:

 

General Options for general configuration such as Logo Image, Favicon, and Title Length Of Item Listing Page.
Color Schemes Options for color schemes for your site.
Layout Options for layouts including box layout, sidebar on different device.
Mobile Layout Options for layout of your site on mobile devices.
Header & Footer Options for header and footer style for your site.
Breadcrumb Options for breadcrumb configuration.
Blog Options Options for your blog pages.
Product Options Options for your product pages.
Typography Options for typography for your site.
Social Options for the link for social share in your site.
Maintaincece Mode Options for the maintainece mode for your website.
Advanced Plugins Options to turn on/ off advanced plugins.
Advanced Advanced options including layout RTL, adding shortcode or custom CSS/JS.
Import/Export Options to import or export theme option settings.

 

Important notes about Theme Options:

 

  • The configuration here will be applied to the pages in your site if there is no change in the Page Metabox. As demo data, we have configured Logo, Color, Header and Footer Style for each Home page. You can go to the page and configure these settings in the Page Metabox. If you don’t want to have the Home Page different from other page, you can choose No Select for the option here, the settings in the Theme Options wil be applied.
  • Cpanel option: This is only used for the Demo development. Due to the risk of loosing your customization in CSS file, the option Demo Mode is not recommended.
  • Reset to Defaults option: Please DO NOT use it if you do not want to loose your configuration. When the theme is reset to default, all the value here will be back to the default without saving any your configuration.

 

Info For more detail, you can see How to Use Theme Options, Page Metabox and Category Metabox for more detail.

The theme allows to build your own styles right out of the backend without any coding knowledge.

 

 

  1. Logo Image: Use the Upload button to upload the new logo and get URL of the logo.
  2. Favicon: Use the Upload button to upload the new favicon and get URL of the favicon.
  3. Title Length Of Item Listing Page: Choose title length if you want to trim word, leave 0 to not trim word.

The theme allows to custom color scheme for theme with unlimited colors.

 

 

  1. Color Scheme: Select one of predefined schemes to set the color for your site.
  2. If you want to choose other color, please choose Color then configure in option Color..

KidZone gives you multiple selections to configure the layout of you website including layout type and sidebar expand on different devices.

 

 

  1. Box Layout: Select Layout Default, Boxed your site. For layout Default/Boxed, the content pages will have width at 1290px.
  2. Layout Width: You can set width for content layout.
  3. Background Box Image: Upload Image to set as background image for your box layout.
  4. Background Color: Set custom background color for your box layout.

KidZone supports you with a mobile setting home page layout.

 

 

  1. Enable Mobile Layout: Choose this one to activate the mobile layout in your site with the options listing below. If this one is not enabled, the responsive mode will be applied automatically & the options listing below will have no effect in your site.
  2. Logo Mobile Image: Upload Image to set as logo for your mobile layout.
  3. Sticky Mobile: Choose this one to activate the sticky mobile.
  4. Mobile Layout Content: Select content index for this mobile layout.
  5. Header Mobile Style: Select header mobile style.
  6. Footer Mobile Style: Select footer mobile style.

 

Info You can see Mobile Layout for more detail about this problem.

The theme allows to configure the Header and Footer of your site.

 

 

  1. Disable Search: Choose this one to disable Search on the header.
  2. Disable Cart: Choose this one to disable Cart on the header.

In this tab, you can configure the layout for your blog listing page.

 

 

  1. Sidebar Blog Layout:Select style sidebar blog. You can choose Full layout, Left Sidebar or Right Sidebar.
  2. Layout blog: Select style layout blog including List Layout or Grid Layout.
  3. Blog column: Select style number column for blog page. You can choose to set it as 2 columns, 2 columns or 4 columns.

In this tab, you can configure the layout for your product listing page.

 

 

Product Categories Configurations

In this section, you can configure product categories on shop page.

  1. Number Of Column: Select number of column on different device such as desktop, medium destop and tablet for product categories.
  2. Disable Categories Image: hide or show category image on shop page.
  3. Disable Counter Number Products:hide or show counter number product of each category on shop page.

Product Listing Configurations

In this section, you can configure product layout on shop page.

  1. Product Items Layout: Layout to show of each product on shop page and on other pages.
  2. Product Listing Style: Style of button view mode and sidebar will be changed when you select this option.
  3. Sidebar Product Layout:Select style sidebar product. You can choose Full layout, Left Sidebar, Right Sidebar or Full Sidebar Expand.
  4. Sidebar Width (px):You can change width of sidebar left or right for the screen larger than 1200px.
  5. Select Layout List/Grid For Product Listing:You can default layout of shop page as grid or list.
  6. Product Listing Column: Select number of column on different device such as desktop, medium destop and tablet.
  7. Select Banner: Select the Banner of your product page as Category Product Image or Banner. If you choose to Use Banner, your custom image will be applied the same for all product pages. If you choose to Use Category Product Image, the category images of the product will be applied as banner in your site.
  8. Listing Banner Product: If you choose Banner as Use Banner, you can upload image here.
  9. Enable load more: Show load more instead for pagination.
  10. Loadmore Type: You can choose type of load more such as click or scroll.
  11. Quickview: You can choose this one to activate the product quickview mode.
  12. Enable Countdown: turn on or off product countdown on each product on shop page.
  13. Product Sold Out: turn on or off product soldout label on shop page.
  14. Product Listing Number: Show number of product in listing product page.
  15. New Product: Set day for the new product label from the date publish product.

Product Single Configurations

In this section, you can configure single product layout.

  1. Product Single Layout: Select style sidebar product. You can choose Full layout, Left Sidebar, Right Sidebar.
  2. Product Single Style: Style of single product.
  3. Product’s Thumbnail Position:position of product thumbnail in gallery slider.
  4. Product Zoom: You can choose this one to activate the product image zoom when hover on single product.
  5. Enable Product Brand Image: Show brand image on single product, default show brand name of product.
  6. Enable Countdown Single: Turn on or off product countdown on single product.
  7. Enable Buy Now Button: Turn on or off button buynow beside add to cart button.

The theme allows to change the font style in your site with Google Font.

 

 

  1. Use Google Webfont: Insert font style that you actually need on your webpage.
  2. Webfont Weight: For weight, see Google Fonts to custom for each font style. You can choose from 100 to 900.
  3. Header Tag Font: Select custom font for Header tag (H1 to H6).
  4. Main Menu Font: Select custom font for your Main Menu.

In this tab, KidZone Theme Options allows you to add various social link for your website including: Facebook, Twitter, Tumblr, Linkedin, Instagram, Google+, and Pinterest.

 

If your site has not been ready to be launch, the Maintaincece Mode will be truly useful for you.

 

 

  1. Enable Maintaincece Mode: Choose this one to turn on the Maintaincece Mode for your website. After that, all the options listing below will be applied.
  2. Maintaince Background: This allows you to upload the background image for Maintaincece Mode.
  3. Maintaince Content: This allows you to custom the Maintaince Content.
  4. Maintaince Date: This allows you to set date to show countdown date on maintaince mode.
  5. Maintaince Form: This allows you to insert shortcode form to show on maintaince mode frontend.

This tab provide some options for advanced plugins in your site including testimonial and portfolio. If you don’t use theme, please turn off for better performance.

 

 

  1. Turn Off Testimonial: This option allows you to turn off the option for testimonial in your site.
  2. Turn Off Portfolio: This option allows you to turn off the option for portfolio in your site.

This tab provide some advanced options for your site.

 

 

  1. Social Share: You can enable this one to turn on the social share on your website esspecially on Blog page.
  2. Turn Off Breadcrumb: This option allows you to turn off the Breadcrumb on all pages in your site.
  3. Back to top: Choose this one if you want to enable the button Back to top in your site.
  4. Direction: Set your site layout as Left to Right or Right to Left.

Before configuring, you can also backup your theme options by clicking on the Import/Export tab. This is a great way to move your custom options from site to site.

 

 

  1. Import Options: You can import options from file or URL. WARNING! This will overwrite any existing options, please proceed with caution!.
  2. Export Options: Here you can copy/download your themes current option settings. Keep this safe as you can use it as a backup should anything go wrong. Or you can use it to restore your settings on this site (or any other site). You also have the handy option to copy the link to yours sites settings. Which you can then use to duplicate on another sit.

KidZone ELEMENTOR ELEMENTS

KidZone comes with various theme elements that let you to customize page in your site easily with Elementor. In this part, we will show you how to use KidZone theme elements.

 

Knowledge Base

 

Firstly, please make sure that you have background knowledge of Elementor. You can find the link here that have additional information about using Elementor: Elementor Documentation

 

Activate Elementor Pro

 

To activate Elementor Pro, you can contact us via our Ticket Support System to get help. Please note that for 01 license, we only activate 01 time.

This element helps you to display latest product as slider in the page. After installing the theme and required plugins, this SWE Woo Countdown Slider Product element will be available in your site.

 

SW Latest Product

 

How to add SWE Woo Countdown Slider element into your page?

To add this element to your page, please follow steps as below:

 

  1. Open your page and choose Edit with Elementor.
  2. Click on Add element icon of Elementor, then choose SWE Woo Countdown Slider.
  3. Hover on this element and click on Pencil icon to edit it.
  4. After that, configure element options then Save change for this element.
  5. Preview the page and Update to save the change for this page.

 

SWE Woo Countdown Slider Settings

With this element, there are various options for you to configure as your expectation.

See screenshot: Backend Settings

  1. Title: Enter text used as widget title located above content element.
  2. Product Title Length: Set product title length as you want.
  3. Template: Choose style for this element.
  4. Category: Choose Category you want to display.
  5. Style: Choose style for this element.
  6. Number of products to slide: Set number of products to slide.
  7. Number of posts to show: Set number of products to show.
  8. Extra class name: If you wish to style particular content element differently, then use this field to add a class name and then refer to it in your css file.

 

Product Settings for this elements:

To have the style and information as in the demo, you need to do some configuration for products.

  1. Product Settings: You should pay attention to options including Product Title, Product Image, Product Location and Price. See screenshot: Backend Settings

 

Info For more detail, you can see the Product Settings in Product part in Basic Settings for more detail.

This element helps you to display product of categories which you selected as slider in the page. Each category will show as a tab, and product of that category will be shown on tab content.

 

SWE Woo Category Tab Slider

 

How to add SWE Woo Category Tab Slider element into your page?

To add this element to your page, please follow steps as below:

 

  1. Open your page and choose Edit with Elementor.
  2. Click on Add element icon of Elementor, then choose SWE Woo Category Tab Slider.
  3. Hover on this element and click on Pencil icon to edit it.
  4. After that, configure element options then Save change for this element.
  5. Preview the page and Update to save the change for this page.

 

SWE Woo Category Tab Slider Settings

With this element, there are various options for you to configure as your expectation.

See screenshot: Backend Settings

  1. Title: Enter text used as widget title located above content element.
  2. Product Title Length: Set product title length as you want.
  3. Template: Choose style for this element.
  4. Category: Choose Categories you want to display.
  5. Style: Choose style for this element.
  6. Number of products to slide: Set number of products to slide.
  7. Number of posts to show: Set number of products to show.

 

Product Settings for this elements:

To have the style and information as in the demo, you need to do some configuration for products.

  1. Product Settings: You should pay attention to options including Product Title, Product Image, Product Location and Price. See screenshot: Backend Settings

 

Info For more detail, you can see the Product Settings in Product part in Basic Settings for more detail.

This element helps you to display latest product as slider in the page. After installing the theme and required plugins, this SWE Woo Categories Slider element will be available in your site.

 

SWE Woo Products Slider

 

How to add SWE Woo Categories Slider Slider element into your page?

To add this element to your page, please follow steps as below:

 

  1. Open your page and choose Edit with Elementor.
  2. Click on Add element icon of Elementor, then choose SWE Woo Categories Slider.
  3. Hover on this element and click on Pencil icon to edit it.
  4. After that, configure element options then Save change for this element.
  5. Preview the page and Update to save the change for this page.

 

SWE Woo Categories Slider Settings

With this element, there are various options for you to configure as your expectation.

See screenshot: Backend Settings

  1. Title: Enter text used as widget title located above content element.
  2. Product Title Length: Set product title length as you want.
  3. Template: Choose style for this element.
  4. Category: Choose Category you want to display.
  5. Style: Choose style for this element.
  6. Number of products to slide: Set number of products to slide.
  7. Number of posts to show: Set number of products to show.
  8. Extra class name: If you wish to style particular content element differently, then use this field to add a class name and then refer to it in your css file.

 

Product Settings for this elements:

To have the style and information as in the demo, you need to do some configuration for products.

  1. Product Settings: You should pay attention to options including Product Title, Product Image, Product Location and Price. See screenshot: Backend Settings

 

Info For more detail, you can see the Product Settings in Product part in Basic Settings for more detail.

This element helps you to display latest product as slider in the page. After installing the theme and required plugins, this SW LookBook element will be available in your site.

 

SW LookBook

 

How to add SW LookBook Slider element into your page?

To add this element to your page, please follow steps as below:

 

  1. Open your page and choose Edit with Elementor.
  2. Click on Add element icon of Elementor, then choose SW LookBook.
  3. Hover on this element and click on Pencil icon to edit it.
  4. After that, configure element options then Save change for this element.
  5. Preview the page and Update to save the change for this page.

 

SW LookBook Settings

With this element, there are various options for you to configure as your expectation.

See screenshot: Backend Settings

  1. Title: Enter text used as widget title located above content element.
  2. Product Title Length: Set product title length as you want.
  3. Template: Choose style for this element.
  4. Category: Choose Category you want to display.
  5. Style: Choose style for this element.
  6. Number of products to slide: Set number of products to slide.
  7. Number of posts to show: Set number of products to show.
  8. Extra class name: If you wish to style particular content element differently, then use this field to add a class name and then refer to it in your css file.

 

Product Settings for this elements:

To have the style and information as in the demo, you need to do some configuration for products.

  1. Product Settings: You should pay attention to options including Product Title, Product Image, Product Location and Price. See screenshot: Backend Settings

 

Info For more detail, you can see the Product Settings in Product part in Basic Settings for more detail.

This element helps you to display product brands as slider in the page. After installing the theme and required plugins, this SW Brand element will be available in your site.

 

SW Brand

 

How to add SW Brand element into your page?

To add this element to your page and configure, you can see SWE Woo Categories Slider

This element helps you to show slider and beautify your website. After installing the theme and required plugins, this Revolution Slider element will be available in your site.

 

revolution slider

 

How to add Revolution Slider element into your page?

To add this element to your page, please follow steps as below:

 

  1. Open your page and choose Edit with Elementor.
  2. Click on Add element icon of Elementor, then choose Revolution Slider.
  3. Hover on this element and click on Pencil icon to edit it.
  4. After that, choose slider you want and do other configurations and Save change for this element.
  5. Preview the page and Update to save the change for this page.

 

Revolution Slider Settings

With this element, there are various options for you to configure as your expectation. See screenshot: Backend Settings

 

  1. Title: Enter text used as widget title located above content element.
  2. Revolution Slider: Choose slider created in Slider Revolution.

 

How to Edit Revolution Slider?

To edit Revolution Slider, please follow steps as below:

 

revolution slider

 

  1. In the admin page, go to Slider Revolution.
  2. Click on Edit icon of the slide you want to edit to go to Edit page.
  3. In the slider Edit page, you can edit as your expectation.
  4. After all, save the change and check in your site.

 

InfoYou can see Slider Revolution WordPress 5.x Documentation and Tutorial Videos for more detail.

This element helps you to display categories as a collection width various layout.

 

Collection Style 1

Collections Style 1

Collection Style 2

Collections Style 2

Collection Style 3

Collections Style 3

Collection Style 4

Collections Style 4

Collection Style 5

Collections Style 5

Collection Style 6

Collections Style 6

 

How to add SWE Collections element into your page?

To add this element to your page, please follow steps as below:

 

  1. Open your page and choose Edit with Elementor.
  2. Click on Add element icon of Elementor, then choose SWE Collections.
  3. Hover on this element and click on Pencil icon to edit it.
  4. After that, configure element options then Save change for this element.
  5. Preview the page and Update to save the change for this page.

 

SWE Collections Settings

With this element, there are various options for you to configure as your expectation.

See screenshot: Backend Settings and Backend Settings

This element helps you to display title of curent page, post, category, archive on your site.

 

Breadcrumb

 

How to add SWE Title element into your page?

To add this element to your page, please follow steps as below:

 

  1. Open your page and choose Edit with Elementor.
  2. Click on Add element icon of Elementor, then choose SWE Title.
  3. Hover on this element and click on Pencil icon to edit it.
  4. After that, configure element options then Save change for this element.
  5. Preview the page and Update to save the change for this page.

 

SWE Title Settings

With this element, there are various options for you to configure as your expectation.

See screenshot: Backend Settings and Backend Settings



MULTI VENDOR PLUGINS

KidZone theme is compatible with Dokan Multivendor MarketPlace plugin. After installing Dokan in your site, you need pay attention to some points as below:

  1. Go to Dokan > Settings to configure General Settings, Selling Options, Withdraw Options, Page Settings and Appearance. See screenshot: Dokan Settings
  2. Go to User Profiles to add some Dokan Options like Store Name, Address, Banner Image and others. See screenshot: Checkout process

 

Info You need to purchase Pro version for this plugin. You can check Documentation and FAQs for more detail about it.

KidZone theme is compatible with WC Vendors plugin. After installing WC Vendors in your site, you need pay attention to some points as below:

  1. Go to WooCommerce > WC Vendors to configure General Settings, Products, Capabilities, Pages and Payments. See screenshot: Dokan Settings
  2. Go to User Profiles to add some WC Vendors Options like Shop Name, Address, Description and others. See screenshot: Checkout process

 

Info You need to purchase Pro version for this plugin. You can check Documentation for more detail about it.

KidZone theme is compatible with WC Vendors plugin. After installing WC Vendors in your site, you need pay attention to some points as below:

  1. Go to WooCommerce > WC Vendors to configure General Settings, Products, Capabilities, Pages and Payments. See screenshot: Dokan Settings
  2. Go to User Profiles to add some WC Vendors Options like Shop Name, Address, Description and others. See screenshot: Checkout process

 

Info You need to purchase Pro version for this plugin. You can check Documentation for more detail about it.

KidZone theme is compatible with WC Vendors plugin. After installing WC Vendors in your site, you need pay attention to some points as below:

  1. Go to WooCommerce > WC Vendors to configure General Settings, Products, Capabilities, Pages and Payments. See screenshot: Dokan Settings
  2. Go to User Profiles to add some WC Vendors Options like Shop Name, Address, Description and others. See screenshot: Checkout process

 

Info You need to purchase Pro version for this plugin. You can check Documentation for more detail about it.

TRANSLATION & MULTI-LANGUAGES

KidZone supports multi language. We recommend you to use WPML plugins following the WPML Documentation in KidZone theme.

To translate KidZone into your language, you can install Loco Translate plugin into your site. After that, you can use Loco to translate KidZone theme, plugins and elements.

You can follow Beginner’s guide for Loco Translate in KidZone Theme

FREQUENTLY ASKED QUESTIONS

To edit the page title in our themes, you can follow steps as below:

 

Step 1: Login into the Dashboard of your site.

Step 2: Go to Pages > All Pages and open the page that you want to edit the title. It’s ussually the Home Page.

Step 3: Scroll down to the Yoast SEO area and click on Edit Snippet.

Step 4: Now, you can edit the Page Title as you want. In addition, you can edit the keywords for it there too.

After all, you can clear all cache of your site, browser and server to check the result.

 

Info For more detail, you can see the WordPress Documentation for this problem: How to Edit the Page Title in Your Site? .

logo
To change favicon for your website, please follow steps as below: 

  1. Log in to your site in the backend.
  2. In the homepage, on the admin bar, please hover on Edit with Elementor > Choose header page to edit with Elementor.
  3. Now, you can hover on the Logo, click on Edit button and replace the logo for your site.
  4. Now Save Changes and check your site again.

To change favicon for your website, please follow steps as below:

 

  1. Log in to your site in the backend.
  2. Navigate to Appearance > Theme Options.
  3. In tab General, you can Upload Favicon Image for your site.
  4. Now Save Changes and check your site again.

To change Color Schemes for your website, please follow steps as below:

 

  1. Navigate to Appearance > Theme Options.
  2. In tab Schemes, you can choose Color Scheme for your site. If you want to choose other color, please choose Enable Custom Color > Developer Mode > Install plugin WordPress Less then configure in option Color. After using this feature, please turn off the plugin and the Developer Mode to not prevent your site performance.
  3. Please check the Page Metabox of home page and choose No select for color scheme there then the config in the Theme Options will be applied.

popup
KidZone use the Popup features of Elementor. To set up the Popup for your website, please follow steps as below: 

  1. Log in to your site in the backend.
  2. Navigate to Template > Popups.
  3. Naviagate to the Popup and choose Edit with Elementor.
  4. You can refer to the guide of Elementor Popupshere.

To enable the Maintaince Mode for your website, please follow steps as below:

 

  1. Log in to your site in the backend.
  2. Navigate to Appearance > Theme Options > Maintaince Mode.
  3. Now, choose Enable Maintaincece Mode, and configure other options listing below.
  4. Now Save Changes and check your site again.

Yes. KidZone supports RTL layout. To have RTL layout, you can go to Appearance > Theme Options > Advanced and change the Direction into Right to Left.

There are many things can slow down your website or speed it up. As a side note, these are not ordered by importance or any criteria, We’ve just gathered everything we’ve learned around how to speed up WordPress page loads and listed them all here.

This is what we done on our demo site to improve the loading time. You could try to follow it to improve your website’s speed.

    1. Choose a good host.

When starting out, a shared host might seem like a bargain if you don’t have too many visitor. But if you have more than 1000 visitors per day, you should use a VPS, or at least a higher plan of a sharing hosting.

  1. Use an effective caching plugin.WordPress plugins are obviously quite useful, but some of the best fall under the caching category, as they drastically improve page loads time, and best of all, all of them on WordPress.org are free and easy to use.We are using WP Rocket for our demo site.
  2. Combining CSS, JS and HTML.Using Autoptimize for combining CSS, JS and HTML. Even the cache plugin supports combining those files, but sometime it break JS scripts.
  3. Use a content delivery network (CDN).Essentially, a CDN, or content delivery network, takes all your static files you’ve got on your site (CSS, Javascript and images etc) and lets visitors download them as fast as possible by serving the files on servers as close to them as possible.
  4. Optimize images (automatically)Yahoo! has an image optimizer called Smush.it that will drastically reduce the file size of an image, while not reducing quality. However, if you are like me, doing this to every image would be beyond a pain, and incredibly time consuming. Fortunately, there is an amazing, free plugin called WP-SmushIt which will do this process to all of your images automatically, as you are uploading them. No reason not to install this one.
  5. Add Expires headers to your files.If you test your website speed on some tools, like GTmetrix, you will get a notice about adding expires headers. You can follow this tutorial to add it to your website.

Actually, this is not because of the theme but due to the host settings. For this one, you should contact your host to check the Redirect Issues.

Sometimes, there is warning in your site such as:

 

Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 72 bytes) in /home/xxx/public_html/wp-content/plugins/lessphp/3rdparty/lessc.inc.php on line 311

 

This one is caused by the file wp-config.php. To fix theme, please add the line below to this file:

 

define(‘WP_MEMORY_LIMIT’,’256M’);

Sometimes, there is warning in your site such as:

 

Warning: Invalid argument supplied for foreach() in /home/xxx/public_html/wp-content/themes/revo/lib/utils.php on line 139

 

This one is caused by the file wp-config.php. To fix theme, please add the line below to this file:

 

define(‘FS_METHOD’,’direct’);

To Understanding and Fixing 502 Bad Gateway Errors, you can see this article for more detail:

Understanding and Fixing 502 Bad Gateway Errors.

To Understanding and Fixing 500 Internal Server Error, you can see this article for more detail:

How to Fix a 500 Internal Server Error.

GET SUPPORT FOR KidZone THEME

To help speed along your request, we require that you follow the steps below before submitting a new support ticket. This is for the benefit of everyone and will help make the entire process more efficient. It’s very important and we ask that everyone who posts follow these steps.

 

Read the item documentation first:

 

Many support queries and technical questions will already be answered in supporting documentation such as FAQ’s and comments from previous buyers. You can find more tutorials via the Frequently Asked Questions, WPThemeGo Forum and WPThemeGo Youtube Channel

 

We support KidZone following Envato Support Policy:

 

We will check and reply the ticket in 01 business day (except for weekends and holiday). Please check the Support Policy to see what’s included and what’s not included in item support.

 

Please note that for each item purchase code, only 01 website should be supported. If your support license expired, please renew it to get technical support.

 

Important things for your website:

 

  1. Runs the latest version of KidZone and meets all Theme Requirements.
  2. Disable any additional 3rd party plugins you may be using to see if it fixes the issue.
  3. Clear and disable all caches including browser cache, plugin cache and server cache.

To create a support ticket for KidZone, please choose the Department as WPThemeGo then enter the theme purchase code to submit the ticket. Please note that your site’s information and some screenshots for the issue will be easier for us to get the question and help you faster.

 

 

Important!

  • Do NOT reply the ticket via notification email. Any reply via this no-reply-email may be missed because our support team could not read it.
  • If you get trouble with the ticket system, please contact us via email contact@wpthemego.com to get help. However, the first one is more convenience and easier for both of us to follow the issue.

×