You are on page 1of 31

SETUP GUIDELINE

Attractive, simple and


easy to use.
From now on you can show your ideas, work and everything what pops up in your mind in
a modern, stylish way. Cubus brings you endless customising options that helps you to
perfectly present your work.

2013 by ChilliPear

1 Getting started ...........................................................................................................................1


Introduction ...............................................................................................................................2
1.1 Theme installation ................................................................................................................2
1.2 Plugins installation................................................................................................................3
1.3 Theme options ....................................................................................................................7
1.4 Sample content ...................................................................................................................9
2 Theme parts and settings .........................................................................................................11
2.1 Header & Footer ................................................................................................................11
2.2 Homepage ........................................................................................................................13
2.3 Theme idea .......................................................................................................................14
Portfolio settings ......................................................................................................................16
Page or Post setting ................................................................................................................21
2.4 Page types........................................................................................................................22
2.5 The alignment of the widget to a specific page ....................................................................25
2.6 Shortcodes .......................................................................................................................26
2.7 Widgets ............................................................................................................................27
2.8 Theme SEO support &settings ...........................................................................................27
3 Troubleshooting& FAQ .............................................................................................................28
Revolution slider troubleshooting ...............................................................................................28
With this setting, you can try to experiment and achieve non-conflicting jQuery setting..................28
Icon font .................................................................................................................................28
4 Theme Files and Special Thanks ...............................................................................................30

Introduction
Thank you for your interest in Cubus - Premium ThemeForest theme. This theme is designed for
WordPress system, optimized for the version 3.4 and 3.5. We tested the functionality for the lower
version of WordPress, but for optimal performance and all the features we recommend using mentioned
versions 3.4, or 3.5. If you have questions about the advanced features and functions, please feel free to
contact our support through http://themeforest.net/user/chillipear profile page. Firstly read the
documentation and troubleshooting in detail, our goal is to comment on any possible issues just before
you really need them.

1.1 Theme installation


Even before you start the installation, make sure you have the required version of WordPress (3.4 or 3.5)
installed. The ideal is to have prepared "clean install", so that you can adjust all the theme features when
creating your content and not by the additional adjustment.
When you have a system installed, you can proceed to install the theme. There are two ways to install the
theme:
-

Upload via WordPress installer: In this case Navigate to Appearance > Themes > Install themes
> Upload. From the purchased package select the file from directory theme_to_install and click
on Upload. Subsequently click on Activate.

Upload via FTP: In this case, you can the contents of a zip file located in the directory
"theme_to_install" upload via FTP to the / wp-content/themes. Record your files, including the
parent directory where all the theme files. After the upload of all files in the WordPress backend
click on Appearance > Themes and activate the theme.

After activating the theme will be displayed Cubus theme options on sidebar of Appearance menu.

Before you begin to set the theme, you need to install additional plugins, which are not
necessary to the actual functioning of the theme but extend its functionality.

1.2 Plugins installation


In general to install plugins in WordPress backend Plugins menu, press the "Add new". In the menu Install
plugins select menu Upload and than choose plugin zip package, which is located in the purchase
package in the directory "plugins_to_install". Each plugin packages have number as a name prefix,
meaning the order in which it is recommended to install individual components. This order is not
mandatory, only recommended. Change the order does not affect the functionality and stability of your
WordPress system.
Below we offer an explanation of what the various components serve:

Revolution slider is an extension for interactive sliders (without programming, javascript or CSS
knowledge), which can be placed in theme either as widget or with SHORTCODE. This
extension is purchased for your use, and details can be viewed on website
http://codecanyon.net/item/slider-revolution-responsive-WordPress-plugin/2751380. The
purchased package is shipped with complete package documentation, source files and license.
Package is located in the directory "3rd_party_full_packages".
This extension can be installed using file plugins_to_install/1_revslider.zip

