Visual Composer Intro for WordPress

What is Visual Composer?

Visual Composer is a drag and drop page builder for your WordPress website. It is user-friendly and easy for developers to design new pages layouts.

How Do I Use Visual Composer?

Log in to your wp-admin with user name and password.
In the dashboard, click on “Pages”.
You can “Add New” or ‘Edit” an existing page.
Click on the Visual Composer section “Backend Editor”. Frontend Editor will take you to your page where you can add new rows and elements live on your page.
You can choose to add an element, add a row, templates, or go to the Frontend Editor.
Click “Add Row”. The pencil edit tool to the right will let you edit your row. The paper icon will allow you to clone your row. If you click the x icon you can delete the row.
If you select the top of the row to the left you can choose what column layout you want (if you hover over it will give you the different column options).
Once you have selected your column layout, click on the “+” sign and select the element you want for that column (Ex: text block, single image, image carousel, accordion, Call to Action, tabs, FAQ, and more.
If you select to include a single image, you can title your image, click the green + sign to “Add Image” and choose an image already in the Media Library or Upload Files to choose an image from your computer.
Click “Set Image”.
Under “Edit Single Image” you can select a CSS Animation which will make the picture fad in on the page (top to bottom, bottom to top, left to right, right to left or appear from center).
Image size – you can adjust the size of your image to thumbnail, medium or large. (If you leave this section empty it will default to the thumbnail size).
Image Alignment – you can align the image for left, right, or center.
Image Style – you can add a shadow, border, 3D shadow, circle border and more.)
Image Link – enter the URL if you want the image to link somewhere.
Once you have everything set on the image, click “Save”.
If you hover over the image element you can click the “Edit” pencil icon if you need to go back in and make any adjustments.
If you want to add another image you can duplicate the row by clicking on the paper icon. The image will appear directly below the first image.
You can then drag and drop the image into another column block.
To add text, click the + icon click to add a text block. Use the text tab to enter text that you copied from a Word document or to enter shortcode. You can choose how you want to align your text, add links, etc…
Click “Save” to save your text.
You can add a row and click the + sign to add a row within the row.
Click “Templates to save the page as a template if you want to use the layout over again on a new page. This is great to use when you have multiple pages that you want to look the same.
Once you have your page laid out the way you want it, click to “Publish” the page.