PREVRAT

Creative Portfolio & Agency WordPress Theme



Introduction


Created: 03/04/2015
Latest Update: 03/04/2015
By: entiri s.r.o.
Support: http://entiri.ticksy.com

Thank you for purchasing Prevrat theme.
Back to Top

Installation and usage

About prevrat Theme

prevrat is responsive magazine multipurpose WordPress theme suitable for business, agency, companies or individuals. prevrat is retina ready, translation ready, parallax ready and much more. It includes 2 Awesome Sliders (Master Slider and Flex Slider). It is a great way to present your work at the highest level. It is based on popular Twitter Bootstrap 3 framework. This theme uses Visual Composer and the latest HTML5 and CSS3 technologies.

Installation

  1. Upload The Theme
    1. In the WP-Admin interface, navigate to Appearance > Themes
    2. Click Add new theme
    3. Click the Upload theme
    4. Use the file upload field to select the prevrat.zip file (file is located INSIDE the zip file you downloaded)
    5. Click the Install Now button
  2. Activate The Theme
    1. After confirmation of installation, navigate to Appearance > Themes
    2. Locate the prevrat theme in the listing and click its associated Activate link
    3. prevrat is now installed and activated.
  3. Install plugins
    1. Navigate to Appearance > Install plugins
    2. We recommend to check all plugins, and install them. WPBakery Visual Composer and Ultimate VC Addons are required plugins, others are only recommended.
    3. When you have installed the plugins, activate them in Appearance > Install plugins
  4. Import demo data(not necessary but recommended)
    1. In the WP-admin, navigate to Tools > Import
    2. Click WordPress
    3. If you don't have installed importer, click Install now button
    4. Choose a file "prevrat-demo-data.xml" and click Upload file and import
    5. Assign posts of authors to your existing author
    6. You can check the "Download and import file attachments" checkbox, if you want to import images.(Note that import may last longer, if you check this option)
    7. Click Submit
    8. Navigate to Appearance > Menus and set primary menu
Back to Top

WPML

For more information about how to set up WPML plugin, please read this Getting started guide. WPML plugin is not included with the theme.

Theme options

Navigate to 'Theme options' menu to adjust theme settings

General settings

Mobile menu collapse width

Theme options > General settings

Set width of window, at which you want to collapse menu into mobile menu.

Blog template

Theme options > General settings

Set layout for blog listing

Blog template single

Theme options > General settings

Set layout for single blog post

Styling options

Body background color

Theme options > Styling options

Set the background color of the whole page.

Links color option

Theme options > Styling options

Here you can set default and hover color for links.

Header options

Logo

Theme options > Header options

Here you can upload logo for the page.

Here you can set complete design of header bar.

Typography options

You can set font family, font weight, font size and color for body and all headings. You can choose from all Google fonts.

Social networks

Here you can set links to social networks displayed in header. Leave the input blank, if you don't want to display specific icon.

Footer

You can compose Footer with visual composer. First, you need to enable VC for footer. To do so, go to Settings > Visual composer and check 'footer' in 'Content types'. Now you can edit Footer > Footer page.

Portfolio

Items in portfolio are custom post type Portfolio. To add new reference:

  1. Go to Portfolio > Add new
  2. Click "Set featured image"
  3. Choose image from your computer or media library
  4. portfolio page.
  5. Set category of the post.
  6. In 'Portfolio properties' box set:
    • Project link: url of your project
  7. Click "Publish" to save Post

To show portfolio on page, select Portfolio from Content element list in page Visual composer editor.

Team

Team members are custom posts "Team".

To add new team member:

  1. Go to Team > Add new
  2. Click "Set featured image"
  3. Choose image from your computer or media library
  4. In member properties meta box set job and social networks
  5. Click "Publish" to save team member
  6. Edit page where you want team box to be displayed and from shortcode dropdown select 'Our Team'

To show team members on page, select 'Team members' from Content element list in page Visual composer editor.

Slider

Slider contains custom posts "Slider". You can have multiple sliders on your page by creating categories for slider.

To add a new slide:

  1. Go to Slider > Add new
  2. Click "Set featured image"
  3. Choose image from your computer or media library
  4. Set category of slide
  5. Insert text to the content editor
  6. Click "Publish" to save slide

To show slider on page, select 'Posts slider' from Content element list in page Visual composer editor.

Back to Top

Visual Composer

Click Visual composer button in page editor to enable Visual composer.

