Visual Composer Plugin

Easy and comprehensible builder for your site

Using the functionality of Visual Composer plugin you can easily add all the necessary content on your page and distinguish your site. It includes not only the default modules of Visual Composer plugin and its addons, but the unique shortcodes created by DFDevelopement for Native theme users as well.

Visual Composer Settings

You may create the pages using Visual Composer plugin.

The plugin provides the wide range of various elements and options and allows you to achieve stunning effects on the site.

For more information, you may check the Visual Composer Video Tutorials.

To create the pages with Visual Composer, you need to install and activate the Visual Composer for the site. Find more details on plugin installation in this post.

After this, select what elements you’ll be using and on what pages and posts they’ll be available.

Navigate to Visual Composer Role Manager Administrator and check the needed options.

visual-composer

  • Post types – select where to display the Visual Composer elements. It’s set to Pages only by default. Select Custom post types and put the check marks at all the needed elements: posts – for posts, pages – for pages, product – for WooCommerce products, portfolios, and galleries.
  • Backend editor and Frontend editor – enable the needed editors to use them while working on the site.
  • Disable Classic editor – set it to Enable to disable classic mode of Visual Composer plugin.
  • Elements – you may enable all VC elements or select custom ones to display on the site.
  • Page settings – allows controlling the access to Visual Composer page settings.
Page Editor
After you set the Visual Composer, you may proceed to the site building. Below you may check main options when customizing the page.


1.
Classic mode/Backend Editor – switch to classic mode to display the shortcode of the page. It is useful for quick duplicating of the pages: simply copy the shortcode and insert it to the Classic mode files of the new page. Frontend Editor – allows you to customize the page on its front end making and seeing the changes in real time.

2. Plus button – allows you to add the element to the first row.

3. Custom CSS Box – allows you to enter the CSS code which will be applied to this specific page only.

4. Drag button – allows you to drag-n-drop the row and change its position on the page. Here you can also set the number of columns inside the row.

5. Edit Row button – allows you to edit the row, duplicate it to delete the row on the page. More details can be found in the Row options post.

6. Edit Column button – allows you to edit the column, duplicate it to delete it on the page. More details can be found in the Column options post.

7. Edit Element button – allows you to edit the Visual Composer element, duplicate it to delete it on the page. More details can be found in each post of Visual Composer element.

8. Plus button – allows you to add the element below the already existing ones.

 

 

div#stuning-header .dfd-stuning-header-bg-container {background-image: url(http://nativewptheme.net/support/wp-content/uploads/2017/01/hands1.jpg);background-size: cover;background-position: center center;background-attachment: initial;background-repeat: no-repeat;}#stuning-header div.page-title-inner {min-height: 550px;}