Working with Library in VWO Editor

An important aspect to consider when building and managing testing campaigns is whether you can reuse the elements and modifications that help you create different variations. This reusability typically helps in:

• Enhancing productivity: Reusing test components reduces the time to recreate changes from scratch and improves productivity. Thus, it helps you create test campaigns faster.
  
  
• Bringing consistency across your web pages: Reusing the UI elements and their modifications brings consistency to your web page’s look and feel.    

How Does Saving and Reusing Modifications and Widgets Benefit You?

In VWO, you can save modifications or widgets to reuse them across variations of a specific campaign or even across different campaigns. While this was previously limited to only the widgets and elements offered by VWO, you can now save your custom modifications and widgets. Thus, you no longer need to manually copy-paste changes; VWO’s library will help you do the job much more easily.

As you go about creating variations for your campaigns, VWO enables you to save:

• Widgets: Any page element, from basic text-blocks and buttons to banners and pop-ups, can all be saved as Widgets.
  Assume you’ve added a banner widget to your checkout page announcing a change in your shipping policy. The banner can be saved as a widget, and anytime you need to re-use the banner, you can create a campaign, add it with a single click and get it started. You can even modify the text and use the same banner for announcing different information.
  
  
• Modifications: When you perform a set of operations on an element, such as changing the button’s styling or rearranging an element within a section, you might want to replicate them on other elements, be it the same campaign or a different one. So button colors, text colors, border changes, etc., can all be saved as modifications and applied to any button in your campaigns. This saves you time by adding each modification to every button repeatedly and ensures that the change is consistent and error-free. VWO lets you save a change (or a set of changes) as a single Modification, which you can then add to other elements with a single click.

Widgets and Elements that you save are stored in My Library, and you can use them in any variation of any campaign that you subsequently create.

To better understand the concept of the VWO Library, let’s look at an example.

Consider that you’ve added a “Start free trial” button to your homepage and made some modifications such as color change, size change, etc. That being done, VWO allows you to:

• Save the button as a widget and use it as is elsewhere, or
• Only save the color and size changes such that whenever you wish to apply these very changes on any button in the future, you can do so with just one click.

The VWO Library

The Library feature of VWO Editor enables you to add new widgets, save code snippets, modifications, etc. The VWO Library is broadly divided into the following two categories:

• VWO Gallery
  

  Under this category, you’ll see all the components offered by VWO, such as Widgets and basic HTML elements like button, image, label, input box, etc. The Gallery is further divided into two sections:
  
  NOTE: If you’re an old user of VWO, you will no longer see the ADD button at the bottom of the VWO Editor. We’ve moved all the ADD button’s functionality under the LIBRARY, which is basically an enhancement over the ADD button’s functionality.
  • Widgets
    This section displays the list of available widgets in VWO. If you wish to add them to your webpage, click on the ones relevant for you. To learn more about widgets in VWO, refer to Working with Widgets in VWO.
    
    
  • Basic Elements
    This section displays the list of available HTML elements in VWO. If you wish to add them to your webpage, click on the ones relevant for you. To learn more about HTML elements in VWO, refer to Adding HTML elements on your webpage using VWO.
    

• My Library
  

  Under this category, you’ll see the list of Widgets and Modifications you’ve saved or added. 
  
  INFO: The saved widgets and modifications are stored on your VWO account, i.e., you can reuse them across new or existing campaigns in your account.
  My library is further divided into two sections:
  
  
  • Widgets
    This section displays the list of widgets you’ve saved in your library—for example, a pop-up modal announcing the next version of your periodic sale.
    Use this section if you wish to add an existing custom element from the library to your webpage. To learn how to save and use widgets in My Library, refer to Saving and Using Widgets in VWO Editor.
    
    
  • Modifications
    This section displays the list of your saved modifications—for example, menu theme changes. Now, whenever you wish to use this modification in the future, you can do so with just one click.
    Use this section if you wish to apply a saved modification to other elements on your webpage. To learn how to save and use modifications in My Library, refer to Saving and Using Modifications in VWO Editor.