Visual composer forget the complicated shortcodes and knowledge of tags when creating your
content. The content is very easy to create using Visual Composer plugin. With this plugin you
can create paragraphs, place galleries, tabs, buttons, facebook share and like buttons, and
more than 20 different extensions of content. This extension is purchased for your use, and
details can be viewed on website
http://codecanyon.net/item/visual-composer-for-WordPress/242431. The purchased package
is shipped with complete package with documentation, source files and license. Package is
located in the directory "3rd_party_full_packages".

This extension can be installed for the WordPress version 3.5 using File plugins_to_install /
2a_js_composer_WP3.5.zip

If you are using WordPress version 3.4,you must install a plugin from a file
plugins_to_install/2b_js_composer_WP3.4.zip
Once installed please mark in the settings use of editor on all three types of content as follows:

Widget context- Serves for direct the widget to a specific page. So you can for example, create
and place a slider only on homepage, or the other slider on portfolio page, or blog. Also, you can
put modified pages on any of your sites. This context plugin gives a possibility of totally
customized content for all of your pages.
This extension can be installed using file plugins_to_install/3_widget-context.0.7.1.zip.

Page in widget In our theme you can simply compose the content of created "pages" on the
front page, but also on other pages, for example. For placement of these pages are created
widget positions. Plugin "Page in widget" allows you to easily direct specific pages in your
widgets.
This extension can be installed using file plugins_to_install/4_page-in-widget_modified.zip.
The modified file of original widget is included in the purchased package. Therefore, do not
download the widget directly from the site WordPress plugins, but use the supplied installation
file.

Optional ZillaSocial. used to display social icons with links to profile pages on social networks
using the widget with the settings on the main menu.

This extension can be installed using file plugins_to_install/5_zilla-social-1.2.1.zip.


-

Optional - Simple local avatars This extension serves to upload your own photo to WordPress
user profile.

This extension can be installed using file plugins_to_install/6_simple-local-avatars.1.3.1.zip.


-

Optional - Super simple contact form generates SHORTCODE [contact], which can be used
on any page to view the contact form. After completing the plugin sends an e-mail on e-mail
address of the administrator of your installation of WordPress system. Instead of this contact
form, you can install any other system and adapt it to your site design.
This extension can be installed using file
plugins_to_install/7_super-simple-contact-form.1.5.4.zip.

Optional - Rotating Tweets (Twitter widget & shortcode) It is widget, which displays the latest
news from the Twitter account.
This extension can be installed using plugins_to_install/8_rotatingtweets.0.623.zip.

1.3 Theme options

Theme options consists of four basic settings:


-

General settings contains the basic settings, color settings, placement of google analytics
script and switching on the categories on the main page.

Font settings allows you to set fonts, headings, and other text. For these two groups of fonts
you can set different font. Web-safe fonts is recommended to use if you do not load fonts from
the Google Fonts external source. If you decide to use Google Fonts, you can choose from more
than 600 font families. All Google Fonts can be viewed at url http://www.google.com/webfonts

Header settings, Footer settings In this kind of settings you can change the background color
and font in the header and footer. Footer contains 4 widget position which can be added in
Appearance > Widgets.

1.4 Sample content


Sample content is placed as an XML file in the directory sample_content. This XML file contains the
settings of menu, pages, posts and portfolio of demo site. The sample content you can install and then
explore the many settings. However, the import is not perfect, it may happen that it will import links to
demo page. Likewise XML file does not contain settings widget, or slider settings.
Installation of sample content: In the backend of your WordPress installation, choose Tools> Import>
WordPress. If this extension is not installed, click Install now> Activate Plugin & Run Importer. Then select
the XML file from the directory "sample_content" and click on upload. Import options select by using the
following screenshot. It is important to enable the option Download and import file attachments.

10

Basic Theme blueprint

2.1 Header & Footer


Logo Logo placement is on the left side of header. Logo supports two types of definition: normal and
retina. Retina means logo in double definition for devices that use 2x pixel density. For example, if your
logo is 100x50px, for retina devices upload the logo in definition 200x100px. Upload the logo to the
server using the theme Appearance > Cubus theme options> General > Upload logo and Upload logo in
retina resolution.
Menu The Theme supports one menu position called Primary navigation. In Appearance> Menus you
can create a new menu and add menu links into it. Make sure that your menu is assigned to the "Primary
Navigation" in the Theme Locations (Appearance> Menus).

