Installing Kirei Theme

Kirei is a child theme of the Backbone Theme Framework. You must install the parent theme first before installing the theme. Please visit: Backbone Theme Documentation for the instruction of installing Backbone Theme Framework.

Backbone Installation

Before you can fully use the powerful features of Vidio theme you need to install Backbone as it parent theme:

1. Download and install Backbone theme from your member area. After you finish downloading open your WordPress dashboard → Appearance → Themes → Install and upload your backbone.zip or
2. After downloading backbone.zip extract that file into your computer drive then open your FTP using 3rd party software like FileZilla then go to Public HTML → WP-content → themes. Upload your Backbone folder there

Start of page

There are two ways to install Kirei theme on your WordPress:

1. Installing via WordPress Dashboard

1. Navigate to your WordPress Admin Menu and open Appearance → Themes section
2. Switch to Install Themes tab
3. Select Upload
4. Browse for .zip file on your computer and install it
5. Activate theme

2. Installing via FTP

1. Open your FTP Client Application (example: FileZilla)
2. Fill the login details (host, username and password) then press Quickconnect
3. Go to ‘wp-content’ folder
4. Go to ‘themes’ folder
5. Extract the Kirei.zip file into your local drive and search the current location and upload the Kirei folder

Got an error during installation process? Try the following:

• If you are upgrading the Kirei theme via WordPress Admin menu, open your ‘Kirei.zip’, rename the ‘Kirei’ folder before uploading. Eg: Kirei2. Then press Enter
• Make sure you are using the latest version of WordPress
• Make sure your hosting is running the latest version of PHP and MySQL
  Try to upload manually via FTP (FileZilla)

Start of page

Kirei Overview

Kirei is a child theme of the Backbone Theme Framework for your WordPress business website. Designed specifically to meet to many kinds of business projects, but it’s deeply suitable for creative, portfolio and showcase website.

Kirei frontpage

Theme Panel

Kirei uses a new version of our theme panel. This new panel will provides you more impressive experience to explore our themes.

There are 4 sub menus inside of it. They are:

• Dashboard

Dashboard panel contains a lot of settings to customize Kirei theme. Within this panel you can configure the theme, customize its layout and optimize your website’s SEO. Just drag and drop the option from the left column into the right column to show all sub-options inside of it.

• Update Framework

You will be informed the version of the theme panel framework you are currently use. Also you can update your framework to the latest version within this panel.

• Theme Info

This contains general information about Kirei theme such as product version, framework vesion, license type and links to product support

• Import Export Settings

This provides a feature for you to import or export your theme settings into a text file.

Page Template

Kirei provides 6 page templates available. They are:

Portfolio 1 Page Template

Portfolio 2 Page Template

Portfolio 3 Page Template

Blog Page Template

Contact Template

Sitemap Template

Start of page

Theme Options

There are many options available to customize the theme, social networking, thumbnail images and contact settings. They are:

General Settings

Go to Kirei → Dashboard → Theme Options → General Settings. This provides general settings for your website. They are:

1. Website header logo: There are 2 options available, they are ‘Logo’ and ‘Title’. Choose which option you prefer to set where your website header gets the source. The option ‘Title’ means that your website title will be used as the website header logo
2. Configuring favicon: Set your website’s favicon. Upload a 16x16px .ico image. Click here to generate your favicon
3. Configuring logo image: If you prefer to use logo for your website header, set your website’s logo by uploading an image or by attaching a URL (external image)
4. Configuring Comments: Choose which section on your site you would like to enable comment system
5. Configuring Pagination: Choose which style of pagination you would like to use on your site

Social Networking

Go to Kirei → Dashboard → Theme Options → Social Networking. Specify your social networking accounts that you are going to integrate to your website. There are Facebook, Twitter, Flickr, LinkedIn and Google+ account available. Also you can enable/disable Social Share Button you would like to display on the single post and pages. There are Facebook Like Button, Twitter Share Button and Google +1 Button available

Frontpage Settings

1. Go to Kirei → Dashboard → Theme Options → Frontpage Settings. This provides settings to customize how the frontpage looks like.
2. Frontpage Slider Tag: Specify tag(s) you would like to show it’s post on the slider section
3. Frontpage Slider Entries: Enter the number of post you would like show on the Slider section
4. Frontpage Gallery Tag: Specify tag(s) you would like to show it’s post on the gallery section on your frontpage
5. Featured page 1: Specify a page you are going to display as featured page on your homepage
6. Featured page 2: Specify a page you are going to display as featured page on your homepage

Subscribe Setting

1. Go to Kirei → Dashboard → Theme Options → Subscribe Settings. There are other options available. 
2. Enable Subscribe and Connect on Single Post: Enable this feature if you would like to show subscribe and connect area on the single post page
3. Subscribe title: Specify the subscribe title
4. Text: Specify text to be displayed in the subscribe area
5. Subscribe by Email ID: Specify your FeedBurner ID for email subscription form
6. Subscribe by Email to MailChimp: Specify your MailChimp List Subscribe URL to allow your users subscribe to a MailChimp List
7. Enable RSS: Enable the subscribe and RSS icon
8. Enable Related Post: Enable the related post feature

Open Graph Setting

Go to Kirei → Dashboard → Theme Options → Open Graph Settings. This contain settings to configure Open Graph feature on your website. You can enable/disable this feature, also there are options to specify the site name, open graph admin info and an image url to be set as open graph image

Thumbnail Settings

Go to Kirei → Dashboard → Theme Options → Thumbnail Settings. This provide settings to configure how the theme will generate the thumbnail images and its size. They are:

1. WordPress Featured Image:Enable this feature if you prefer to use this feature to generate thumbnail images on your website. If you enable this, there are two additional options :
   • Dynamic Resize: If this options is enabled, the thumbnail in each post will be resized dynamically using WordPress native function
   • Hard Crop: The original image will be cropped to match the target aspect ratio
3. Timthumb Image Resizer: If you enable this feature, the script will dynamically re-size images added through post custom field
4. Automatic Thumbnail: Enable this feature to allow the theme generates post thumbnail automatically from the first image in post
5. Thumbnail Images in RSS Feed: Enable this feature to allow the theme generates post thumbnail in RSS feed article
6. Thumbnail Image Dimennsions: You can specify the thumbnail image size that you are going to use on your website

Analytics ID, RSS Feed

Go to Kirei → Dashboard → Theme Options → Analytics ID, RSS Feed. In this section, you can:

1. Put your google analytics code in your website
2. Put your GoSquared token
3. Specify your feedburner URL
4. Specify the feedburner comments URL

Footer Settings

Go to Kirei → Dashboard → Theme Options → Footer Settings. In this section, you can specify a text to be displayed as a custom credit in the footer section. Also yu can specify an affiliate link in the footer of the theme.

Magazine Template

Go to Kirei → Dashboard → Theme Options → Magazine Template. There are many options available:

1. Featured Slider: Enable or disable featured slider
2. Featured Slider Title: Specify a text you are going to display as a slider title
3. Featured Slider Excerpt: Enable or disable a feature to display post exceprt in the slider section
4. Featured Slider Excerpt Length: Specify the number of words from your post to be displayed as an excerpt
5. Featured Slider Title: Specify a text you are going to display as a slider title
6. Featured Slider Tag(s): Specify tag(s) you would like to display in the featured slider section. Separate between each tag using comma (e.g. tag1,tag2)
7. Featured Slider Height: Specify a height of the featured slider section or leave it blank as a default value
8. Featured Slider Posts: Specify the number of post which you are going to display in the featured slider section
9. Featured Categories: Select which category you would like to use in the featured post section
10. Featured Posts: Select the number of post you are going to display in the featured post section
11. Featured Image Dimensions: Specify a size of featured image in the featured section
12. Exclude Categories from Magazine: Specify categories’ ID you want to exclude from this template. Separate between each category id using comma (e.g. 11,22)
13. Normal Posts: Specify the number of post you are going to display in the normal post section
14. Normal Posts Image Dimensions: Specify a size of image in the normal post section
15. Normal Posts Image Alignment: There are 3 options available of the image alignment you can use in the normal post section
16. Normal Posts Excerpt Length: Specify the number of words from your post to be displayed as an excerpt in the normal post section
17. Magazine Page Layout: There are 3 options available you can use as the main layout of your web page

Portfolio Settings

Go to Kirei → Dashboard → Theme Options → Portfolio Settings. There are many options available:

1. Disable Portfolio Menu: Enable or disable portfolio functionality
2. Portfolio Description: Specify a text as a description for your portfolio page
3. Select which page you are going to use as a contact page on your portfolio

Photoblog Settings

Go to Kirei → Dashboard → Theme Options → Photoblog Settings. In this section there is an option available to enable or disable photoblog functionality

Business Template

Go to Kirei → Dashboard → Theme Options → Business Template. There are many options available:

1. Featured Slider: Enable or disable featured slider
2. Business Slider Section: If you enable the featured slider section, you can choose which tag you would like to use in the slider section
3. Business About Section: Choose which one of your page you would like to show in the business about section
4. Phone Number: Specify your business phone number
5. Address: Specify your business address
6. Email Address: Specify your business email address
7. Business Section 1: Choose which one of your page you would like to show in the business section 1
8. Business Section 2: Choose which one of your page you would like to show in the business section 2
9. Business Section 3: Choose which one of your page you would like to show in the business section 3
10. Enable Footer Email Subscribe: Enable or disable footer email subsribe feature

Top Ad Management

Go to Kirei → Dashboard → Theme Options → Top Ad Management. Specify the settings of the top ad on your website. There are many options available:

1. Enable Ad: Enable or disable Top Ad on your website
2. Adsense Code: Specify your adsense code or another network code
3. Image Location: Upload an image or enter an external image URL to be displayed as a top banner on your website
4. Destination URL: Specify a URL as a destination where the top ad points to

Single Ad Management

Go to Kirei → Dashboard → Theme Options → Single Ad Management. Specify the settings of the Single ad on your website. There are many options available:

1. Enable Ad: Enable or disable Single Ad on your website
2. Adsense Code: Specify your adsense code or another network code
3. Image Location: Upload an image or enter an external image URL to be displayed as a single banner on your website
4. Destination URL: Specify a URL as a destination where the single ad points to

Contact Form

Go to Kirei → Dashboard → Theme Options → Contact to specify your email address which will be be used in the contact form on your website.

Start of page

SEO Settings

This panel provides settings to encourage your website Search Engine Optimization.

Page Title

Go to Kirei → Dashboard → SEO Settings → Page Title. In this section, there are options to set how the title of every page in your website will be displayed. They are:

1. Blog Title: Specify a text you want to display as a blog title
2. Blog Description: Specify a sentence you want to display as a blog description
3. Separator: Specify a character you would like to use as a separator in page title
4. Custom Page Titles: Enable or disable this feature on your website. If you enable this option, there are additional options available. They are:
   • Homepage Title Layout: You can define the order of the elements on your homepage
   • Single Title Layout: You can define the order of the elements on the single title layout
   • Page Title Layout: You can define the order of the elements on the page title layout
   • Archive Title Layout: You can define the order of the elements on the archive title layout
   • Page Number: You can specify a text that precedes page number in page titles
   • Page Number Position: You can define the position you want to display the page number on your website

Description Meta

Go to Kirei → Dashboard → SEO Settings → Description Meta. In this section, there are options to set meta description of your website. They are:

1. Homepage Description: There are 3 options available to choose. Each option describes the source where the home page meta description is populated
2. Custom Homepage Description: Specify a decription of your homepage
3. Single Page/Post Description: There are 3 options available you can choose the source where the single page/post meta description is populated
4. Global Post/Page Description: Enable or disable custom meta description on your posts and pages

Keyword Meta

Go to Kirei → Dashboard → SEO Settings → Keyword Meta. In this section, there are options to set keyword meta of your website. They are:

1. Homepage Keywords: There are 2 options available to choose. Each option describes the source where the homepage meta keywords is populated
2. Custom Homepage Keywords: Specify a custom homepage keywords of your website. Separate each keyword using comma
3. Single Page/Post Keywords: There are 3 options available you can choose the source where the single page/post meta keywords is populated
4. Global Post/Page Keywords: Enable or disable custom meta keywords on your posts and pages

Indexing Options

Go to Kirei → Dashboard → SEO Settings → Indexing options. There are options available:

1. Archive Pages to Index: Select which archive page to be indexed
2. Add Follow Meta to Posts and Pages: Enable or disable a feature to add follow meta in all of your posts and pages

Advanced Options

Go to Kirei → Dashboard → SEO Settings → Advanced options. There is option available to enable or disable 3rd party plugin data and also there is an option to hide ColorLabs SEO Settings box from the post and page editing screens.

Start of page

Layout Options

This panel contains settings to customize the layout of Backbone theme. There are a lot of options available to customize how your website looks like. They are general styling option, typography option, layout option, header styling, post styling, widget styling, footer styling and navigation styling.

General Styling

Go to Kirei → Dashboard → Layout Settings → General Styling. This panel provides settings to configure the general styling of your website. They are:

1. Disable All Custom Styles: Enable or disable all output from custom css file
2. Background Color: Specify a custom color as the background color of your website
3. Background Image: Upload an image or specify an external image URL as the background image of your website
4. Background Image Repeat: Choose any option you prefer how your background image would be displayed
5. Link Color: Specify a custom color as the link color of your website
6. Link Hover Color: Specify a custom color as the link hover color of your website
7. Button Color: Specify a custom color as the button color of your website
8. Font Button Color: Specify a custom color as the font button color of your website
9. General Border Color: Specify a custom color as the general border color of your website
10. Custom CSS: You can easily add some custom css code for this theme

General Typography

Go to Kirei → Dashboard → Layout Settings → General Typography. There are options in this panel to customize how the typography on your website looks like. There are General text font style, heading 1, heading 2, heading 3, heading 4, heading 5 and heading 6 font style. You can specify the font type, font size, font style and font color in each section.

