Colibri Interactive Logo

Manual for Bold. Premium WordPress Theme

First of all: Thank you for purchasing one of our Premium WordPress themes! We really appreciate that and hope you enjoy working with it.

If you want to get news about themeupdates, new releases as well as other important news sign up to our Email newsletter or follow us at Facebook or Twitter.

Please read also our FAQs on topics like:

Table of Content

About this manual

This document describes the abilities of the theme and helps you to set up the themedemo. Please read it carefully and post in our dedicated support forum at http://support.colibri-interactive.com if you have an unanswered question.

Setup: WordPress

Before you can set up this theme you need a working version of WordPress installed. For further information about how to set up WordPress please see the WordPress Codex Website.
The latest version of WordPress is available for download at: https://WordPress.org.

Setup: Theme

First you need to upload the theme files and then activate it.

To upload the files you can choose between uploading the files with a FTP application and the WordPress Uploader.

FTP Application
Upload the unzipped theme files via an FTP application to your server into your WordPress installation to /wp-content/themes.

WordPress Uploader
Alternatively, you can use the WordPress Uploader you'll find at Appearance > Themes > Add New > Upload Theme. Then click the browse button and select the theme zip file. After that click 'Install Now.

Please note: If you get the error that the style.css file can not be found you have uploaded the wrong zip file. Please make sure that you're uploading the theme zip file and not the "complete theme pack" zip file! If you've downloaded the theme pack zip file you need to unzip it first and use the theme zip file which is included.


Activate the theme
To activate the theme navigate to Appearance > Themes, hover the themes thumbnail and click Activate.

Install required & recommended Plugins
After the activation of the theme the "Plugin Installation Notification Dashboard" will appear at the top of every page in the backend. It notifies you of required and recommended plugins to get the best out of the theme and helps you to install and activate them.
Click on > Begin installing plugins. Tick all plugins and select from the dropdown "Bulk Actions" the "Install" option, then click on > Apply. The download and installation of the plugins can take a moment, depending on your server. Please be patience.

When all plugins are installed you need to activate them to use them. Click the link >Return to Required Plugin Installer, at the bottom of the page. Tick all plugins again and select the "Activate option from the dropdown", then click >Apply.

The theme is completely set up now and you can start adding your own content or follow the instructions to setup one of our themedemos.
If you're not familiar with WordPress we recommend to setup a themedemo and replace its content with yours afterwards.

Setup: Themedemo

To set up the themedemo you need to install three plugins. Click here to read how to install a plugin.
One is to import the content of the themedemo such as pages, the navigation and the products, the second is to import the content of the widgets used in the themedemo and the third is to import the settings of the customization page such as colors etc.
Please install the WordPress Importer, the Widget Importer & Exporter and the Customizer Export/Import plugin.

The democontent can be found in the "All files & documentation" version of the theme. You can redownload the theme at any time from your download page at Themeforest. Unzip that file and look for the folder "themedemo-content". In there you will find each of the themedemos in separate subfolders. If you're using a fresh WordPress with demo content you have some default widgets that we need to remove first. Navigate to > Appearance > Widgets and remove all widgets from all widget areas.

Importing the content
After the installation of the above mentioned plugins navigate to > Tools > Import and click on 'WordPress' in the list of import tools. On the next page click the browse button and select the content.xml file that came with the theme. Then click on 'Upload file and import'. Tick the checkboxes to download the media and assign the users to your one. Downloading all the media can take a while so please be patient. Please don't navigate away from the page until you see the message that the import was successfull!

Importing widgetsettings
To install the widget content go to > Tools > Widget Importer & Exporter and click the browse button to select the widgets.wie file that came with this theme. Then click the 'Import Widgets' button.

Import the customization settings
Last, navigate to > Appearance > Customize and open the section "Export/Import" at the bottom of the sidebar. Then select the customize-settings.dat file of the demo you want to import, tick the "Download and import images files?" option and click on > Import.