In the Visual Composer editor mode you'll have "Add element" button, which you should click or drag to the working canvas, to add content block or row to your page. Clicking the "Add element" button will show the content element selection menu. Content blocks are divided into categories (Show all, Content, Social, Structure, WordPress Widgets).

Rows

Rows are used to divide your page into the logic blocks with columns, columns later will hold your content blocks. Rows can be divided into the layouts (eg. 1/2 + 1/2, 1/3 + 1/3 + 1/3, and so on). Your page can have unlimited number of rows. To change row's position, click and drag row's drag handler (top left row's corner) and drag row around (vertical axis). You should set also ID of the section, if you want to connect row with menu item. See navigation.

Columns

Columns are part of the row and they hold your content elements inside them. Columns can be reordered. Click and drag column around (horizontal axis). That way you can group elements in logical groups and then drag them around with your mouse (to re-position).

Content elements

This is a list of available content elements that can be placed on the working canvas or inside of the columns. Think of them as bricks. With those bricks you are building your layout. Most of the content elements have options, to set them click pencil icon. To save changes click save button.

Content elements

Row

You can access options of the row by clicking pencil icon on the right.

Full width - set this option to Yes, if you want full width row. Useful for slider or parallax.

Message box

Toggle

Tabs

Accordion

Posts slider

Slider types:

Flexslider

Button

Progressbar

Icon box

Spacer

Use this for adding vertical space.

Testimonial

Type: with image

Team member

If you want to use this element, you need to have al least 1 team member added in Team menu.

Last portfolio posts

Portfolio

Social icons

Pricing table


Back to Top

CSS Files and Structure


This template comes with these CSS files:

css/bootstrap.min.css
css/animate.css
css/magnific-popup.css
css/font-awesome.min.css
style.css

About each file:

css/bootstrap.min.css
Twitter bootstrap framework. A base twitter bootstrap CSS files, which defines various elements like columns, navigation, tabs, icons, forms and buttons.

css/animate.css - http://daneden.me/animate/
CSS3 animation stylesheet file.

css/magnific-popup.css
Magnific Popup stylesheet file.

css/font-awesome.min.css
Font Awesome stylesheet file.

style.css
Main Theme stylesheet file.


Back to Top

JavaScript Plugins and Scripts


This template comes with these Javascript files:

bootstrap.min.js
Twitter bootstrap base JavaScript file, which allows us to use many javascript components like tabs, accordion menus, dropdowns, tooltips and popovers, alert messages and so on. More information and examples can be found at http://getbootstrap.com

animate.js
For animate css

jquery.isotope.min.js
A dynamic layout plugin for jQuery. The flip-side of CSS floats.

jquery.fitvids.js
A lightweight, easy-to-use jQuery plugin for fluid width video embeds.

jquery.easing.js
Uses the built in easing capabilities added In jQuery 1.1 to offer multiple easing options

jquery.parallax-1.1.3.js
Parallax

jquery.magnific-popup.min.js
Magnific Popup

js/jquery.sticky.js
Fixed menu on the top of the site.

js/jquery.nav.js
Responsive navigation plugin.

retina.js
For Retina Images

functions.js
The most important file of prevrat template, which defines some basic javascript functions. More information inside JS file.


Back to Top

Sources and Credits


Fonts, Icons, Photos and Source Files

We've used the following files.

Included libraries

jQuery - http://jquery.com
Twitter Bootstrap - http://getbootstrap.com/
jQuery Isotope - http://isotope.metafizzy.co
jQuery FlexSlider 2 - http://flexslider.woothemes.com
jQuery Fitvids - http://fitvidsjs.com
jQuery Parallax - http://www.ianlunn.co.uk/plugins/jquery-parallax
jQuery Easing - http://gsgd.co.uk/sandbox/jquery/easing
Magnific Popup - http://dimsemenov.com/plugins/magnific-popup
Retina - http://retinajs.com
Animate js/css - http://daneden.me/animate
Sticky - http://stickyjs.com


Used Fonts

Source Sans pro - www.google.com/fonts/specimen/Source+Sans+Pro


Included Icons

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


Used Photos in Demo

http://stockphotos.io
http://picjumbo.com
http://photopin.com
http://deathtothestockphoto.com
http://www.imcreator.com
http://www.pixeden.com
http://designrfix.com
http://www.psdcovers.com

Images are not included in the theme.

Thank you for purchasing Prevrat theme. In case of any questions related to this theme, we will to get back to you as soon as we can. We do not provide any warranty, however we are always here to help.

Best regards
entiri s.r.o.


Back to Top

Changelog


v1.0 - 03 April 2015
- Initial Version


Back to Top

Thank You Very Much