Voyado Engage

Working with modules

A module is a block of pre-made content that you can drop into your email layout and use. Local changes you make to a module can be saved back to that module in the library. Modules can also be synced, which means local changes to the module, when saved, will be reflected everywhere that module is used (except in already sent emails). This is useful for headers, footers, logos and so on.

Starting off with modules

When you are creating your email, you will have access to a variety of modules that you can add to it.

Press the + button on the left menu to see the full list of modules.

Modules overview in Engage

You will only be able to add modules in Design mode. If you don't see the + button, you are probably in Localization mode. Select Design in the top-left dropdown.

Module groups

In the library, modules are split into two libraries, one for starter modules and one for team modules. As you build your own modules, they will be found under "Team library".

1-Starter library

Starter modules are present when you first open the Email Design Studio. These have been created to get you started quickly and are divided up into categories by use case or data source.

  • Select "All" in the dropdown to see all the available starter modules.
  • Select one of the categories to view just the starter modules in that category.

Note that the categories available and how they divided up might change over time.

Some starter modules may not be useable if they use a datasource or add-on that is not configured in your Engage environment. Contact Voyado support if you need to add some feature.

Starter modules are based on the styles present in your environment. As you update the styles according to your branding, the starter modules available will become more aligned to your brand styling and therefore more useful. Learn more about styles here.

2-Team library

Team modules are those created either by you or someone else with access to your Engage environment. A team module might just be an empty layout, meant to be filled with new content every time it's used, or it might contain the content you use often in many emails. 

Team modules may either be created by using a starter module for inspiration, which you'll then style to match your brand, or created entirely from scratch.

If needed, a team module can also be adjusted and then saved as a new module, which will then be available in your library with the other modules.

Types of module

In both of the Modules libraries you'll see standard modules and synced modules. You can tell these apart by their icons:

ICON DESCRIPTION
standard module icon Standard module in library
Synced module icon Synced module in library

When dropped into your layout, these modules will look like this:

Module in email design area in Engage

You can see that the standard modules (blue) can have different icons in the overview. That's because in this example one has a Wrapper element as its root element, and one has a Row element as its root. But these are both standard modules and act in the same way.

ICON DESCRIPTION
standard row module in overview Standard module in overview (row)
standard wrapper module in overview Standard module in overview (wrapper)
synced module in overview Synced module in overview
synced module with local changes Synced module in overview with local changes
Block not saved as module Layout block not saved as a module
A synced module retains the same purple icon in the overview as when it was in the library.

Here's how standard modules and synced modules work.

1-Standard module

Standard modules is any module you save so you don't have to rebuild common layouts several times, but where you still may regularly want to change or tweak the content. For example, you may create a newsletter module that has an image to the right and text to the left, but the text and the image will be changed with each newsletter. This is appropriate to be saved as a standard module.

A standard module, with a blue icon, can be dropped into your layout and edited there (you can add elements, remove elements, change images and text and styling, and so on). 

When you are done editing a standard module, you can choose to do one of three things:

  1. Do nothing and just keep the changed module in your email layout
  2. Save it as a new module, adding it to your Team Modules
  3. Push the changes back to update the module in the Team Modules library

For options 2 and 3, select the module in the overview and then hit the meatball menu on the right:

Module meatball menu

By hitting "Save as Module..." you can save this as a new module in your library. 

By hitting "Update module" you can push the changes you've made back to the module in the library, replacing its structure with the local version you are working on. This will NOT affect any other places when that module is currently being used. 

2-Synced module

A synced module is a special case of the standard module. When you change a synced module, you have the option to update it (sync it), which pushes those changes out to everywhere that module exists in your environment (except in already sent emails). This is a powerful function and useful for layout blocks that have to be be same in all of your emails, such as a logo, banner, or menu. The advantage of a synced module is that if content is updated, such as a change to a banner or a link, you only need to update this information once.

When changes are updated to a synced module, they will affect this module everywhere it is used.

Viewing a synced module

In the overview, a synced module, shown with the purple colouring, cannot be expanded. It is treated as a single unit even if it has elements inside:

View synced module

Only when you choose to edit a synced module can you see its interior layout (the icon is now black but it retains the purple colouring when selected):

View synced module expanded

Editing a synced module

To begin editing a synced module, you'll have to select it on the canvas or in the overview (it's easier in the overview) and press the "Edit synced module" button in the right panel.

Synced module warning dialog

Once you've done that, you will be asked if you want to edit it and keep it as a synced module (the first option) or detach it (make a local unsynced version of the synced module).

Synced module edit options

  • Edit and update everywhere: If you choose to keep it as a synced module, any further changes you make to that module can be synced. This means you will update that synced module in the library with your current changes, pushing them out to everywhere that synced module is used. A synced module in this state will now have the black icon instead of the purple one.
  • Detach module: If you choose this option, the module will now just be elements in your layout, detached from its synced "parent". You still have the option to save it as a new synced module.

Pushing out changes to a synced module

To do this, hit the three-dot (meatball) menu and select "Update module". This pushes out the changes you've made to this module to everywhere it is used. It also makes your module appear as synced again (it will be purple in the overview, but you will not be able to expand it).

Change menu for synced module

Saving your module

Changes are saved to your email layout automatically as you work. But if you feel that a module might be useful to have in your library, hit "Save module as..." in the meatball menu. This allows you to save a part of your layout either as a standard or synced module, which you can use in the future.

If you can't see the Save as new module option, check that you are in Design mode (the dropdown in the top left should say "Design") and that Preview with data is switched off.

Things to be aware of

There are some things to be aware of when working with modules:

Only wrapper and row elements can be saved into modules. To save several rows of content as a module, put the rows inside a wrapper and save that. If try (with the meatball menu) to save any other kind of element as a module, the system will use the top-level wrapper or row element of that element and create the module from there.

If you are working on different emails in several browser windows, updates to synced modules will not be shown automatically. You'll have to refresh the page to get them. 

If you edit a synced module, and you choose to keep it as synced, the system will flag the module internally as synced but changed, which means it will not receive any updates from other instances of that synced module. This is true even if you make no changes to the module. So be sure to not leave your emails with modules in that intermediate state for more time then needed to proof them.

Even if a module is saved and not edited it will be effected by changes in styles since these are applied across all elements. Learn more about styles here.

Article last reviewed

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request

Comments

0 comments

Please sign in to leave a comment.