Since version 1.0.3, Smart features Visual Composer’s Front-End Editor. If you haven’t previously used this functionality for some other project, the idea behind it is very simple: It allows you to live-edit a page in your website, and you can preview the changes you’re making in the same browser tab.

How to use the front-end editor↑ Back to Top

Enabling the front-end editor is pretty simple too: While you’re in the page you want to edit, just look for the “Edit with Visual Composer” link in your admin bar at the top of the window and click on it:

You can also enable the front-end editor from the page editor view:

Once the front-end editor is enabled, you’ll see something like this:

The interface is pretty self-explanatory, but you’ll have options to change the settings of your rows, columns and every other single component you may have there. After clicking the “edit” button (the one with the pencil icon on it), a small window will pop-in and show you the settings.

There you can change all you need, and after you click “Save changes” the page will be updated to reflect your modifications.

You can also create new rows and columns, and add new elements to them. Basically, you have the same functionality that was already available in the admin side, and you’re also able to preview your changes 🙂

Also, if you want your changes to be definitely saved and applied, you need to click the “Update” button at the top of the page. If you close the browser tab without updating, none of your changes will be saved.

If you’re new to Smart or Visual Composer, we recommend taking a look at our article about Using The Page Builder, which has more in-depth information about how Visual Composer works, and how we implemented it for Smart.

Possible Drawbacks↑ Back to Top

Though Visual Composer is a great plugin to build all different kinds of layouts, it’s very well known that it can be a little heavy on the front-end. Inside Smart we do all we can to improve the performance of Visual Composer and its components, but we are ultimately limited by the plugin’s core functionality.

There shouldn’t be noticeable performance issues for end users and visitors, and neither for you while you’re not using the front-end editor, but in case you’re using it, you should keep in mind that Visual Composer introduces a lot of JavaScript code to render the editor, which may end up causing conflicts with third-party JavaScript code (basically, code that is not under the control of NiceThemes or Visual Composer itself). These kind of conflicts may end up slowing down your browser after a while, and in that case it may be better for you to switch to the admin-side editor.

If you find any issue with the front-end editor, please let us know in Smart’s support forum.