“Mozgaration Wordpress Theme” Documentation by “KILIKO”

“Mozgaration Wordpress Theme”

Created: 18 May, 2017
By: KILIKO
Support: kiliko.themes@gmail.com

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to post your questions on my email: kiliko.themes@gmail.com. Thanks so much!

Table of Contents

Installation

Install the theme

Installing Mozgaration Extensions Plugin and other bundled plugins

Importing demo contents

Import sample widgets

Online Documentation

Theme Customizer

Bundled Plugins

Visual Composer

JavaScript and CSS

Sources and Credits

Version History

A) Installation - top

A1) Installing the theme
Upon downloading the .zip file from themeforest.net you'll have all files inside the theme package. Do not upload the entire file you get from ThemeForest, upload only the mozgaration folder.

There are two ways to upload a theme;

1) Upload By FTP: Login your hosting space via an FTP software and upload the theme folder into wp-content/themes/ under your wordpress installation. Once you've uploaded the theme you can open Open WordPress Admin → Appearance→ Themes page and activate the theme from list.

2) Upload By Wordpress Admin:

Open WordPress Admin → Appearance→ Themes

Click Install Themes tab and hit upload link

Find the mozgaration.zip file and hit install now button

Open WordPress Admin → Appearance→ Themes page and activate the theme from list.

A2) Installing Mozgaration Extensions Plugin and other bundled plugins

Install Mozgaration Extensions plugin to the have Portfolio, Services, Product Showcase, Testimonials, Team custom posts types and shortcodes that created for the theme.

Install Visual Composer plugin to add drag and drop page builder

Once you activated the theme you'll be notified with a message like shown below and you can install the plugin by clicking the 'Begin installing plugins' link.

Note : If it is a WPMS ( WordPress Multi Site ) install, you must upload the plugins by manully via FTP or Plugins page of your Network Admin. The plugins can be found as seperate zip files inside mozgaration ▸ mozg-framework ▸ plugins folder. (unzip mozgaration.zip first)

A3) Importing Demo Contents

Note : If you would like to import Portfolio, Services, Product Showcase, Testimonials, Team related posts and media you must active Mozgaration Extensions Plugin and for WooCommerce you must active WooCommerce Plugin before start the importing process.
This step is optional. We created some sample content for you and which you can import by the use of the wordpress import system. The sample content is a excerpt of some of the content and examples used in the demo website of Mozgaration.

Note : the wordpress import plugin needs to be installed and activated. You also need to know where the sample-content xml file is located that comes with the theme (downloaded from Themeforest)

Go Tools → Import, click WordPress

Click browse button and find the XML file on your computer. It is located in the “Demo Contents” folder that becomes available in one of the subfolders after unpacking the Mozgaration zipfile downloaded from ThemeForest.

Hit “Upload file and import” button and follow the screen instructions.

Make sure to reassign the posts which you are about to import to the correct Admin or Author name.

Make sure to check “Download and import file attachments” checkbox

A5) Import sample widgets

This step is optional. You can import the widgets that used for the demo. Before start you'll need to install this plugin https://wordpress.org/plugins/widget-importer-exporter/

Go Tools → 'Widget Importer & Exporter', click the ' Browse' button to find the 'wie' file from your computer . It is located in the “Demo Contents” folder that becomes available in one of the subfolders after unpacking the Mozgaration zipfile downloaded from ThemeForest.

Hit “Import Widgets” button to import the slider.

B) Online Documentation- top

You can find detailed instruction about this theme in our documentation website at http://mozgaration.ru/documentation/

C) Theme Customizer- top

Mozgaration uses the wordpress customizer to change the theme settings. This gives one the ability to see in the backend what you are changing and how it looks in the front of your website.

The Customizer can be accesed in two different ways :

Through the WordPress Admin Area –> Appearance –> Customize menu option (see number 1 image below)

Through the WordPress Admin Area –> Customize Menu (ability added by Mozgaration)

Access the Theme Customizer / Settings

Import Theme settings

Export the current theme settings to a txt file.

Reset all Theme settings to default. Note : All your settings will be erased

Both Customize Menu options (1) bring you to the same area where you can visually adjust the theme settings and which looks like this:

In the customizer you can adjust all the theme settings and see the results on the preview screen right of the settings (In RTL mode : of course on the left size).