Assign menus
Unfortunately, you have to assign the menus manually. If your themedemo has a extended header (content above the logo and mainmenu) navigate to > Appearance > Widgets, open the "Header Right" widget area and assign the menus "shopmenu" and "languageswitch" via the dropdown to the Custom Menu widget.
Then assign the mainmenu by navigationg to > Appearance > Menus, select the "mainmenu" from the dropdown at the top and click >Select. When the menu is visible on the right scrol down to the end of the page an tick the checkbox for "Main Menu" to assign this menu to the main menu position. Then save your settings by clicking >Save Menu.

Setting the homepage & blog
To set the startpage and the blog page navigate to > Settings > Reading and click the radio button for 'A static page'. Then select the 'Home' page in the Front page dropdown and the page 'Blog' from the Post page dropdown. Then click 'Save Changes'.

Importing the Revolution Slides
If you want to import the slides of the Revolution Slider too, close the customizer (via the X at the top left corner), and navigate to >Revolution Slider. Then click on > Import Slider and select the sliders .zip file that you can find in the demo content folder too.

Hint: Assign WooCommerce pages
Please note: When you've imported the shop pages too and installed & activated the WooCommerce plug in for the shop make sure you assign the page "Shop" at > WooCommerce >Settings > Product tab > Display to the "Shop Page". Just select the page "Shop" from the dropdown.
The details to set up the rest of the WooCommerce can be seen here.

Themesettings

The theme settings give you the opportunity to change the appearance of the theme and to customize it to your needs. Navigate to > Appearance > Customize to open the customization panel.

Please note:

Menus


General Settings


Header Settings


Color Scheme


Social Networks

Enter the full URL to your account to show a linked icon of the service in the header of your page.
Make sure you don't miss the http:// at the beginning of the URL, otherwise the link will not work! E.g: http://twitter.com/colibrithemes
Leave the field of a network empty to hide it's icon.

Custom Code


Shop Settings


Catalogue Settings

The catalogue settings come in handy when you want to use the WooCommerce plugin to create, manage and display products but without the option for users to purchase them.

Footer Settings

Setup of the navigation

This theme comes with one menu:
To set up the menu navigate to Appearance > Menus. Click the 'Create a new menu' button at the top and enter a menu name for the menu, than click Create Menu. After that you have to assign it to the positions you want it to appear at. If you're importing the themedemo content the mainmenu will also be imported and you only need to assign it to the Primary Menu position.

Use the Main Menu location for your main navigation.

To add pages to your navigation tick the checkboxes at the pages (in the 'Pages' Box) that you have already created. Then click the 'Add to Menu' button. To generate a sub-navigation element drag it below the parent element and a bit to the right. It will snap in as a child of the parent navigation element. See http://support.WordPress.com/menus/ for further details.

Please note: You can always create more menus and display them with the 'Custom Menu' widget on the widget page. Use this for example to create a special shop menu in the extended header with elements like "Whishlist"and "Login / My Account".

Megamenu

The theme comes with a mega menu which lets you create a "drop down" navigation that has up four columns.
To activate it make sure you've enabled the "CSS Classes" for the pages. To do so, open the "Screen Option" panel in the upper right corner of your wordpress. Then make sure the "CSS Classes" option is ticked. If the option is enabled you will find an input field "CSS Classes (optional)" at every page when you open it's attributes.

To enable the megamenu option for this page add the class ci-megamenu. Additionaly add the class to set the number of columns. ci-col-1, ci-col-2, ci-col-3 or ci-col-4. Seperate both classes with a space. So the classes to enable the mega menu and mace it 4 columns would look like this: ci-megamenu ci-col-4
Each subpage one level below the current page will be used as a headline for a column. Subpages of this page will be shown as content of the column.

Setup of the blog

To set up the blog page navigate to Pages > Add New. You can name it as you like and give it any content. Then navigate to Settings > Reading, select 'A static Page' and select the page you have just created as 'Posts page'. If you've imported the democontent, a page named 'Blog' is already created and you only need to assign it as described before.

To add a new blog post navigate to Posts > Add New. Give it the name you like and insert your content. If you want to display an image in the list of posts add it as featured image. To set up the featured image click 'Set featured image' and select an image from your Media Library or upload a new one. Click 'Use as featured image' to use it as featured image for the blog post. It is best to use featured images with a dimension of at least 900px width.

To add a Rev Slider or Video add the Rev Slider shortcode or YouTube/Vimeo embed code in the field for the "Postheader Content". It will then replace a featured image if both are set.

Multilingual

The theme is prepared to be translated into different languages and comes with .mo and .po files for easier translation. If you plan to translate all of the theme from english to just one other language you can follow the standard way of translating a WordPress theme. No extra Plugins are required.

If you're planing to translate the theme to more than one language to use them simultaniously you need a 3rd party plugin that does not come with the theme. We recommend to use the very popular and famous WPML plugin that we've used for the development too.
Please note, that there are hundreds of translation plugins available on the internet we can't support you with further details on how to set them up correctly.

WooCommerce

If you want to use the shop functionality of the theme you need to install the WooCommerce plugin. Read here if you don't know how.

Please set up the WooCommerce plugin according to its manual and make sure you've selected the right page (e.g. "Shop") from the "Shop Page" dropdown. You find this at > WooCommerce > Settings > Products tab > Display.

Furthermore, you need to set the pages for the cart page, checkout page and the terms and conditions. This can be done at > WooCommerce > Settings > Checkout tab.

Please note: If you set up WooCommerce with the WooCommerce wizard AND import the democontent of the theme, you will have some pages used for the shop twice. This can lead to confusion as ther will be zwo pages called 'Shop' but WooCommerce will use another shop page to setup the shop as we've linked in the predefined navigation - due to technical reasons.
Please remove the duplicated pages manually via > Page and make sure the correct pages (Shop, Cart, Wishlist, Checkout, Terms & Conditions) are assigned in the WooCommerce Settings.

The only theme specific setting are the image sizes.

Image Sizes
To set the theme specific image sizes make sure you have installed the WooCommerce plugin. Then navigate to > WooCommerce > Settings, click the 'Products' tab and select the "Display" category. Set the following:

Catalogue Images: 570 x 570 - Check the 'Hard Crop' option (if you don't want to support HiDPI screens 285 x 285 'Hard Crop' is fine too)
Single Product Images: 650 x - 650 Check the 'Hard Crop' option
Product Thumbnails: 90 x 90 - Check the 'Hard Crop' option

Please note, that WordPress generates images in a new size only when they are uploaded. This means, that when you import images from an existing system or when you install the theme on an existing system you need to regenerate all shop images in the new size. You can easily do that with a plugin like this: Regenerate Thumbnails.

Plugins

To get the most out of the theme we recommend you to use the following plugins. You will also find a notice in the backend that let's you easily install all the required and recommended plugins at once.


Installing Plugins

To install a plugin go to > Plugins > Add New. If you already have a file with that plugin, click Upload at the top. Then hit the Browse button, select the .zip file you've downloaded and click 'Install Now'.
After the file has been uploaded to your server you have to activate it by clicking Activate.
You find the installed Plugins at > Plugins > Installed Plugins. If you want to remove a Plugin you have to click the Deactivate button of that plugin first. After that a Remove button appears.

Widgets

Widgets are little items you can use to display all kind of content in specified areas of your website without writing a single line of code.
Navigate to Appearance > Widgets and drag & drop the widget you like onto the area on the right you want it to appear at. (If accessibility mode is disabled.) Otherwise use the 'Add' button.

Existing widget areas
This theme comes with eight widget areas.

If you have questions that are not answered in this manual post in our Support Forum.