11

Search Displays basic WordPress search.


Colors of header can be change In Appearance > Cubus theme options > Header settings
Footer place 1 4 are widget positions located on the bottom of the page. They dont have to be all
occupied, footer widgets regulate its size depending on how many footer positions are occupied:
-

1 position : 100%
2 positions : 50%
3 positions : 33.3%
4 positions : 25%

Footer colors can be changed in Appearance > Cubus theme options > Footer settings

12

2.2 Homepage

In contrast with every other subpages, has Homepage two extra widget positions and displays portfolio
items with CSS effect.
Homepage slider is the full-width position on the slider placement (optimal Revolution Slider).
Portfolio stream Shows examples of custom post type "portfolio" with CSS effect. These samples are
placed in the fully responsive grid. They have a size 1x, 2x or 1/2x of basic size. Likewise you can edit
what will be displayed on the "front" part of the portfolio item, or on the back side. Number of portfolio
items is defined in Appearance> Cubus theme options> General settings.
13

Page blocks are pages that you can easily put into a widget with "Page in widget" plugin and so create
your own content.

2.3 Theme idea


In addition general settings have its settings and styling each Page / Post / Portfolio. This will ensure not
only the modern styling of your content, but the Pages you can assemble into several Page blocks and
create custom content.
Moreover, by using Visual Composer and Revolution slider you can create interactive content without
effort and use just shortcodes through Drag & Drop.
The main theme idea is creating an interesting content to suit your needs effortlessly.

14

You can fully customize the Posts/Pages/Portfolio, the settings panel you can find below the post's text
editor.

15

Portfolio settings

16

Excerpt
With this text input you can specify the text what is on the back side of the flipped image.

Hide date on portfolio homepage


With this checkbox you can hide/show the date what is in front of the image.

Portfolio title with HTML tags (optional)


With this text input you can specify the portfolio's title. Optionally you can insert HTML code into it.

17

Portfolio background
You can set and choose the post's background. You can choose between a single color background,
gradient background or you can upload an image.
- example of a background image

- example of a gradient background

- example of a single color background

18

Use embed for portfolio (disabling post detail click)

You can show youtube, vimeo, soundcloud or any other service in the portfolio page or homepage. But
showing an embedded object on home page will disable the click to the article.

Portfolio text color


