Attractive graphics draw the users’ attention. Thanks to the pop-up wizard with image you will be able to create a pop-up that does not contain the contact form, but any graphic you choose. However, please remember that the pop-up should attract the users’ attention and not irritate them.
Therefore, it is worth paying attention to such elements as:
- appropriate selection of images and its size – large ads irritate users, the maximum recommended size should not exceed ⅓ of the screen;
- the time after which the pop-up will be displayed – too fast and rapid display of the pop-up may discourage the user from getting acquainted with its content and may result in leaving our website;
- message – it should be clear, concise, catchy and without hidden intentions, that successfully fulfills desired purpose;
- easy switch off – the icon enabling exit from the pop-up should be in a visible and intuitive place for the user.
Exemplary pop-up appearance:
CONTENTS
- Device
- Pop-up
- Closing image
- Settings
To create a pop-up with an image go to:
LEAD GENERATION → POP-UP / EXIT POP-UP → CREATE NEW → POP-UP WIZARD WITH IMAGE
DEVICE
[1] Select the devices on which the pop-up should be displayed – here you can choose whether you want your pop-up to be displayed on your computer, phone or both devices; depending on the choice, the next steps of editing may be slightly different.
[2] Preview of the pop-up on the devices of your choice
[3] Next – go to the next step of creating
POP-UP
[1] Device selection – available, when selecting the “computer and mobile device” option in the first step (device selection) – depending on the selected icon (computer/mobile device), it will be possible to edit the pop-up details of the selected device
[2] Image and redirection – allows you to add the selected graphic and enter the destination redirecting link
[A] Drop the file here or select from the gallery – here you can upload the photo in the chosen way
[B] Add redirection – by selecting this option you can add the selected URL to which a user will be directed after clicking a pop-up
[C] URL of pop-up redirect – enter here the URL where you want to direct users after clicking on the pop-up
[3] Size and background – allows you to adjust the size and background of the pop-up
[A] Select size – checking this box allows you to choose the size of the pop-up from 3 options (small, medium, large); not marking this option will cause automatically setting the original size of the image
[B] Add background – marking this option allows you to add the pop-up background and choose its color; the background will be visible only when the selected size is bigger than the actual size of an image eg. let’s assume we have selected the large size and our original image’s size is smaller than that, therefore the missing space will be filled with a chosen color
[4] Position – allows you to set the location of the pop-up on the page
[A] Position on the page – the choice of a given box determines the position of the pop-up (in this case – central point of the page)
[5] Button – allows you to add a button and refine its details
[A] Add button – selecting this option allows you to add a button
[B] Button text – enter the text you want to be placed on the button e.g. Click here.
[C] Add redirection – allows you to add a redirection link to the button
[D] Pop-up redirect URL – here enter the URL address you want to direct the users to
[E] Choose button color – allows you to adjust the color of the button
[F] Select text color – allows you to adjust the text color
[G] Height – allows you to adjust the height of the button
[H] Width – allows you to adjust the width of the button; an icon visible next to it sets the automatic proportion
[I] Vertical position – allows you to adjust the vertical position
[J] Horizontal position – allows you to adjust the horizontal position
[K] Button size – allows you to adjust the size of the button (to choose: small, medium, large)
[L] Borders – allows you to adjust the edge roundness
[6] Preview of the pop-up appearance, where all the applied changes are automatically displayed
[7] Next – selecting next will take you to the next step of editing the pop-up
CLOSING PICTURE
[1] Appearance – allows you to customize the closing image’s appearance
[1] Icon – selecting this option will cause the icon to be set as a pop-up image
[A] Shape – allows you to choose the shape; clicking on the icon marked below will display a window with available icons to choose between
[B] Color – allows you to select the color of the icon
[C] Size – allows you to adjust the size of the icon (to choose: small, medium, large)
[2] Picture – checking this feature allows you to set the image as a closing pop-up image
[A] Drop the file here or select from the gallery – here you can upload the picture in the chosen way
[B] Height – allows you to adjust the height of the image
[C] Width – allows you to adjust the width of the image
[2] Location – allows you to adjust the position of the closing image
[A] Selecting a given field corresponds to the location of the closing image on the pop-up
[3] Next – after selecting next you will go to the last step of the pop-up
Editing
[4] Return – allows you to go back to the previous step of the pop-up editing
SETTINGS
[1] Pop-up’s name – enter the name of the pop-up, which will later facilitate its identification
[2] Add tag after clicking – allows you to add a tag that will be automatically assigned to contact after clicking on the pop-up
[3] Identified contacts – marking the option Do not show identified contacts will cause that the pop-up will be displayed only to the contacts that have not been previously monitored by SALESmanago
[4]Display when – allows you to adjust the time from entering the page after which the pop-up will be displayed to a user
[A] After scrolling x% of the page – the pop-up will be displayed after the user scrolls the page by the selected percentage
[B] After x pageviews – the pop-up will be displayed after the selected number of pages viewed
[C] After x seconds – a pop-up will be displayed after a selected number of seconds have elapsed since the user entered the site
[D] On exit – the pop-up will be displayed when the user wants to leave the page
IMPORTANT: This function is not available for mobile devices
[5] Display where – allows you to determine the location of the pop-up
[6] Choose the domain where you want to display the pop-up; one pop-up can be displayed on one domain
[A] On all pages
[B] Only on the main page
[C] URL contains – a pop-up will be displayed on all pages whose URL contains the selected phrase
[D] URL does not contain – the pop-up will be displayed only on pages whose URL does not contain the selected phrase
[7] Preview of the pop-up appearance on a mobile device
[8] Preview of pop-up on a computer
[9] Finish – choosing this option will finish the process of creating a pop-up; after clicking the button finish, the following window will appear on the screen:
[1] Return to editing – after selecting this option you will be able to continue editing the pop-up
[2] Activate – by clicking the activation button ON / OFF, you can decide whether to activate or deactivate the pop-up (ON – active; OFF– inactive)
[3] Save – choosing this feature will save created by you pop-up