Note : For some settings a highlight area will be visible in the preview window ony if that area is in the visible part of your screen. I could mean that you need to scroll the preview area to actually see the setting you are adjusting.

D) Bundled Plugins- top

The Mozgaration comes bundled plugins for which we have bought valid extended licenses.

The Visual composer

Things you should know and be aware of :

The Page content can be completely build in a visual design mode. This means what you see is what you get and you drag and drop elements into its place. Each element has its own settings panels and can be adjusted the way you want it to be. But the visual composer plugin has to be activated for this in order to have that ability.

The visual composer documentation can be fould here : Visual Composer Documentation
The visual composer video tutorials can be found here : Visual Composer video tutorials

We update these plugins to their latest versions when the theme updates.

If you want support on how these plugins work above documentation is a very good guidance. If you have issues with these plugins and want support from the developers who build these plugins you need to buy a valid license of these plugins. We fix issues with these plugins within our theme. We make them work and keep them working. We don’t fix issues, nor can we support that, which are within the plugin itself nor can we teach you how these plugins work. It is a learning curve in which you as a user has to invest your own time.

E) Visual Composer - top

Mozgaration comes with a plugin called Visual Composer.

The Visual Composer plugin can operate in two modes:

Classic Editor mode. Which is like the normal way wordpress presents its editor (In this “normal editor mode” one has two modes : visual mode and text mode. The latter is what we call html mode)

Backend Editor mode. The visual mode of the visual composer plugin in which you can add elements into a page and drag and drop them around where you want to have them. You can adjust each elements settings by the elements edit button.

Note : You can switch between the classic mode and backend mode without any problems. But be aware that once you start editing the shortcodes in classic mode that you do this correctly as unclosed shortcodes can cause issues in how you page will look in the front of your website.

Visual mode or Backend Mode of the Page

How to get into the visual mode of a page where you insert and drag around elements?

Open the page and switch to visual composer design mode by clicking the blue button with the text Backend Editor.

You will see something like this.

How to get into the classic mode of a page where you insert code like text?

Open the page and switch to visual composer design mode by clicking the blue button with the text Backend Editor.

You will see something like this.

Note : Visual composer rows does not work as fullwidth when used in single product pages. Its by design that they cant work.

Visual Composer add a Element

In a clean page you have to start with adding a element to your page content. Below are the steps on how todo this:

Click on add element:

Then in the popup window choose f.e. the MOZG Blog Post Element.

After Choosing That element a new window will popup with settings you can adjust for the chozen element.

Adjust the settings the way you want you blog list to be and save the settings.

You will return to the visual page mode editor and will see something that looks like this.

Note : After One Elements is added the Editor looks a bit different and you then can add new elements by use of the PLUS Signs.

The Visual Composer Screen.

When you open a page and you have The Visual Composer plugin in visual mode there are a lot of elements and settings one needs to be aware off

The Visual composer Toggle button two switch between the normal wordpress editor and the Visual Composer Editor.

The Add New Element to the row. A dialog window will open in which on can select a new element. After which another dialog appears with all the settings that can be set for the new element.

The Template button. You can save or load a page design as a template by this button. This way you dont have to redesign all elements and its settings again, but you can recall it with one click.

Drag a Row into another place.

Change the Row Columns.

Add a new Column. A dialog window will open in which on can adjust the settings for the new column.

Add a new (different) Element (Module) before the selected. A dialog window will open in which on can select a new element. After which another dialog appears with all the settings that can be set for the new element.

Edit This Column. A dialog window will open with all the settings that can be changed / adjusted.

Delete this Column including all its elements.

Open or close (collapse) this Row.

Edit the settings of this row. A dialog window will open with all the settings that can be changed / adjusted.

Clone the current row into a new one.

Delete the current row and all of its content.

Custom Css Box to add your custom css for this page.

Move the element within the colund and / or row.

Add en new element (module) after the selected one. A dialog window will open in which on can select a new element. After which another dialog appears with all the settings that can be set for the new element.

Edit the selected element (module) settings. A dialog window will open with all the settings that can be changed / adjusted.

Clone / Duplicate the current element (module) within the row or column.

Delete the select element.

The Add New Element to the row. A dialog window will open in which on can select a new element. After which another dialog appears with all the settings that can be set for the new element.

