Using Visual Composer to Customize your Website Layout

• November 25, 2016
• Leave a comment

Visual Composer plug-in eliminates the daunting task of coding beautiful layouts for websites in a matter of minutes. With visual composer, there is no need to opt for HTML guru or Shortcodes operator ninja to create complex layouts.

Visual Composer plug-in works with any WordPress theme and it allows you to map out any kind of design layout on your preferred theme. Simply select the theme that you want and activate the plugin to start customizing your website layout. Visual Composer takes into consideration that every website should be tailored made and the process should be hassle free.

The Visual Composer Back-end Editor

It is easy to add page templates and elements with visual composer back-end editor.

All you need to do for adding a detail page is click the + button (see reference image) to open a window, add elements and find web page constructing modules.

Use the page element options to customize your web page. Each aspect has different options for customizations like colors, fonts, margin, pixels and more.

The map given below highlights functionality of the back-end editor with helpful pointers for the editor options:

The Visual Composer Front-end Editor

The front-end Visual Composer involves the same web page building choices as the back-end. The only difference is that you will see particular web page elements instead of situation holders.

Visual Composer has the capability to map any shortcode comfortably. You will need to use Shortcode Mapper in the settings, then click on “Map Shortcode” button to follow steps.

Targeting Custom Rows with CSS

In case you want to change a row through CSS, the correct approach to do so would be to use a custom type Class for the particular row. By implementing this, all your edits will remain unique to that specific row and also prevent issues with the theme/plug-in in future.

Custom type fields are available for almost every visual composer module. You can tweak things without using settings and keep things organized for a lot of Visible Composer modules.

Creating Full-Height Sections

To create full-height sections, you simply need to create a row with Visual Composer and enable the “Full Height” settings. This will make the height of a specified row identical.

Content management and creating responsive website becomes easy with WordPress front finish editor. Users who do not have a programming advantage can still create attractive pages with award winning drag and drop editor.