All Collections
How-To Guides
Customise the overlay
Customise the overlay
Vudoo avatar
Written by Vudoo
Updated over a week ago

Create an overlay

There are multiple elements you can play with to create an overlay customised to your needs. The different overlay templates offer choices, but the fundamentals of working with each template are the same. 

In this instance, we’ll work with the product showcase template to walk you through the different functions.

Editing text 

  • Simply select the element you wish to work with. An edit panel will appear to the right of your screen with multiple functions

  • Choose your font and adjust the size, colour, and style of your text

  • Click the blue ‘Set & close’ button to save your edits

Add an image

  • Select the ‘Add images’ box and click the photo icon to upload images to use on the overlay. 

  • Click ‘Upload image’ to access your device’s image library. Select the file (or multiple files if you wish to create a slider) and choose ‘open’

  • Once successfully uploaded, it will appear in the image library on your screen 

  • When you hover your cursor over an image you’ll see a ‘+’ icon and a ‘trash’ icon. Click ‘+’ to add images to your overlay. Click ‘trash’ to remove the image from the library

  • Once you’ve selected your image/s, close the window via the X on the top right hand corner of the pop up

  • If you’re happy with the image, click ‘Set & close’

Add a button

  • Select ‘Add element’. An edit panel will appear to the right of your screen with multiple functions

  • Choose ‘Button’

  • Follow the prompts to customise your button. You can add text, edit the colour using the palette range or hex colour code and choose black or white text

  • By default, the button is the width of the text or select the ‘Full width’ toggle for a wider version

  • Finally, set the link URL for your button’s action. You can use an email address, phone number or URL 

  • To save, click on “Set & close”

TIP: There are numerous elements that can be added to an overlay, offering a high level of customisation.

Add elements

  • To add another element to the form, click ‘Add element’. The edit panel appears to the right of your screen offering multiple options.

Heading Customise and edit a heading

Paragraph Create and customise blocks of text

Image gallery Add images to the overlay

Button Create a button

Social icons Select the platforms to include on your form, enter the relevant links, and choose black and white or coloured icons

App store badges Provide links to your App Store or your Google Play

Spacer Create space between elements on the overlay

Horizontal line Add a graphic touch between elements

Vudoo form Great to use for data analytics. To understand how this element works, click here 

Salesforce CRM form Embed a form that sends data directly into your Salesforce CRM. Click here to learn how to do this 

Still stuck? We’ve got you covered!  Our friendly team is on hand to help at <support@vudoo.com>  or call 1300 4 VUDOO.

 

Did this answer your question?