Visual Composer Documentation.

The visual composer documentation can be fould here : Visual Composer Documentation
The visual composer video tutorials can be found here : Visual Composer video tutorials

Back To Top

E) JavaScript and CSS - top

This theme imports these Javascript files.

jquery (version that comes with wordpress) /js/pace.js
/js/modernizr.min.js
/js/bootstrap.min.js
/js/isotope.pkgd.min.js
/js/imagesloaded.min.js
/js/owl.carousel.min.js
/js/jflickrfeed.min.js
/js/customselect.min.js
/js/lightbox/js/jackbox-packed.min.js
/js/placeholders.min.js
/js/waypoints.min.js
/js/scripts.js
/js/lightbox/js/jackbox-packed.min.js

jQuery http://jquery.com

jQuery Flickr by Joel Sutherland http://www.newmediacampaigns.com/page/jquery-flickr-plugin

jQuery customSelect by Adam Coulombe - http://adam.co/lab/jquery/customselect/

jQuery OwlCarousel by Bartosz Wojciechowski - http://www.owlgraphic.com/owlcarousel

imagesLoaded by David DeSandro https://github.com/desandro/imagesloaded

Bootstrap by Twitter Inc. http://getbootstrap.com/

Pace by HubSpot, Inc. http://github.hubspot.com/pace/docs/welcome/

Modernizr http://www.modernizr.com/

jQuery Waypoints by Caleb Troughton https://github.com/imakewebthings/jquery-waypoints/blob/master/licenses.txt

script.js by Kiliko

This theme imports these CSS files.

/css/bootstrap.css
/css/fontello/css/fontello.css
/css/style.css
/css/owl-carousel.css
/js/lightbox/css/jackbox.min.css
/css/rtl.css
/css/woocommerce/mozg-woocommerce.css
/css/woocommerce/mozg-woocommerce-rtl.css

style.css, rtl.css, mozg-woocommerce.css, mozg-woocommerce-rtl.css by Kiliko

bootsrap.css - by Twitter Inc. http://getbootstrap.com/

owl-carousel.css -by Bartosz Wojciechowski - http://www.owlgraphic.com/owlcarousel

jackbox.min.css - part of jackbox plugin
fontello.css by http://fontello.com/

F) Sources and Credits - top

Included Free Items (other than the jQuery plugins that listed under the JavaScript title.)

Font Icons by http://fontello.com/

Miu icons http://linhpham.me/miu/ icons → iconsCreated by Linh Pham.

Feather icons byhttp://colebemis.com/feather/

FREE ITEMS
49 vector (SVG) icons by Zlatko Najdenovski https://www.iconfinder.com/iconsets/miscellaneous-31
https://stocksnap.io/photo/NFQXL48U22
https://stocksnap.io/photo/JVSII4KCCK
https://stocksnap.io/photo/5ZMT04MIW6
https://stocksnap.io/photo/MWVZ2HPTP0
https://stocksnap.io/photo/3H21KUXVT4
https://stocksnap.io/photo/Q4D99NWK6T
https://stocksnap.io/photo/SLZRDLFT96
https://stocksnap.io/photo/ZV0YSZWGO6
https://stocksnap.io/photo/RPMT6Y4X8U
https://stocksnap.io/photo/LEJ7HJ5BEA
https://stocksnap.io/photo/7ULJ7GRFDB
https://stocksnap.io/photo/VHXFNKMU96
https://stocksnap.io/photo/ARCKFUOEWN
https://stocksnap.io/photo/W35FN4QNGR
https://stocksnap.io/photo/JZTRVCLRJP
https://stocksnap.io/photo/H62K8TXHVX
https://stocksnap.io/photo/6REQ95CNQ8
https://stocksnap.io/photo/SCC00WCQ3I
https://stocksnap.io/photo/42H3JH8QI5
https://stocksnap.io/photo/J6YJ4W3B48
https://stocksnap.io/photo/EUHWI21QMF
https://stocksnap.io/photo/IACWZFWQPK
https://stocksnap.io/photo/91WZ32J28K
https://stocksnap.io/photo/RCFX768X06
https://stocksnap.io/photo/RCFX768X06

G) Version History - top

You can find the version history (changelog) by visiting the theme dahsboard page on themeforest.net

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

KILIKO

Go To Table of Contents