Nimbo knowledgebase

Nimbo   >   Knowledgebase   >   Using the editor   >   The overlay tool

The overlay tool

The Nimbo editor features a tool that allows you to convert almost any of your content blocks into an overlay (a content box that appears in front of the main page content). These are often used for things like newsletter subscriptions, holiday messages, and promoting special offers (shows automatically after the page has loaded), or for showing extra information (only shows after a link is clicked). 

Whenever you hover over (or touch) a content block, you'll see an orange cog icon ( ) that appears in the top left of the block. Click this to access the overlay options for that block. By default, the overlay is inactive - when you toggle it on, additional options will appear to control appearance and behaviour. 

Show automatically

The first behaviour option is to show the overlay automatically after the page has loaded. Enable this to access controls for timing and frequency.

When you choose to "Only show the overlay once for each visitor", a cookie will be set in the visitor's browser for the length of time you've chosen. Once that time has passed, the overlay will appear for them again on their next visit, and a new cookie will be set.

Save your page, and the overlay will now appear automatically according to your settings. 

Show by clicking a link

The second behaviour option keeps the overlay hidden until the visitor clicks a particular link. When you enable this option, you will be shown the unique link code for this overlay. To use it, copy the code, then add a link in your page content (must be on the same page to work), either in normal text, on a button, or on an image.

To create a link in normal text, select the text you want to link, click the "link" icon in the floating formatting toolbar, then in the top LINK field remove the http:// and paste your code.

To use a button, click the blue "Edit link" box that appears when you hover over the button, then in the top LINK field remove the # and paste your code.

To add a link to an image, click the orange link icon that appears when you hover over an image, then paste your code in the third LINK field.

Save your page, and the overlay will now appear every time the link is clicked.