As a web creator, you want to ensure that your client sites stay in shape long after you deliver the project.

Whether there is a plan to add the site to your portfolio or reduce the time your spend on maintenance - you want to avoid unwanted changes.

I've been a web designer for 10 years and can surely relate to that. In fact, client changes have always been one of my strongest fears.

It is much preferable to spend your time working on a new exciting project rather than fixing what should not have been broken.

To avoid issues, web developers tend to restrict access to certain parts of the site. Some are suspicious about WordPress since it gives lots of freedom.

But the cherry on top is page builders.

WordPress page builders give enormous flexibility to manipulate layouts - is it the default Gutenberg editor or a power tool like Visual Composer.

As a web creator, you can design anything - as a client, you can break it.

To deal with the hassle, I want to share three things that satisfy my “freelancer” needs and may help your agency to reduce risks and save time.

User role management

To build a decent website, we choose powerful tools with options tailored for professionals rather than beginners.

WordPress page builders allow web creators to design custom headers, footers, post templates and even incorporate custom CSS.

In fact, based on our research, up to 45% of all Visual Composer users love to use custom CSS in their projects.

These are essential things for every web developer but can be harmful in the hands of your clients.

What I love to do is disable advanced features for my clients which results in benefits for all of us.
From the agency's point of view, you are sure that your clients will not interfere with advanced features like post templates or page options.

As for the client, he/she will receive a simpler interface to manage the content.

We all know that there is a learning curve for every page builder - no matter what ads are telling you.

As a pro, you will get the basics in an hour and become a power user in a week. As a client, you may need days to cover the basics.

Plus, you can always enable features back or use role manager as your onboarding strategy.

The role manager has proven to be a very effective instrument for me and I highly recommend it to all web creators.

WordPress admin panel

Same as for the page builder, your WordPress admin panel could require a facelift.

And by facelift, I mean, it is worth reducing the number of sections available to users other than the Administrator.

To me, the WordPress admin panel has always been bloated when it comes to an average user. You, as a web creator, are in charge of setting the correct permalink structure, managing plugins, working with the Appearance, and so on.

All these options can be hidden from other users to lower the barrier.

While there is no specific favorite on my list, plugins like User Role Editor will do the job.

Last, but not least, sometimes it is worth considering removing the admin bar as well. Just to make things cleaner.

While there is surely a plugin for that, I would go with a simple code snippet to avoid bloating my clients' sites with micro plugins. All you have to do is add this small code snippet:

add_filter( 'show_admin_bar', '__return_false' );

Element and layout locking

Any page you make consists of the layout and content. The content management process is a process when a person interacts with the content to modify it to their liking.

But what if you can modify the layout as well? The border between layout and content disappears and your clients may try to interfere with your layout.

To avoid such a scenario, I use the element lock feature that allows literally locking any element, row, or section of your page to make it accessible only by the admin.

Though, I leave only essential elements that require constant updates open. Things like paragraphs and images are still accessible to the client while styled rows are out of the content management scope.

Just like with the role manager, clients simply don't have access to certain parts of the page. The number of controls is reduced and navigation becomes easier.

To get the most out of it, I lock all elements on the page and then unlock the ones I want clients to edit. Usually, there are more elements to lock than to leave unlocked.

It will require some time, but this is how you can get 100% safe when it comes to handling the project over to your client.

Outro

Does setting up user permissions and locking down elements sound like a lot of work to do?

Yes.

Most likely, you will have to spend several hours configuring settings and locking layouts.
Nevertheless, a web creator spends up to 10 hours weekly fixing bugs (roughly 25% of all your time). And we know - fixing bugs means stealing time from development.

While the user role manager and element lock may not solve all the problems, they can help to reduce the time you spend on unwanted maintenance.

The time that is critical for your agency's growth and success.

As with everything, you will start slower and have to wait for results to come. But, I can promise you one thing - your life get easier.

We do the same things in different ways. This is what makes our work unique. Everyone has their own workflow and life hacks to fasten things up and make their work more productive.

Working with Visual Composer is no exception. Even my teammates use features I don't and vice versa. And we work at the same company.

As I had my first Facebook live video, I decided to share some of the tricks I use when working with Visual Composer. The response was brilliant. Messages like “Oh, I did not know that!” made me think about sharing more tips to help you to become more productive.

In this article, I have collected 10 life hacks that I use when working with Visual Composer:

1. Custom row names
2. Global templates
3. Column cloning
4. Global and local CSS
5. Right-click controls
6. Template export and import
7. Page to page copy
8. Element presets
9. Row resizer
10. Append and prepend columns

After seeing how much our users love to both use and share their own Visual Composer hacks, our lovely colleague Irma created a walkthrough video showcasing just how to use each of the hacks mentioned in this article. Enjoy!

Custom row names

You can give custom names to your content elements, including rows and columns. To change the element name, click on the element title in the edit window or in the Tree view.

Why do you even need to rename the elements?

As your page layout becomes bigger, it can get harder and harder to navigate around. Especially, if you need to make changes after some time.

Plus, working in an agency has a high probability of someone else working on the same page. The same applies to delivering your project to the customer.

How to name your elements?

I do not name all of my elements. It feels like a waste of time.

Instead, I like to name my first-level rows and sections. I think you will agree that names like “Header”, “Hero section”, and “Features” make a lot more sense than “Row”, “Row”, “Row” when navigating around the page.

Global templates

A global template is a powerful tool available to Visual Composer users. It allows you to create a template that you can manage from one place and it will automatically get updated all across your website.

As I design a page, I search for the sections that I may want to reuse later on. If the content won't change, it makes sense to convert this part into a global template.

In Visual Composer, you can save any row as a template. And this is what I often do.

I save my reusable rows as global templates. Delete the content I have just created and replace it with the global template.

Such an approach also helps me to instantly see the template in a real layout.

Plus, I can easily add the same content on different pages and make changes to the template from one place whenever I need it.

Column cloning

Imagine you have four features you want to display in four columns next to each other. The easiest way (in my opinion) is to create a single feature and clone to result.

To illustrate the process, let's imagine that each feature consists of the icon followed by a description.

I will start my design process by adding a row with a single column. In the column, I will add my icon element and description.

To save extra time, I will style the icon element and description by applying the Design Options needed.

Once my boilerplate is ready, I use column controls to clone the column (in our case making three additional copies).

Now that I have four columns with features ready, all I need to do is change the icons and update the copy.

Global and local CSS

As a web creator, you like to adjust parts of your content with CSS even when using Visual Composer. There is nothing wrong with that.
The question is whether to use local or global CSS.

Visual Composer offers both options - apply CSS to a certain page or to the whole site.

Whenever I write custom CSS, I insert it locally (page-specific CSS).

Then, I ask myself a question if I will need this CSS on another page. If the answer is yes, I move it to the global CSS.

Of course, there can be cases when CSS is needed on the majority but not all pages. In such a case, you need to decide. For me, 70% is enough coverage to go after the global CSS.

As a workaround, you can use global templates to add custom CSS.

Last, but not least, just like naming the elements makes sense, don't forget to comment and separate your CSS code. You will thank yourself later.

Oh, almost forgot, you can apply the same principles to the custom JavaScript as well.

Right-click controls

Introduced recently, right-click controls are a handy way to quickly access element options.

Due to the fact that you need to use right-click to find out about the controls, some of you may have missed it.

There is not much to say about it apart from “Give it a try”. I found myself saving lots of time with it.

Template export and import

Web creators love boilerplates. The good news is that Visual Composer template export allows you to have them.

There are certain layouts, elements, and maybe even media you like to use across different projects. The question is how to move those presets across your sites easily.

Visual Composer offers a template export option that allows you to move templates across different sites together with all the content elements and media files.

Yes, once you import a template to your newly created WordPress site, Visual Composer will automatically download all the elements used in the template and upload the media to your Media Library.

On my projects, I don't like to download my most used elements over and over again. Instead, I have a template that contains those elements. Once I upload the template to the site, all the elements get downloaded automatically.

Page to page copy

I think this is one of the most popular life hacks in my arsenal and I love it so much.

Did you know that you can copy Visual Composer elements from page to page (within the scope of one site)?

When working with Visual Composer, I usually have at least two browser tabs opened to quickly copy/paste the elements from already created pages to the new one.

No need to recreate the element or use global templates. A simple copy/paste will do the work.

Element presets

You can create global templates or copy elements from page to page.

Yet, there is another way (probably even better) to make sure you don't have to adjust the basic things for your elements over and over again.

Element presets allow you to save any element of Visual Composer as a preset with preconfigured styles.

All of the element presets will appear right in your “Add Content” window and can be used just like any other element.

An additional benefit for web creators is an option to name your presets though giving your customers an idea of what elements to use when managing content on their own.

As I design sites for my friends, I often use element presets to create already branded buttons, images, and text blocks they can use out of the box.

Plus, I don't need to style the same elements over and over again.

Row resizer

Before release 44.0, you were able to adjust row sizes and width within your page or post layout, only within the row layout options.

Now there is an option to stretch and shrink rows via the brand new row resize controls.

Simply hover over the edge of a row you wish to adjust, and click on the vertical dotted control. Now, drag and drop the borders right and left to change the width of your rows to see faster results.

While this option allows you to change the margins of any row easily, it keeps the columns intact, adjusting them proportionally to the new row sizes.

And, you can still check and correct the values in the row layout options, same as before.

This feature truly is a cherry on top of what makes the Visual Composer editor true to WYSIWYG.

Append and prepend columns

Before the release 44.0, you were able to add extra columns to a row by selecting from the pre-set layouts or adding an extra row by typing in a new value in custom row layout options.

Now, when you hover over the edge of the first or last column of a row, you will see an additional plus icon. To add a new column simply click hover over the outline of a row, and click the plus icon.

This is such a simple yet handy feature that allows you to create layouts in Visual Composer even quicker.

Outro

I have shared 10 life hacks of mine that I use when working with Visual Composer.

I hope you find them useful and applicable to your workflow. Maybe it will save your time and you will be able to create more projects or spend more time with your family.

If you are looking for ways to learn more about certain features - visit our Help Center.

Also, I encourage you to share your tips and tricks in the comments below and in our official community on Facebook.

See you online.

Get ready for full-page design options - an easy way to style your pages without coding. Visual Composer 38.0 comes with Design Options controls you can apply not only to a row or section but a whole post or page.

We continue to enhance your design experience with Visual Composer. With familiar design options being a part of every content element, we aim to extend this functionality to the posts and pages you design.

Page design options allow you to control the background color, image, margin, padding, and border of your page. It overwrites the default styles of your theme making page design options a perfect companion for creating landing pages.

How to Use Page Design Options

To access page design options, go to the On-Page Settings from the Visual Composer frontend editor and click on the Design Options tab.

From there, you will see the well-known design options controls which can be adjusted to your needs. All changes will be automatically displayed on your page.

Moreover, we created page design options with responsiveness in mind. This means you can add different styling for different device types. For example, add a background image on a desktop and replace it with the background color or mobile to improve performance.

The page design options are available to all Visual Composer page layouts and the Starter theme. Some other themes may experience compatibility issues due to their styling options and layout structure.

When to Use Page Design Options

From the landing page styling and up to small design tweaks, there are many cases where page design options can be applied.

Most marketers want their landing pages to be a bit different from the main site. With design options, you can easily add a background image or change the color to make it look different.

Your theme does not support background color controls or restrict using images? No worries, Visual Composer can handle that for you.

For a non-technical user, page design options allow adjusting page style without writing a single line of code.

Want to introduce a small and trendy border to make your page look like a card? Page design options allow you to control the border width and color of your page.

We are sure you can think of many more use cases or you can always find inspiration in our showcase.

Are you thrilled about page design options? Let us know in the comments or share your work in the official Visual Composer community on Facebook.

Happy designing!

P.S. Yes, page design options are available in the free version of Visual Composer.

If you’ve ever considered upgrading from a free version to a premium, you’re probably wondering if it’s worth the investment. The answer is yes! Keep reading for how to determine whether or not your business needs Visual Composer Premium and some of its best features.

Let' start with a simple statement - Visual Composer is for everyone. If you've ever used Visual Composer - you already know that.

While other products raise prices and limit features, we have only expanded the feature list available for free. No surprise that the Visual Composer free version is the most powerful WordPress page builder on the market.

Ok, but if the free version is so good - why do I have to consider premium? The answer is simple.

Once you start your business you need to get online fast. The Visual Composer free version can help you to do just that. 

As your business and objectives grow, there are more opportunities and challenges on the horizon. Improve sales funnel, run marketing experiments, incorporate e-commerce, and so on.

This is where the premium version comes into play. Below, I have summarized all differences between the two versions and outlined the benefits of the Premium version.

WordPress Content Editing

The free version of the Visual Composer is a page builder that allows you to edit the content of your page. In WordPress, content is defined by your theme. This means you have a specific block you can edit.

But what if you want to edit something that is beyond the content? For example, a header, or footer. 

Visual Composer Premium allows you to edit the whole page. You can choose a layout of your page, create custom headers, footers, sidebars, and create content.

A common practice in e-commerce sites is to reduce distractions on the checkout page. With a custom header created in Visual Composer, you can place only needed elements, like logo, though increasing your conversion rate.

Premium Elements and Templates

Right from the start, you will get 40 free elements and 10 free templates to build your page. The very basic elements, like text blocks, buttons, and separators allow you to build a decent site.

But at some point, you may need more elements. Of course, you can find an add-on or even create your own elements. Yet, there is an easy way out.

Visual Composer Hub is a library available in Visual Composer that gives you access to more elements and templates. To be exact, there are 500+ elements and templates available and the numbers keep on growing.

The best part is that Visual Composer Premium gives you access to all those elements and templates completely free of charge. No download limits applied.

Premium Design Options

All Visual Composer elements come with design options - feature-rich controls to apply background effects.

While the free version covers all the basics, you may want to look into the Premium version to access more styling options and parallax effects.

Plus, as Visual Composer Premium has more elements you can have more styling options.

Premium Addons

Available exclusively to the Premium version, add-ons can significantly increase the number of features. 

Tailored for professional web designers and marketers, different add-ons can help you:

• Create custom popups;
• Create global templates;
• Export/Import templates;
• Manage element access;
• Add dynamic content to your page;
• Define your own custom typography;
• Create custom layouts;
• and more.

And, just like the elements and templates, all addons can be downloaded for free from the Visual Composer Hub with an active Premium subscription. 

Visual Composer and WooCommerce

E-commerce is a huge topic these days with everyone wanting to benefit from the online sales boom.

Visual Composer Premium version offers a seamless integration with WooCommerce and other online business tools you may need to start your online store.

Premium Support

Being a premium version user is not only about the elements, templates, and features. As a premium customer, you get a reliable partner that offers premium-class support and assistance whenever you need it.

In fact, over 70% of premium users admit that support availability is one of the key factors when it comes to business sustainability.

Premium Pricing

When talking about premium products, we tend to think about the hundreds of dollars we will have to spend every month. This is surely not the case with Visual Composer.

You can start as low as $49 annually for a single site subscription and enjoy all the premium benefits. Similar tools in other industries may cost you hundreds if not thousands of dollars.

You can also get a lifetime license for $149 so you can pay once and get all features and updates forever.

In fact, the Visual Composer Premium subscription costs around 4 Big Macs from McDonald's  

Plus, with a 30 days refund guarantee you are completely risk-free.