Welcome to Mikado One

Mikado One | A Single Theme For All Your Needs


Welcome to Mikado One | A Single Theme For All Your Needs

Installing Mikado One

After having downloaded the installation file from ThemeForest, extract it and locate the file named mikado1.zip. You can then install the Mikado One theme using one of the two following installation methods:

  1. WordPress upload - For most users, this is probably the simplest installation method. To install the Mikado One theme using this method, please follow these steps:
    1. Login to WordPress admin
    2. Go to admin panel > Appearance > Themes > Add New > Upload Theme
    3. Click on "Choose File" and select mikado1.zip
    4. Click on "Install Now"
  2. FTP upload - If you would like to install the Mikado One theme via FTP, please follow these steps:
    1. Using an FTP client, login to the server where your WordPress website is hosted
    2. Using an FTP client, navigate to the /wp-content/themes/ directory under your WordPress website's root directory
    3. Using an FTP client, upload the Mikado One directory to the themes directory on remote server

Once the installation is complete, your Mikado One theme will be ready for use. Now all you need to do is navigate to admin panel > Appearance > Themes and activate Mikado One. After you have done this, you should see “Mikado Settings” appear in the WordPress admin panel.

Mikado Settings

You should also see a notification at the top of the screen that required plugins need to be installed. Please install and activate all of the required plugins, since they are necessary for the theme to function properly.

Important Note 

Make sure to install the "Mikado Core" plugin, since this plugin is of critical importance for proper theme functioning. This plugin includes the custom post types that come with the theme (Portfolio, Testimonials, Mikado Slider, Mikado Carousel), and without this plugin you will not be able to create any of these custom post types or the elements in the theme that require them. 

Great - now you can start building your site!

If writing permissions aren't set for folders containing CSS and JS files on your server, you will see a warning message at the top of the theme options page. In order to remove that message, you need to change permissions for the wp-content/themes/mikado1/css and wp-content/themes/mikado1/js folders and set them to 755. We recommend setting writing permissions in order to optimize your site performance. If you have any issues with this, please contact your hosting service provider. Alternatively, you can submit a ticket to http://mikado.ticksy.com/ with FTP access for your site, and we will take a look at it.

Importing Demo Content

With the Mikado One theme, you have the option to either start building your site from scratch, or choosing to import one of our demo sites to use as a starting point, and modifying it to suit your needs. In this section we will explain how to do the latter:

Mikado One comes with a one-click import module. To import one of our demo sites, please follow these steps:

  1. Login to WordPress admin
  2. Go into admin panel > Mikado Settings > Mikado Import

    Mikad Import

  3. From the “Demo Site” dropdown menu, choose the demo site that you would like to import
  4. From the "Import Type" dropdown menu on the right, choose what type of content you'd like to import:
    • All - imports pages, content, widgets, and settings. We recommend this for users who would like to import a demo site exactly as it appears on our live demo.
    • Content - imports only pages and their content. This option is recommended for users who would like to see how we've created our page layouts, but who want to keep their own settings in Mikado Settings.
    • Widgets - imports only widgets. This option is recommended for users who would only like to populate the theme’s widget areas with the widgets from their chosen demo. No other content is imported.
    • Options - imports settings in Mikado Settings only. This option is recommended for users who would like to achieve the same look and feel of their chosen demo site, but do not want to import any additional content.
  5. If you also wish to import media files (images, videos, sounds), make sure to check the "Import attachments" checkbox.
    Please note that the images we use are copyrighted, and if you'd like to publish them on your site, you would need to purchase them separately. We bought most of our images on Shutterstock.
  6. Click on the "Import" button and wait for the import process to finish.

If you would like to import the LayerSlider demo slider, you need to locate the 'xml export' folder in the previously downloaded package from ThemeForest. Inside, you'll find the LayerSlider_Export.zip file. Next, go to LayerSlider from the WordPress admin panel and upload this file under the Import section.

Installing Woocommerce

If you plan on building an online shop with Mikado One, please read the WooCommerce section of this user guide before installing the demo content.

Updating Mikado One

You can update your theme by performing the following steps:

  1. Download the latest theme zip file from ThemeForest
  2. Extract it and locate mikado1.zip
  3. Extract mikado1.zip and locate the 'mikado1' folder
  4. Copy/Replace the contents of the 'mikado1' folder to the /wp-content/themes/mikado1 folder of your web site.

Important F.A.Q.

1. Why can't I save my menu?

WordPress by default has a limited number of menu items. When you import our demo site, which contains a lot of menu items, you might not be able to save changes you make to a menu. You can fix this problem by contacting your hosting and asking them to add the following lines to php.ini file:

suhosin.post.max_vars = 5000
suhosin.request.max_vars = 5000
2. Why is there a smiley displayed on blank pages?

This problem is most likely related to JetPack and memory settings of your hosting. You can either disable JetPack or read what the JetPack developer wrote: Regarding the memory limit, please refer to the WordPress Codex section concerning this problem. Some sites that load many plugins alongside WordPress ultimately require a higher memory limit than WordPress defaults to, but since this is limited to specific hosts and configurations, it must be dealt with on an individual basis. You'll find the Codex article at: http://codex.wordpress.org/Common_WordPress_Errors#Allowed_memory_size_exhausted

3. How do I optimize my site?

Please use this tool to investigate reasons for slow loading: https://developers.google.com/speed/pagespeed/insights/?hl=en

4. How to translate or rename default theme labels?