Layout

Go to Kirei → Dashboard → Layout Settings → Layout. In this panel, there are layout options available to choose as your website layout. Choose the layout options you prefer to use as the main layout and footer widget area of your website.

Header Styling

Go to Kirei → Dashboard → Layout Settings → Header Styling. In this panel, there are options available to configure how the header of your website looks like. They are:

1. Header Background Color: Specify a custom color as the background color of your website header
2. Header Background Image: Upload an image or specify an external image URL as the background image of your website header
3. Header Background Image Repeat: Choose any option you prefer how your background image would be displayed
4. Header Border: You can specify how the border on your website header looks like.
5. Header Margin Top/Bottom: Specify an integer value for top and bottom margin of your website header
6. Header Padding Top/Bottom: Specify an integer value for top and bottom padding of your website header
7. Header Padding Left/Right: Specify an integer value for left and right padding of your website header
8. Site Title Font Style: Specify the style of your website title font. Set the font size, type, style and color in this part
9. Site Description Font Style: Specify the style of your website description font looks like. Set the font size, type, style and color within this part

Post Styling

Go to Kirei → Dashboard → Layout Settings → Post Styling. In this panel, there are options available to configure how your posts would be displayed. They are:

1. Post Title Font Style: Specify the style of your post title font. Set the font size, type, style and color in this part
2. Post Meta Font Style: Specify the style of your post meta font. Set the font size, type, style and color in this part
3. Post Text Font Style: Specify the style of your post text font. Set the font size, type, style and color in this part
4. Post More (Bottom) Font Style: Specify the style of the post (more) bottom title font. Set the font size, type, style and color in this part
5. Post More (Bottom) Border Top: Specify how the top border on your post more section looks like
6. Post More (Bottom) Border Bottom: Specify how the bottom border on your post more section looks like
7. Post Author Background Color: Specify a custom color as the background color on the post author section
8. Post Author Border Top: Specify how the top border on your post author section looks like
9. Post Author Border Bottom: Specify how the bottom border on your post author section looks like
10. Comments Background Color (Even Threads): Specify a custom color as the background color in the comment section (on event threads)
11. Comments Background Color (Odd Threads): Specify a custom color as the background color of the comment section (on odd threads)
12. Page Navigation Font Style: Specify the style of the page navigation font
13. Page Navigation Background Color: Specify a custom color as the background color on the page navigation section (on odd threads)
14. Page Navigation Border Top: Specify how the top border on the page navigation section looks like
15. Page Navigation Border Bottom: Specify how the bottom border on the page navigation section looks like

Widget Styling

Go to Kirei → Dashboard → Layout Settings → Widget Styling. In this panel, there are options available to configure widgets. They are:

1. Widget Border: Specify how the border on the widget section looks like
2. Widget Title: Specify the style of the widget title font
3. Widget Title Bottom Border: Specify how the bottom border on the widget title looks like
4. Widget Text: Specify the style of the widget text font
5. Widget Rounded Corners: Set amount pixels for border radius on widget
6. Tabs Widget Background Color: Specify a custom color as the background color on the widget
7. Tabs Widget Inside Background Color: Specify a custom color as the background color on the tabs widget
8. Tabs Widget Title: Specify the style of the tabs widget title font
9. Tabs Widget Meta: Specify the style of the tabs widget meta font

Footer Styling

Go to Kirei → Dashboard → Layout Settings → Footer Styling. In this panel, there are options available to configure how the footer of your website looks like. They are:

1. Footer Font Style: Specify the style of the footer font
2. Foter Background: Specify a custom color as the background color of the website footer
3. Footer Border Top: Specify how the top border on the footer section looks like
4. Footer Border Bottom: Specify how the bottom border on the footer section looks like
5. Booter Border Left/Right: Specify how the left/right border on the footer section looks like
6. Footer Rounded Corners: Set amount pixels as a border radius on the footer section
7. Footer Padding Left/Right: Specify an integer value as a left/right padding on the footer section

Navigation Styling

Go to Kirei → Dashboard → Layout Settings → avigation Styling. In this panel, there are options available to configure the style of the navigation section on your website. They are:

1. Show Subscribe Link: Show or hide RSS link
2. Background: Specify a custom color as the background color on the navigation section
3. Navigation Font Style: Specify the style of the navigation font
4. Hover Color: Specify a custom color as the hover color on the navigation section
5. Current Menu Item Color: Specify a custom color as the current menu color on the navigation section
6. Border Top: Specify how the top border on the navigation section looks like
7. Border Bottom: Specify how the bottom border on the navigation section looks like
8. Border Left/Right: Set amount pixels for border radius on the navigation section
9. Navigation Rounded Corners: Specify how the left/right border on the navigation section looks like

Start of page