With this input you can specify the text color. A white color (#fff) would look like this:

Post size
With this select menu you can specify the post size, you can choose between 3 sizes:

1x =

19

2x =

1/2x =
Portfolio font and elements color
Select font and elements color - With this input you can specify the font color.
Select negative color to font and elements - With this input you can specify the negative color.

20

Page or Post setting

21

2.4 Page types

Default template

22

Template with sidebar

23

Blog

24

Fluid portfolio

2.5 The alignment of the widget to a specific page


For alignment of a particular widget to the page is used plugin "Widget Context". Please see chapter 1.2
Plugin installation to install this extension.

25

Option: Type in the target URL. Put only one URL per line. You can use an asterisk as a wild card to apply
the rule to an entire category, a year, a month or just a single page. The note under the box gives you
examples:
-

to select front page.


category/peace/* to target all peace category posts
2012/* to target articles written in year 2012.

Click Save. That's it. You're done. Just experiment to get it right.

2.6 Shortcodes

This template uses the Visual Composer instead of writing complicated shortcodes. More on this
extension, you can read on the url http://codecanyon.net/item/visual-composer-for-WordPress/242431
Furthermore, the theme uses a special SHORTCODE to display full-width slider, or other full-width
element in your page.
[fullwidth][ your slider or other element shortcode ][/fullwidth]

26

2.7 Widgets
Cubus Share widget displays share popup window on each page with the option to share via AddThis
service

Cubus Most Read & Cubus Recent posts


These two widgets displays the latest posts added, or most read posts. Widget displays each 5 pieces
of these posts. To change this number, please edit lib/widgets.php and find $args = array(
'numberposts' => 5

2.8 Theme SEO support &settings


The theme works well with extensions for SEO settings. It is recommended to install and use the
extension SEO Ultimate http://WordPress.org/extend/plugins/seo-ultimate/, or WordPress SEO by
Yoast from location http://WordPress.org/extend/plugins/WordPress-seo/

27

Revolution slider troubleshooting


jQuery errors
After installing the Revolution slider, we noticed jQuery errors caused by the use of two versions
simultaneously. The entire template is optimized and debugged against jQuery conflict as follows:
$(document).ready(function(){ ...
Was replaced
jQuery(document).ready(function($){ ...
Your code, or plugin code from other manufacturers you can modify that way, or you can turn on
compatibility in concrete slider settings:
Revolution Slider > concrete slider > Troubleshooting

With this setting, you can try to experiment and achieve non-conflicting jQuery setting.

Icon font
Theme uses Entypo (http://www.entypo.com/) to display the icons.
These fonts are not displayed correctly in the browser Opera mini, IE7, IE8 and some Android 2.x
devices.
On servers that use IIS, it is possible that these fonts will not be displayed correctly. In this case it is
necessary to add the following code to .htaccess file
# Allowaccessfromalldomainsforwebfonts.
# Alternativelyyoucouldonlywhitelistyour
# subdomainslike "subdomain.example.com".
<IfModulemod_headers.c>
<FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$">
Header set Access-Control-Allow-Origin "*"

28

</FilesMatch></IfModule>

Sometimes it may happen that the font will not display correctly in Mozilla Firefox browsers. In this case it
is necessary to add the absolute path of the font to /wp-content/themes/cubus/assets/css/app.css,
line 1336
/* Standard Entypo icons */
@font-face {
font-family: 'EntypoRegular';
src:
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo.eot');
src:
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo.eot?#i
efix') format('embedded-opentype'),
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo.woff')
format('woff'),
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo.ttf')
format('truetype'),
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo.svg#En
typoRegular') format('svg');
font-weight: normal;
font-style: normal;
}
/* SocialEntypoicons */
@font-face {
font-family: 'EntypoSocial';
src:
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo-social
.eot');
src:
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo-social
.eot?#iefix') format('embedded-opentype'),
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo-social
.woff') format('woff'),
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo-social
.ttf') format('truetype'),
url('http://url-to-your-site/wp-content/themes/cubus/assets/css/entypo-social
.svg#EntypoRegular') format('svg');
font-weight: normal;
font-style: normal;
}

29

Theme core

Roots WordPress theme framework - http://www.rootstheme.com/


NHP Theme Options Framework http://leemason.github.com/NHP-Theme-Options-Framework/

Retina.js - http://retinajs.com/
jQuery Library - http://jquery.com/

Modernizr.com - http://modernizr.com/

Flickr plugin http://www.WordPresswise.com/adding-flickr-photos-to-your-WordPress-blog-106

Selectivizr - http://selectivizr.com/

Isotope - http://isotope.metafizzy.co/
Fitvids.js - http://fitvidsjs.com/

Font Awesome - http://fortawesome.github.com/Font-Awesome/

Entypo - http://fortawesome.github.com/Font-Awesome/
AddThis - https://www.addthis.com/

Plugins

Revolution slider http://codecanyon.net/item/slider-revolution-responsive-WordPress-plugin/2751380

Visual composer - http://codecanyon.net/item/visual-composer-for-WordPress/242431

Page in widget - http://WordPress.org/extend/plugins/page-in-widget/


Widget context - http://WordPress.org/extend/plugins/widget-context/
ZillaSocial. - http://www.themezilla.com/plugins/zillasocial/
Simple local avatars - http://WordPress.org/extend/plugins/simple-local-avatars/
Super simple contact form - http://WordPress.org/extend/plugins/super-simple-contact-form/

30

You might also like