You can use the Codestyling localization plugin (http://wordpress.org/plugins/codestyling-localization/) to translate/rename all the theme's labels. Another solution is to edit the theme folder/languages/en_US.po file directly in editor and manually edit labels you want to translate.

5. Why do I see a white screen when importing demo content?

If you get a white screen or some other error when trying to import our demo content, this probably happens because of the maximum execution time limit. You need to increase the maximum execution time (upload time) setting of your web server. The default maximum execution time on web servers is 30 seconds. Please increase it to 120 seconds. Possible ways of achieving this are:

Ask your hosting provider to take care of this for you.

Once you've installed Mikado One, you can start building your site.

Setting Up the Header

One of the first things you might want to do after you have installed and activated your Mikado One theme is to set up you header area. The header contains the logo, menu, search bar, side area icon, and other optional widgets.

 

To set up your header, go to Mikado Settings > Header from the admin panel. The settings you define here will be the default settings for all pages on your site. If you need any help understanding any of these options, please refer to the Mikado Settings section of this user guide.

 

Some options, such as the header skin and background color, can be overridden on a page to page basis from a page’s backend. For more information on how local page settings work, please refer to the Pages section of this user guide.

To add your logo to the header, go to Mikado Settings > General > Branding from the admin panel and click the upload button next to the “Logo Image – Normal” field. After you upload your image and save the options, you should have a visible logo in your header area.

Mikado Settings > GeneralBranding > Logo

Menu Creation

To create a new menu, go to Appearance > Menus from the admin panel and click on “Create a new menu”. Enter a name for your new menu and then click “Create Menu”.

Every page that you have created will be listed in the section on the left named “Pages”. Simply check the ones that you would like to add to your menu and click the “Add to Menu” button. Once you have added pages to your menu, you can click and drag the menu items to rearrange them, or nest them one underneath the other.

In the “Menu Settings” section (which is located underneath the “Menu Structure” section), check the checkbox next to “Top Navigation” and click “Save Menu”. This will activate the menu you have just created, and you should now see a functional menu in your header.

Appearance > MenusTop Navigation

Footer

To set up your footer, go to Mikado Settings > Footer from the admin panel.

Mikado Settings > Footer

The settings you define here will be the default settings for all pages on your site. If you would like both the top and bottom footer areas to be displayed, make sure that both the "Show Footer Top" and "Show Footer Bottom" options are enabled. If you need any help understanding any of these options, please refer to the Mikado Settings section of this user guide.

Footer Settings

Content is added to your footer via widgets. Go to Appearance > Widgets from the admin panel. On the right side of your page you will see the widget areas for your footer. The widget areas for the top footer are named Footer Column 1, Footer Column 2, Footer Column 3, and Footer Column 4. On the left side of the Widgets page you will see the available widgets. To add a widget to one of the Footer widget areas, simply drag the desired widget to one of the Footer Column widget areas on the right.

Appearance > WidgetsAdding Widget

Saving Widget

To add content to the bottom footer, simply add widgets to the Footer Text widget area, or the Footer Bottom Left and Footer Bottom Right widget areas.

General Look and Feel

Now let’s set up the general look and feel of your site. If you have imported a demo site and would like to keep its general look and feel, then you do not need to do anything else. Otherwise, go to Mikado Settings > Fonts and in the "General Settings" section choose a default font family for your site, and then navigate to Mikado Settings > General and in the "Appearance" section set a default main color for your site.

Now that you have set up the basic elements for your site, you’re ready to start building your pages.

Building Pages

To create a new page, go to Pages > Add New from the admin panel. In the text field near the top of the screen enter a title for your page. After you have added a title, choose the “Full width” template from the section on the right named "Page Attributes". This will allow you to add sections to your page that span across the whole width of the screen.

Page Attributes > Template

In the bottom section of your screen are local page settings. Any settings that you define here will override the global settings set in "Mikado Settings". It is generally considered good practice to set up the look and feel of your site on a global level, and override the settings when necessary on a local level. This will save you a lot of time, unlike if you were to set up every page separately.

To start adding elements to your page, first make sure that you are in the backend editor. If the blue button on the top left says BACKEND EDITOR, click on it to enable the Visual Composer page builder view. Once you’re in the Visual Composer view, the blue button will say CLASSIC MODE. You can now click on “Add element” to start adding elements to your page. You can learn more about elements in the Custom Shortcodes section of this user guide.

Please note that the Frontend view for Visual Composer has been intentionally disabled since some of the added custom shortcodes require page reload because of script calculations, and due to this do not appear on the page while building with the Frontend view. The Frontend view can be used, however while building your page some elements might not display properly until you refresh the page. If you would like to use the Frontend view, you can enable it by going to Appearance > Editor, opening the extend-vc.php file and finding the following piece of code  if(function_exists('vc_disable_frontend')){vc_disable_frontend();} and either removing or commenting it out. To disable the Frontend view again you just need to uncomment or return this code.

Backend EditorClassic Mode

Add New Element

Finally, click the "Publish" button in the upper right section of the page. (If you made some changes on already published page, "Update" button will appear.

Publish Button

Blog Posts

To create a new blog post, go to Posts > Add New from the admin panel.

Posts > Add New

  1. Enter a title for your post in the text field near the top of the screen.
  2. On theright side of your screen, in the section called "Format", choose a format for your blog post.

    Post Format

Let’s take a look at the possible options:

  1. Click on "Add Element" and choose "Text Block"
  2. Delete any default text in the pop-up window and click "Add Media" in the upper left corner
  3. Click on "Create Gallery" in the menu on the left
  4. Select the images that you wish to add, and click on the "Create a new gallery" button
  5. You can write captions for the images, and reorder them by clicking and dragging
  6. After you have finished adding your images, click the "Insert gallery" button. Then click "Save changes"
Now it's time to categorize this post.
  1. Beneath the "Format" section you will see a section named "Categories". Here you can select the categories that you would like to add this post to. If you would like to create a new category, click on the “+ Add New Category” link. A text field will appear in which you can enter a category name, and then click “Add New Category”.
  2. Once you've checked the categories you would like to add your post to, click the “Publish” button.
  3. Beneath the "Categories" section you will see the "Tags" and "Featured Images" sections. Here you can add tags to your post and set a featured image to be displayed for this post on blog list pages.

Now that we have published our first blog post, let’s go over the available custom fields for blog posts..

Note that most of them are the same custom fields you'll find when creating standard pages.

Mikado General

Mikado General

Mikado Header

Mikado Side Menu Area

Mikado Side Menu Area

Mikado Title

Mikado Title

Mikado SEO

Mikado SEO

In order to improve your page ranking on search engines, you can fill out the following custom SEO fields:

Blog Lists

You can choose the way your Blog List will show to visitors.

In WP admin > Pages find the dropdown list "Templates" on the right and choose one of the following options:

Date Format

If you wish to change the date format on blog posts, go to admin panel > Settings > General > Date Format and select your format of choice.

Settings > Date Format

You can access Mikado Settings from the WordPress admin panel. The settings found here are applied globally and will affect all pages of the site. However, note that many of these options can be overridden locally by applying settings on individual pages or on shortcode elements.

General

This section allows you to set up general settings for your site that will affect its look and functionality.

Mikado Settings > General

Branding

The logos displayed on your page are limited in size by header height. For example, if your logo is 100 pixels in height and your header is 90 pixels high, the logo will slightly shrink in size in order to fit into the header area. The same principle applies to logos that appear on sticky; they are limited by sticky section height.

Retina

To make your logos retina ready, upload ones that are twice as high as the header. For example, a header of 90 pixels in height would require a logo that's 180 pixels high. This principle applies to all logos you upload.

Appearance
Main Color
Header Position
Uniform Site Background
Boxed Layout
Passepartout
Behavior
Custom CSS and JS
SEO
Maintenance Mode

Fonts

 

This section allows you to set up font properties for different elements on your site, which is essential for achieving a consistent look and feel.

General Settings
Headings
Text

Header

This section allows you to set up the header area. The first choice to make is whether you'd like to have a top menu or left menu navigation. You can then optionally enable a side area, search bar, header top area, and/or fullscreen menu. Each of these can be further customized with text styles, colors, and content alignment.

Also, each hierarchy level in menus can separately be customized. For example, if a menu contains About > Our Team > John Doe, then About is considered a 1st level, Our Team a 2nd level, and John Doe a 3rd level menu item.

General Settings

Please note that if you use the Side Menu Area (by going to Mikado Settings > General > Appearance > Header Position and setting “Switch to Side Position to “Yes”), you will get a different set of options for the Side Menu Area. These options are listed below this section.

Note: To manage logos, go to Mikado Settings > General > Branding.

General Settings - When Header is Set to Side Menu Area

Header Side Position

Header Side Position Look

Main Menu

Header Top Position

Header Top Look

First Level Menu
Dropdown Menu
Second Level Menu
Third Level Menu
Fixed Menu
Sticky Menu
Header Top Area

Header Top

Additional Features
Mikado Search

Mikado Search

Side Area

Header Side Area IconSide Area

Fullscreen Menu

Fullscreen Menu

Mobile Header

Mobile Header

Title

This section allows you to set up the title area. You can animate it, define colors or images, add breadcrumbs, and more. 

General Settings
Fonts

Content

General Settings
Content Bottom Area

This section allows you to set up the footer area. There are two footer sections that can either be hidden or shown: the footer top and footer bottom. The footer top can be split into columns and is appropriate for placing widgets, such as menus, images, and social icons. The footer bottom is a simple section at the bottom of the page and is meant for placing copyright text.

General Settings
Footer Top Settings
Footer Bottom Settings

Elements

This section allows you to set up properties for different elements (shortcodes). Note that these settings can be overridden locally in shortcode options when adding elements to your page.

'Back to Top' Link Button
Blockquotes
Buttons

Define styles for buttons of type "Default," "White," "Mid-transparent," "Top & Bottom Border," "Small," "Large," and "Extra Large."

Content Menu
Counters
Expandable Section
Highlight
Horizontal Progress Bar
Icons
Icon With Text
Input fields
Interactive Banners
Lists
Message Boxes
Pagination
Parallax
Pie Charts
Pricing Table
Separators
Separators With Text
Service Table
Single Image
Slider Navigation Interface

Define styles for navigation buttons on horizontal sliders (such as the Portfolio Slider and Mikado Carousel) and vertical sliders (as seen on the Full Screen Section page template).

Social Icon
Tabs
Tags
Team
Testimonials
Widgets
Widget Style
Widget Title

Define widget title styles.

Widget Links

Define widget link styles.

Blog

This section allows you to set up blog pages.

Blog List pages are pages that display multiple blog items using one of the predefined blog layout templates. Each of these templates can separately be customized.

Blog Single pages are those that display a single blog post.

Blog List
Blog Single
Post Info Data Fields
Advanced Options

You can use this panel to show or hide the separate options panels for each of the various blog templates.

Blog List Template Options: Date in Title
Post Info Data Fields
Post Design Style
Post Text Style
Blog List Template Options: Category and Title First (Centered)
Post Info Data Fields
Post Design Style
Post Text Style
Blog List Template Options : Post Info Vertical – Content
Post Info Data Fields
Post Design Style
Post Text Style
Blog List Template Options : Image with Icon (Centered)
Post Info Data Fields
Post Design Style
Post Text Style
Blog List Template Options : Title and Date First
Post Info Data Fields
Post Design Style
Post Text Style
Blog List Template Options : Title and Author (Centered)
Post Info Data Fields
Post Design Style
Post Text Style
Blog List Template Options : Post Info Vertical – Image
Post Info Data Fields
Post Design Style
Post Text Style
Blog List Template Options : Masonry & Masonry Full Width
Post Info Data Fields
Post Design Style
Post Text Style

Portfolio

This section allows you to set up your portfolio. The "Portfolio List" section applies to pages that contain the Portfolio List shortcode. The "Portfolio Single" section applies to single project pages.

Portfolio List
Title Text Styles
Category Text Styles
Category Filter
Icons
Portfolio Single

Sliders

Here you can set the options for the Mikado Slider and Vertical Split Slider.

Mikado slider
Navigation Bullets Style
Vertical Split Slider

Social

This section allows you to manage social sharing on your site. You can select which social networks to enable, what elements of your site can be shared, and upload social share icons..

Social Sidebar
Enable Social Share
Social Networks

Here you can set which social networks you would like sharing to be available on. If you would like to, you can also set a custom icon for each social network.

404 Error Page

Here you can set up the "404" page viewers see when an error occurs.

Contact Form 7

Here you can create up to 3 different custom styles that can later be applied to forms you create via the Contact Form 7 shortcode.

When referring to form elements, we are referring to text input fields, text areas, and select lists. When viewers click on a particular element, that element is in "focus;" you can stylize it differently from the rest to make it stand out. 

WooCommerce

This section allows you to set up your shop pages.

General
Text Input fields

The settings you define here will affect input fields on all shop pages.

Buttons

The settings you define here will affect buttons on all shop pages.

Product List
Product Sorting Select Box

Define styles for the product sorting box.

Product Single
Product Text Style
"Add to Cart" Button

Define styles for the "Add to Cart" button.

BuddyPress

BuddyPress helps you run any kind of social network on your WordPress, with member profiles, activity streams, user groups, messaging, and more. Here you can define settings and styles for BuddyPress.

Members Box

Box Style – Set styles for the members box. You can define the border color, border width, and border radius for the members box.

Button
Header Buttons
First Level Menu
Second Level Menu
Form Elements
Pagination
Text

Reset

  You can use this option to reset all the Mikado Settings to their default settings.

Mikado Import

You can use this options panel to import demo content. For more information about importing demo content please refer to the Getting Started section of this user guide.

When creating a new page, one of the first things you will probably want to do is to choose an appropriate template for your page. To this this, visit your page from the backend (or create a new page by going to Pages > Add new), and locate the "Page Attributes" section on the right side of the screen. Mikado One comes with a variety of page templates to choose from:

*All of the blog templates listed above are used for displaying blog posts in various manners.

Page Templates

Now that you have chosen a template, let’s go over the custom fields available for pages.

Please note that any settings you save here will override the global settings you've set in Mikado Settings. It is generally considered good practice to set up the look of your pages on a global level, and then override settings on a local level, if necessary. This will save you a lot of time, unlike if you were to set up every page locally.
Mikado General
Mikado Header
Mikado Title
Mikado Blog

This section applies when you're using one of the blog templates.

Mikado SEO

In order to improve your page ranking on search engines,  you can fill out the following custom SEO fields:

Full Screen Sections

Since this page template is quite specific, we will go over its features separately:

To create a new portfolio item: 

  1. Go to Portfolio > Add new from the admin panel.
  2. Enter a title for your portfolio item in the text field near the top of the page.
  3. On the right side of the screen you will see a section named Portfolio Categories. Here you can select the categories that you would like to add this post to. If you would like to create a new category, click on the “+ Add New Category” link. A text field will appear in which you can enter a category name, and then click “Add New Category”.
  4. Once you have checked the categories you would like to add your post to, click the “Publish” button.

Beneath the "Portfolio Categories" section are the "Portfolio Tags", "Attributes", and "Featured Image" sections. In the "Portfolio Tags" section, you can enter tags for this portfolio item. In the "Attributes" section, you can set the order in which you would like this portfolio item to appear in portfolio lists. In the "Featured Image" section, you can set an image to be displayed for this item on portfolio lists.

Now that you have set up your first portfolio item, let’s go over the available custom fields for portfolio items.

Note that most of them are the same custom fields you'll find when creating standard pages.
Mikado Portfolio Images (multiple upload) 

Portfolio - Multiple Upload

This section allows you to upload multiple images at once:

  1. Click the Upload button.
  2.  Fill your gallery with images. You can do this by simply dragging and dropping them into the window. Alternatively, click on "Add to Gallery" on the left, and select files from your media library to add.  
  3. Once added to the gallery, you can write captions for the images and reorder them by clicking and dragging.
  4. Click the "Update gallery" button. 
Mikado Portfolio Images/Videos (single upload)

Portfolio - Single Upload

This section is meant for uploading single files. The advantage of using this method is that you can upload videos, whereas in multiple upload, only images can be used. Note that you can combine both upload methods.

Mikado Additional Portfolio Sidebar Items

Portfolio - Additional Sidebar Items

If you wish to add another item to your portfolio sidebar, you can do so here.

Mikado General
Mikado Header
Mikado Side Menu Area
Mikado Title
Mikado SEO

In order to improve your page ranking on search engines, you can fill out the following custom SEO fields:

The Mikado Slider provides a powerful way to create sliders. It’s easy to create, edit and delete sliders using our custom interface.

Creating a Slider

In order to begin creating a new slider, go to Mikado Slider > Add new slide from the admin panel, and enter a title for your slide in the text field near the top.

You can edit your slide by using the following fields:

Mikado Slide Type

Mikado Slide Type

Mikado Slide Image
Please note that the image will be fitted across full width of the screen. We therefore recommend that your image is in full HD resolution of 1920x1080 pixels.

It is possible to display an image that doesn’t span the full height of the screen. In this case, you will have to set a custom height for your slider. Setting a custom height for your slider will be explained later in the Using your slider section.

Mikado Slide Video
Mikado Slide General

For more information on the header skin setting, please refer to the Mikado Settings > Header section of this user guide.

Note that you must enable the dark/light effect for the slider in Mikado Slider > Sliders > Effect on header (dark/light style) in order for this to take effect. We'll explain this in more detail later on, in Finishing Touches.
Mikado Slide Title
Mikado Slide Subtitle
Mikado Slide Text
Mikado Slide Graphic
Mikado Slide Buttons

You can set styles for the two buttons on the slide in this section:

Mikado Slide Content Positioning

You can use this section to position the content within your slide:

Using Your Slider

In order to display your slider on a page, you need to first go to Mikado Slider > Sliders and copy the shortcode string generated for your slide. Then you need to navigate to the page you would like the slider to display on and paste its shortcode into the "Layer Slider or Mikado Slider Shortcode" field on this page.

Slider Shortcode

The shortcode of your slider should look something like this:

1. [mikado_slider slider='home-slider'auto_start='true'animation_type='slide'slide_animation='6000' height=''responsive_height='yes'background_color='' anchor='']

You can modify some attributes of the shortcode in order to achieve different effects:

Finishing Touches

You can further edit your slider by going to Mikado Slider > Sliders from the admin panel and selecting your slider from the list. In the slider options, you will find the following settings:

Breakpoint Coefficients and Breakpoint Sets

The Mikado Slider provides two sets of breakpoints which you can choose from. You can view these breakpoint sets by going to Mikado Slider > Sliders where all the breakpoints and default coefficients are listed, and you can choose which set you would like to use by changing the value of the “responsive_breakpoints” attribute in the slider shortcode (this attribute takes the values “set1”, or “set2”).
 
After you have chosen which set of breakpoints you would like to use, you can then set breakpoint coefficients for each element in the slider which contains some text (Title, Subtitle, Text, and Button). These breakpoint coefficients control the responsiveness of the text in your slider. The breakpoint coefficient can be any number between 0 and 1 (1 meaning that the text stays in its originally set size).
 
The size of the text is calculated by taking the original text size you set, and multiplying it with the coefficient. The result will be rounded to the nearest whole number and this will become your new text size.
 
For example, if you set your slider text size to 12px and are using the first set of breakpoints (set1) and the default coefficient values, then your text will stay at 12px inside the first two breakpoints (which have a default coefficient of 1, so 12 x 1 = 12). At the third breakpoint (between 1200px and 900px, according to set1), your text will shrink to 10px since the default coefficient is 0.8 (12 x 0.8 = 9.6, which is rounded to 10), at the fourth breakpoint (between 900px and 650px, according to set1), your text will shrink to 8px since the default coefficient is 0.7 (12 x 0.7 = 8.4, which is rounded to 8), etc.

Testimonials are a great way to show potential clients what others are saying about your business.

To create a testimonial, go to Testimonials > Add New from the admin panel, and enter a title for your testimonial in the text field near the top of the screen.

Testimonials > Add New

Mikado Testimonials

Fill in the following fields to complete your testimonial:

You can now assign your testimonial to a category. On the right side of the screen you will see a section named "Testimonial Categories". Here you can select the category that you wish to add this testimonial to. If you would like to add a new category, click on the “+ Add New Testimonials Category” link and a text field will appear in which you can enter a name for your new category. Then click on “Add New Testimonials Category”. 
 
After you have selected the categories you want to add this testimonial to, click the “Publish” button.
 
Finally, in order to display your testimonials on a page, go to that page from the backend and click the “Add Elements” button, and from the elements menu select "Testimonials".
 
Elements > Add NewTestimonials Shortcode
 
You can now edit how your testimonials display on the page by filling out the following fields:

Widgets are easy to manage and can be incredibly useful to have on your site.

For Mikado One, we have developed custom widgets and widget areas in order to give you even more functionality. You also have the option of creating multiple custom sidebars.

Widgets

Please note that you need to have Woocommerce installed in order for this widget to take effect.

Widget Areas

To create a menu, go to Appearance > Menus from the admin panel.

In the upper left corner of your screen you will see two tabs: "Edit Menus" and "Manage Locations".

Appearance > MenusMenu Tabs

In the Manage Locations tab you can assign menus to two different locations: "top navigation" and "fullscreen navigation". If you are using the "Sticky Divided" header type, you’ll see two other locations: "left top navigation" and "right top navigation" (these locations only apply to the "Sticky Divided" header type).

Note that you must assign your menu to a location in order for it to be visible.
 
You can also assign the current menu to a location in the "Edit Menus" tab, by scrolling down to the "Menu Settings" section.
 
Menu Settings
 
You can edit your menus in the "Edit Menus" tab. When editing menus, you can click on the small triangle icon on each menu item to open a list of editable settings:
 
Menu Options
Wide Menu

Anchors (One Page Site Functionality)

You can link menu items to sections on your page using anchors. This way, when clicked, the menu item will scroll the page down to the section you linked it to.

In order to create an anchor link, you need to follow these steps:

  1. You need to set anchor IDs for your rows when editing your page. You can achieve this by editing the properties of the row element in Visual Composer. In the “Anchor ID” field of the row item’s options type in the name of your anchor. You can use any text without empty spaces.

    Edit RowRow Anchor

  2. You can repeat step 1 for as many rows on as many pages as needed.
  3. When you go to edit your menu in Appearance > Menus, find the page (or pages) containing your rows with anchors and drag as many instances of them into your menu as needed.
  4. Edit each of the newly added menu items, and for each one type in its corresponding anchor ID in the “Anchor” field.

    Menu Anchor

 

Add New Element

Row

The row element is a container element to which you can add other elements (shortcodes) and sort them on your page. The row element can be set to be "Full Width" or "In Grid". Using the "CSS Animation" option, you can set an entering animation for this element, and with the "Transition Delay" option you can set a delay time for the chosen animation. The "Anchor ID" option is used to set up anchor functionality, and you can use it to add an ID to the row, which can later be referenced in the main menu Anchor ID field.

Separator

Separator with Text

Single Image

Tabs

In the tab settings for each tab, you can set the Tab Title, Icon Pack and Icon (the Icon Pack and Icon options only take effect if you are using the Vertical Left With Icons style).

Accordion

In the section settings for each section, you can set the Title of the section, Title Color, Background Color, and Title Tag.

Empty Space

You can use this shortcode to add some empty space to your page.

Portfolio List

Portfolio lists enable you to present your portfolios on a page.

Portfolio Slider

The Portfolio Slider enables you to organize your portfolio items as an interactive slideshow which viewers can navigate through.

Counter

Counters are great for communicating information in the form of numbers.

Cover Boxes

Cover Boxes allow you to give a preview of your content in an interactive way, inviting viewers to follow the links and read more.

Google Map

Icon List Item

Icon List Items allow you to make lists using icons, rather than numbers or bullets.

Call to Action

Call to Action elements allow you to display bold messages on your page, inviting viewers to follow a link.

Blockquote

The blockquote element provides a great way to make a section of text stand out on your page.

Button

Buttons are a widely used element on the web and can be used for a variety of purposes.

Image with Text

This shortcode allows you to quickly add an image with text to your page.

Message

Messages allow you to display hints, warnings, or any other messages that you wish to communicate to your users.

Pie Chart

Pie Charts are great for communicating information in a visual and easy to understand manner.

  • Size (px) – Set a custom size for the pie chart.
  • Type of Central Text – Choose whether you would like to display a title or percentage inside your pie chart.
  • Percentage – Set the percentage you would like displayed in your pie chart.
    • Show Percentage Mark – Choose whether you would like to display or hide the percentage mark (%).
    • Percentage Color – Set the color for your percentage number.
    • Percentage Font – Input the font type you would like to use for your percentage number.
    • Percentage Font Size – Set the font size for your percentage number.
    • Percentage Font Weight – Set a font weight for your percentage number.
  • Bar Active Color – Set a color for the active part of the pie chart.
  • Bar Inactive Color – Set a color for the inactive part of your pie chart.
  • Pie Chart Line Width (px) – Set a width for the pie chart line (in pixels).
  • Chart Alignment - Set an alignment for your pie chart on the page.
  • Title – Set a title for your pie chart.
  • Title Color – Set a color for your title.
  • Title Tag – You can choose a heading style to apply to the title.
  • Text – Set your pie chart text.
  • Text Color – Set a color for your text.
  • Separator – Choose whether you would like a separator to appear between the pie chart and the text.
    • Separator Color – Set a color for the separator.
    • Separator Border Style – Choose a border style for the separator.

Pie Chart With Icon

The pie chart with icon element is great for communicating information in a visual and easy to understand manner.

  • Size (px) – Set a custom size for the pie chart.
  • Percentage – Set the percentage you would like displayed in your pie chart.
  • Bar Active Color – Set a color for the active part of the pie chart.
  • Bar Inactive Color – Set a color for the inactive part of your pie chart.
  • Pie Chart Line Width (px) – Set a width for the pie chart line (in pixels).
  • Title – Set a title for your pie chart.
  • Title Color – Set a color for your title.
  • Title Tag – You can choose a heading style to apply to the title.
  • Icon Pack – Choose an icon pack.
    • Icon – Set an icon for your pie chart with icon.
    • Icon Color – Set an icon color.
    • Icon Size – Choose an icon size.
  • Text – Input some text for your pie chart with icon.
    • Text Color – Choose a color for your text.
  • Separator – Choose whether you would like a separator to appear between the pie chart and the text.
    • Separator Color – Set a color for the separator.
    • Separator Border Style – Choose a border style for the separator.

Pie Chart 2 (Pie)

They are great for communicating information in a visual and easy to understand manner.

  • Width – Enter a width for the pie chart (in pixels).
  • Height – Enter a height for the pie chart (in pixels).
  • Legend Text Color – Choose a color for legend text.
  • Content – In this section, you can edit parts of the pie chart – percentages, colors, legend labels – as well as add or remove data.

Pie Chart 3 (Doughnut)

They are great for communicating information in a visual and easy to understand manner.

  • Width – Enter a width for the pie chart (in pixels).
  • Height – Enter a height for the pie chart (in pixels).
  • Legend Text Color – Choose a color for legend text.
  • Content – In this section, you can edit parts of the pie chart – percentages, colors, legend labels – as well as add or remove data.

Progress Bar – Horizontal

The Progress Bar element is great for communicating a large amount of information in a visual and easy to understand manner.

  • Title – Enter a title here.
  • Title Color – Choose a color for the title.
  • Title Tag – You can choose a heading style to apply to the title.
  • Title Custom Size (px) – Alternatively, enter a custom title size.
  • Title Padding Bottom (px) – Set a bottom padding for your title.
  • Percentage – Enter the percentage number.
    • Show Percentage Number – You can show or hide the percentage number.
    • Show Percentage Mark – You can show or hide the percentage mark.
    • Percentage Type – Choose between “static” and “floating” percentage type.
    • Percentage Color – Set a color for the percentage.
    • Percentage Background Color – Set a background color for the percentage.
    • Percentage Font Size – Set a font size for the percentage.
    • Percentage Font Weight – Set a font weight for the percentage.
  • Active Background Color – Choose a color for the active part of the bar.
  • Active Border Color – Choose a border color for the active part of the bar.
  • Inactive Background Color – Choose a color for the inactive part of the bar.
  • Progress Bar Height – Enter a height for the progress bar (in pixels).
  • Progress Bar Border Radius – Enter a border radius number (in pixels) if you want your bar to have rounded corners.

Progress Bar – Vertical

The Progress Bar element is great for communicating a large amount of information in a visual and easy to understand manner.

  • Title – Enter title here.
  • Title Color – Choose a color for the title.
  • Title Tag – You can choose a heading style to apply to the title.
  • Title Size – Alternatively, enter title size here (in pixels).
  • Bar Color – Choose a color for the active part of the bar.
  • Bar Border Color – Choose a color for the bar border.
  • Background Color – Choose a color for the inactive part of the bar.
  • Top Border Radius – Enter a border radius number (in pixels) if you want your bar to have rounded corners.
  • Percent – Enter the percentage number.
    • Show Percentage Mark – You can show or hide the percentage mark.
    • Percentage Text Size – Enter a text size (in pixels) for the percentage number.
    • Percentage Color – Choose a color for the percentage number.
  • Text – Enter accompanying text here.
    • Text Color – Set a color for your text.

Progress Bar – Icon

The Progress Bar element is great for communicating a large amount of information in a visual and easy to understand manner.

  • Number of Icons – Enter the number of icons you want to appear in the progress bar.
  • Number of Active Icons – Enter the number of icons to appear active.
  • Type – You can choose between Normal, Circle, or Square icon type.
  • Icon Pack – Choose the icon pack you would like to use.
  • Icon – Set your icon.
  • Size – Set the size for your icon.
  • Icon Color – Set the color for your icon.
  • Icon Active Color – Set the color for active icons.
  • Background Color – Choose a background color for inactive icons.
  • Background Active Color – Choose a background color for active icons.
  • Border Color – Choose a border color for inactive icons (only for Square and Circle types).
  • Border Active Color – Choose a border color for active icons (only for Square and Circle types).

Line Graph

If you wish to present your information in a more mathematical way, the Line Graph is a great choice.

  • Type – You can choose whether your line graph will have rounded or sharp edges.
  • Width – Enter a width for the line graph (in pixels).
  • Height – Enter a height for the line graph (in pixels).
  • Custom Color – Choose a color for the x and y axis values.
  • Scale Steps – Enter the number of steps which will appear on the y axis.
  • Scale Step Width – You can enter the difference between two y axis steps here.
  • Labels – Enter labels, separated by commas, for the x axis values here.
  • Content – In this section, you can edit parts of the line graph—colors, legend labels, and data points.

Mikado Pricing Tables

Pricing Tables are a great way to present your business' pricing packages.

  • Columns - Choose the number of pricing tables you want to display in a row.

Once you've added the Pricing Table holder, you can add pricing table elements inside it, and edit the following fields:

  • Title – Set a title for your pricing table.
  • Title Color – Set a color for the title.
  • Title Small Separator – Choose whether you would like to display a small separator in your pricing table.
    • Title Separator Color – Set a color for your separator.
  • Title Background Color – Set a background color for your pricing table title.
  • Price - Enter the price.
  • Price Font Weight – You can set the boldness of the price font.
  • Currency – Enter a currency symbol.
  • Price Period – Set a billing frequency (monthly, yearly, etc.).
  • Button Text – Enter button text here.
    • Button Link – Set a link for your button.
      • Button Target – You can choose where the link will open.
    • Button Color – Set a color for your button text.
    • Button Background Color – Set a background color for your button.
  • Active – If you want to emphasize this pricing table, turn this option on.
    • Active Text – Input some text for the active pricing table.
    • Active Text Color – Choose a color for the active label ("Best Choice") text.
    • Active Text Background Color – Choose a color for the active text background.
  • Content Text Color – Set a color for your content text.
  • Content Background Color – Set a background color for your content.
  • Pricing Table Background Image – Set a background image for the pricing table.
  • Content – List your pricing plan features here. You can optionally stylize them using the built-in text editor.

Custom Font

If you need to use text styling that's not in one of the predefined heading or paragraph styles, you can do this by using the Custom Font shortcode.

  • Font Family – Enter a font family name from the large Google font collection (previously selected in Mikado Settings > General > Design Style > Font Family) or some of the system fonts (Arial, Verdana, Times New Roman).
  • Font Size (px) – Enter font size here (in pixels).
  • Line Height – Enter the line height.
  • Font Style – Choose between normal and italic font styles.
  • Text Align – Set the alignment for your text.
  • Font Weight – Set a font weight for your text.
  • Color – Set a color for your text.
  • Text Decoration – You can choose the Underline, Overline, or Line Through text decoration style.
  • Text Shadow – You can enable a text drop shadow.
  • Letter Spacing – Set letter spacing for your text.
  • Background Color – Choose a background color for your text.
  • Padding (px) – You can enter padding for the text in a top, right, bottom, left format (ex.: "10px 20px 10px 20px").
  • Margin (px) – You can enter the margin for the text in a top, right, bottom, left format (ex.: "10px 20px 10px 20px").
  • Show in Border Box – Choose to display the text in a border box.
    • Border Color – Set a color for your border.
    • Border Thickness(px) – Set the thickness for your border.
    • Text Background Color – Set a background color for your text in border box.
    • Text Padding (px) – Set a padding for your text in border box. You can enter padding for the text in a top, right, bottom, left format (ex.: "10px 20px 10px 20px").
  • Content – Enter your content here.

List – Ordered

Lists are a great way to organize information and present it to potential customers.

List – Unordered

Lists are a great way to organize information and present it to potential customers.

Icon

Icons are great for communicating all sorts of information.

Social Icons

Want to invite your viewers to follow you on social networks? Social Icons will make this easy.

Icon With Text

This shortcode allows you to easily add icons with text to your page.

Latest Post

This shortcode allows you to display your latest blog posts on a page.

Interactive Banners

The Interactive Banners element allows you to display interactive images.

Image With Text and Icon

Display an image with text and an icon over it.

Image Hover

Image Hover allows you to display interactive images.

Team

This shortcode allows you to easily present your team.

Service Table

They're a great way to present the services your business offers.

Mikado Image Slider

The Mikado Image slider provides a great way to showcase your portfolio.

The interactive gallery provides a great way to display collections of images on your page, using one image as a feature image, which when clicked on opens a lightbox with the rest of the images you have specified.

  • Featured Image – Set the featured image for your gallery.
  • Type – Choose between "Image Gallery" and "With Link in Bottom" types.
  • Images – Set your images for the gallery.
  • Link – Set the link you would like the title to lead to (only when using the "With Link in Bottom" type).
    • Target Link – Set a target for your link:
      • Self – it opens in the same tab the user was on.
      • Blank – it opens in a new tab.
  • Text – Set the text to be displayed at the bottom of your featured image.
    • Text Font Family – Set the font family for your text.
    • Text Font Weight – Set the font weight for your text.
    • Text Font Style – You can choose between "normal" and "italic" font styles.
    • Text Color – Set the color for your text.
    • Text Font Size (px) – Set the font size for your text.
  • Layer Color – Set a color for the layer on the bottom of the featured image.

Countdown

The countdown element provides a great way to display a countdown timer on your page.

  • Year – Set the year you would like to countdown to.
  • Month – Set the month you would like to countdown to.
  • Day – Set the day you would like to countdown to.
  • Hour – Set the hour you would like to countdown to.
  • Minute – Set the minute you would like to countdown to.
  • Month Label – Set a label to be displayed beneath the month.
  • Day Label – Set a label to be displayed beneath the day.
  • Hour Label – Set a label to be displayed beneath the hour.
  • Minute Label – Set a label to be displayed beneath the minute.
  • Second Label – Set a label to be displayed beneath the second.
  • Color – Set the color for digits, labels and separators.
  • Digit Font Size(px) – Set a font size for your digits.
  • Label Font Size (px) – Set a font size for your labels.
  • Font Weight – Set a font weight for digits and labels.
  • Separator – Select whether you would like to display a separator.

Separator With Icon

Display a separator with an icon on your page.

  • Color – Set a color for the separator.
  • Border Style – Choose a border style for your separator.
  • Width (px) – Set a width for your separator.
  • Thickness – Set a thickness for your separator (in pixels).
  • Top Margin – Set a top margin for your separator.
  • Bottom Margin – Set a bottom margin for your separator.
  • Icon Pack – Choose an icon pack to use.
  • Icon – Set the icon you would like displayed.
  • Icon Custom Size (px) – Set a custom size for the icon.
  • Type – You can choose between "normal", "circle", and "square" icon types.
  • Icon Border Radius – Set a border radius for the "circle" and "square" icon types.
  • Shape Size (px) – Set a shape size for the "circle" and "square" icon types.
  • Icon Color – Set a color for the icon.
  • Border Color – Set a border color for the icon.
  • Icon Border Width – Set a width for the icon border.
  • Icon Background Color – Set a background color for the icon.
  • Hover Icon Color – Set a hover color for the icon.
  • Icon Hover Border Color – Set a hover color for the icon border.
  • Icon Hover Background Color – Set a hover color for the icon background.

Blog Slider

  • Image size – Set the proportions you would like blog images to display in.
  • Order By – Select how to order your blog posts. Blog posts can be ordered by Menu Order, Title, or Date.
  • Order – Choose between ascending and descending order.
  • Number – Set the number of blog posts to display in the blog slider.
  • Number of Blog Posts Shown – Choose number of posts that will display across full width of the screen (less will be shown on smaller screens, due to responsiveness).
  • Category – If you would like to display only certain posts in the blog slider, input the category slugs of the categories you would like to display in this field, delimited by commas. Leave the field empty to display all categories.
  • Selected Projects – If you would like to display only certain posts in the blog slider, enter the IDs of those posts here.
  • Info Box Hover Color – Set a hover color for the posts.
  • Show Category Names – Select whether you would like to display category names on your blog slider.
    • Category Name Color – Set a color for your category names.
  • Show Date – Choose "Yes" if you wish the date to be displayed.
    • Date Color – Set a color for the date.
  • Title Tag – Set the heading tag for the post title.
  • Title Color – Set the color for the title.
  • Prev/Next navigation – Select whether you would like the previous and next navigation to be displayed.
  • Additional class – If you wish to style this particular blog slider differently, you can use this field to add an extra class name to it and then refer to that class name in your css file.

Mikado Clients

This shortcode allows you to quickly make a display of your clients.

  • Columns – Select the number of clients you would like to display in one row.
  • Show borders – Select whether to show borders around the columns.

Once you've added the Mikad Clients holder, you can add elements inside it, and edit the following fields:

  • Image – Choose your client image here.
  • Link – Enter full URL for the image link.
  • Link Target – Set a target for your link:
    • Self – it opens in the same tab the user was on.
    • Blank – it opens in a new tab.

Animated Icons With Text

The icons flip and text is revealed once viewers hover over the icons.

Once you've added the Animated Icons with Text holder, you can add elements inside it, and edit the following fields:

Mikado Process Holder

This is a great way to let potential customers find out more about what your business does, and how it does it.

Once you've added the Mikado Process Holder, you can add process items inside it and edit the following fields:

Mikado Pricing List

The pricing list shortcode allows you to easily present your prices.

Once you've added the Mikado Pricing List holder, you can add Pricing List Items inside it, and edit the following fields:

Mikado Elements Holder

The Mikado Elements Holder allows you to display any combination of elements in an organized column structure.

In the “Width and Responsiveness” tab, you can choose at what stage the element will switch to one column, and set an alignment for responsive mode.

Once you've added the Mikado Elements Holder, you can add Elements Holder Items, and edit the following fields:

In the “Width and Responsiveness” tab, you can set different padding values for your element holder items on different screen sizes.

Mikado Vertical Split Slider

The vertical split slider provides a way to create split slides on your screen, whose left and right side items transition into the screen from the top and bottom, respectively, and then come together to display a complete image.
 
To create a vertical split slider, you first have to add the Vertical Split Slider element to your page and select a background color for its preloader screen.
 
After you have added the Vertical Split Slider element, you need to add a Left Sliding Panel and Right Sliding panel into it.
 
Then, in each sliding panel, you need to add a Slide Content Item, and set the following options:

BuddyPress Groups

You can use this shortcode to display BuddyPress groups on your pages.

BuddyPress Activities

You can use this shortcode to display BuddyPress activites on your pages.

Mikado One comes with WooCommerce integration, which allows you to easily create an online shop. For more information on installing and configuring WooCommerce, please visit this page:

http://docs.woothemes.com/documentation/plugins/woocommerce/getting-started/

In order to set up WooCommerce with the Mikado One theme, follow these steps:

  1. Navigate to Plugins > Add New from the admin panel.
  2. Type “WooCommerce” in the search field.
  3. Locate "WooCommerce - excelling eCommerce" in the search results and click on "Install Now".

    Plugins > Add NewInstall WooCommerce

  4. Once the installation has completed, click on “Activate Plugin”.
  5. You will now see a notice saying “Welcome to WooCommerce – You're almost ready to start selling :)". If you plan on importing demo content, click on "Skip Setup". Otherwise, click "Install Pages".
  6. If you plan on importing demo content, you should first set the product image sizes in order to achieve the same look as on our demo sites. Go to WooCommerce > Settings and click the "Products" tab.

    WooCommerce > SettingsSettings > Products

    Under the section "Product Image Sizes", enter the same values that we did:

    Handmade Jewelry I Demo

    Handmade Jewelry I

    Handmade Jewelry II Demo

    Handmade Jewelry II

    Retailer Demo

    Retailer

    Urban Wear Demo

    Urban Wear

    Note: if you wish to modify these sizes at a later date, you may need to regenerate thumbnails in order for it to take effect. This can be done with the following plugin: http://wordpress.org/plugins/regenerate-thumbnails/.
  7. See Importing Demo Content in the Getting Started section of this user guide and perform the process explained there.
  8. Go into the backend of your shop page. This can either be a custom page you have created yourself, or the shop page from the demo site that you have imported. Under "Page Attributes", choose the WooCommerce template.

    WooCommerce Template

Mikado One comes with BuddyPress integration, which allows you to use social-network features like user profiles, activity streams, user groups, and more. For more information on installing and configuring BuddyPress, please visit this page:
 
https://codex.buddypress.org/getting-started/
 
Please note that when BuddyPress is active, Ajax page transitions are automatically disabled.
 
Mikado One comes with Contact Form 7 integration, makes it possible to create forms for various purposes.
 
In order to setup Contact Form 7, please perform the following steps: 
  1. Go to Plugins > Add New from the admin panel.
  2. Type "Contact Form 7" in the search field.
  3. Locate "Contact Form 7" in the search results and click on "Install Now".

    Plugins > Add NewInstall Contact Form 7

  4. Once installation is complete, click on "Activate Plugin".

Now when you use Visual Composer, you will see a new shortcode in the list of shortcodes – the Contact Form 7.

Contact Form 7 Shortcode

Click on this shortcode to add your form. There are several fields to fill in:

Note: For more information on defining Contact Form styles, see the Mikado Settings > Contact Form 7 section of this user guide.
You can read more about the Contact Form 7 plugin at https://wordpress.org/plugins/contact-form-7/.

3rd Party Integration

If you wish to integrate a newsletter sending service, you need to additionally install a plugin called "Forms: 3rd-Party Integration." You can check out the link to their site here: https://wordpress.org/plugins/forms-3rdparty-integration/.

Install 3rd-Party Integration

Once you've completed the installation process and activated this plugin, navigate to Contact > 3rdparty Services from the admin panel in order to set options. For more information on setting it up, check out the following link: https://wordpress.org/plugins/forms-3rdparty-integration/screenshots/.

Mikado 3 - Muscle

The Muscle demo features:

Mikado 4 - Prayer

The Prayer demo features:

Mikado 5 - Stylist

The Stylist demo features:

Mikado 6 - Chocolaterie

The Chocolaterie demo features:

Mikado 7 - Torque

The Torque demo features:

Mikado 8 - Scope

The Scope demo features:

Mikado 9 - Vibrant

The Vibrant demo features:

Mikado 17 - Jam Session

The Jam Session demo features:

Mikado 18 - Sensei

The Sensei demo features:

Mikado 21 - Beatz

The Beatz demo features:

Mikado 24 - Extreme

The Extreme demo features:

Mikado 27 - Carlo

The Carlo demo features:

Mikado 29 - Gourmet

The Gourmet demo features:

Mikado 32 - Storefront

The Storefront demo features:

Mikado 33 - Explorer

The Explorer demo features:

Mikado 34 - Askew

The Askew demo features:

Mikado 36 - Leather

The Leather demo features:

Mikado 37 - Adventurer

The Adventurer demo features:

Mikado 40 - Spice

The Spice demo features:

Mikado 43 - Desk

The Desk demo features:

Mikado 50 - Mint

The Mint demo features:

Mikado 51 - Lightbulb

The Lightbulb demo features:

Mikado 52 - Titan

The Titan demo features:

Mikado 58 - Opening Day

The Opening Day demo features:

Mikado 59 - Countdown

The Countdown demo features:

Mikado 60 - Reflect

The Reflect demo features:

Mikado 68 - Storm

The Storm demo features:

Mikado 69 - Craft

The Craft demo features:

Mikado 72 - Wilderness

The Wilderness demo features:

Mikado 73 - Construct

The Construct demo features:

Mikado 75 - Metallic

The Metallic demo features:

Mikado 78 - Estate

The Estate demo features:

Mikado 81 - Futura

The Futura demo features:

Mikado 86 - Croissant

The Croissant demo features:

Mikado 92 - City Lights

The City Lights demo features:

Mikado 94 - Organic

The Organic demo features:

Mikado 98 - RePrint

The RePrint demo features: