Elementor Page Builder is a plugin that you can install to your WordPress site. It allows you to simply drag and drop a variety of elements to your webpage. Elementor is a live frontend page builder, which means you can design your WordPress site from the ‘front end,’ where your users will see it, rather than from the administrative ‘back end’ (Dashboard) that WordPress provides. You can design your web pages on the frontend, and simultaneously see how exact the changes look like.

Screen Shot 2016-06-30 at 4.37.51 PM

You will need to install Elementor Page Builder on the WordPress Dashboard. Go to Plugins – Add New. Find Elementor Page Builder and activate the plugin. After installing the plugin, you can create a new page or post now. You will see a red button located under the page title named Edit with Elementor. Click the button to launch the page builder panel.

Elementor___Resume_πŸ”Š

After launching the Elementor Page Builder, you will see a page builder panel on the left of your screen, including a variety of elements that you can drag to the web page. There 24 types of elements you can choose from the page builder panel, including the basic elements such as text, image, video, and the interactive elements such as responsive button, progress bar, and Google Map.

Elementor___Elementor__107_πŸ”Š

Firstly, you can manage the layout of your page by adding new sections, and choose which column structure you wish to add to a new section.

Elementor___Elementor__107_πŸ”Š 2

After building a column structure on the page, you can drag different elements to the column. You can simply edit the element on the page builder panel on the left of the screen. On the top of the page builder panel, you can edit the text in Content mode, change the color and the size in Style mode, and make advanced changes in Advanced mode.

Elementor___Elementor__107_πŸ”Š 3

Hit Save button on the right bottom of the page builder panel after you make changes. You can exit the editing mode by hitting the exit button on the left bottom of the page builder panel.

 

Examples of the elements:

  1. Google Map

You can embed the Google Map into your site. Simply input an address and change the zoom level and the height of the map on the page builder panel.

Elementor___Elementor__107_πŸ”Š 4

  1. Image Gallery

You can upload images, make customized changes including the image size, link, border to create an Image Gallery on your site.

Elementor___Elementor__107_πŸ”Š 5

  1. Image Box

The Image Box element helps you buildΒ aΒ section to feature images. This can be used to promote your featured posts.

Elementor___Elementor__107_πŸ”Š 8

  1. Progress Bar

The progress bar can be used to present data and show the percentage. You can edit the data on the page builder panel.

Elementor___Elementor__107_πŸ”Š 9

If you have any other questions, please check this demo video: