Picreel overlays allow you to create engaging pop-ups, including Nano Bars, Side Bars, and Full-screen Overlays, to capture your audience's attention and boost conversions on your website.
Use Case:
Imagine you have a special promotion you want to highlight on your website. By using Picreel overlays, you can create a visually appealing Nano Bar at the top of the screen, a Side Bar to the right, or a Full-screen Overlay, effectively drawing attention to your promotion and encouraging user interaction.
Benefits of using different types of overlays:
Enrich your existing campaigns by incorporating eye-catching overlays that provide a modern and engaging touch.
Make important announcements or guide customer actions in innovative ways, enhancing your communication strategy.
In this help article, you'll learn:
Step 1: In your Picreel dashboard, click the drop-down arrow and select “Create using Templates.”
Step 2: Under the Overlay type,
Navigate to the Nano bar as campaign type.
Hover over a template you wish to select and click "Customize."
Step 3: Customizing Overlay Layout and Design options:
Step 3: Customizing Overlay Layout and Design options:
Adjusting Popup Size
Select the size of your overlay between large and small. You can also define custom dimensions. Use the slider to adjust the height and width of the overlay.
Position
Select the positioning of your overlay on the screen from the given options. You will get a live preview on the right part of the screen. A total of nine positioning options are available in the builder.
Background
Select the background type. You can choose to upload an image or add a solid color. Change the background color using Red, Green, Blue (RGB), Hue, Saturation, and Lightness (HSL) or hex color code.
Border
Use the slider to adjust the border width and the corner radius.
Choose a border style from the list and select its color.
Use animation for your website overlay.
Elements
Picreel lets you customize your overlay using the below-mentioned elements:
Text: Add your text to the overlay. You can stylize your input using the floating toolbar.
Image: Select an image from our library to place on your overlay or upload one from your local storage. You can use this option to add your logo. After adding, you can drag and drop the image to re-position it. Resizing is also easy.
Video: Upload an MP4 video from your system or paste the YouTube video URL to display to visitors.
Button: Add call-to-action (CTAs) to the overlay and set the desired action event upon click based on its placement.
Timer: Promote time-sensitive offers by attaching a timer with the overlay. You can select from where the timer countdown will begin. Either a specific date and time or when the popup appears on the screen. You can shuffle between the two conditions based on your requirements.
Input Fields
Based on your popup content, you can collect input from customers by adding fields to the overlay. Use the name, email, or phone field. You can also add custom fields and collect additional information. Moreover, you can make any field mandatory for your target visitors.
Step 1: In your Picreel dashboard, click the drop-down arrow and select “Create using Templates.”
Step 2: Under the Overlay type,
Navigate to the Sidebar as campaign type.
Hover over a template you wish to select and click Customize.
Step 3: Customizing Overlay Layout and Design options:
Step 3: Customizing Overlay Layout and Design options:
Adjusting Popup Size
Select the size of your overlay between large and small. You can also define custom dimensions. Use the slider to adjust the height and width of the overlay.
Position
Select the positioning of your overlay on the screen from the given options. You will get a live preview on the right part of the screen. A total of nine positioning options are available in the builder.
Background
Select the background type. You can choose to upload an image or add a solid color. Change the background color using Red, Green, Blue (RGB), Hue, Saturation, and Lightness (HSL) or hex color code.
Border
Use the slider to adjust the border width and the corner radius.
Choose a border style from the list and select its color.
Use animation for your website overlay.
Elements
Picreel lets you customize your overlay using the below-mentioned elements:
Text: Add your text to the overlay. You can stylize your input using the floating toolbar.
Image: Select an image from our library to place on your overlay or upload one from your local storage. You can use this option to add your logo. After adding, you can drag and drop the image to re-position it. Resizing is also easy.
Video: Upload an MP4 video from your system or paste the YouTube video URL to display to visitors.
Button: Add call-to-action (CTAs) to the overlay and set the desired action event upon click based on its placement.
Timer: Promote time-sensitive offers by attaching a timer with the overlay. You can select from where the timer countdown will begin. Either a specific date and time or when the popup appears on the screen. You can shuffle between the two conditions based on your requirements.
Input Fields
Based on your popup content, you can collect input from customers by adding fields to the overlay. Use the name, email, or phone field. You can also add custom fields and collect additional information. Moreover, you can make any field mandatory for your target visitors.
Step 1: In your Picreel dashboard, click the drop-down arrow and select “Create using Templates.”
Step 2: Under the Overlay type,
Navigate to the Full-Screen as campaign type.
Hover over a template you wish to select and click Customize.
Step 3: Customizing Overlay Layout and Design options:
Step 3: Customizing Overlay Layout and Design options:
Adjusting Popup Size
Select the size of your overlay between large and small. You can also define custom dimensions. Use the slider to adjust the height and width of the overlay.
Position
Select the positioning of your overlay on the screen from the given options. You will get a live preview on the right part of the screen. A total of nine positioning options are available in the builder.
Background
Select the background type. You can choose to upload an image or add a solid color. Change the background color using Red, Green, Blue (RGB), Hue, Saturation, and Lightness (HSL) or hex color code.
Border
Use the slider to adjust the border width and the corner radius.
Choose a border style from the list and select its color.
Use animation for your website overlay.
Elements
Picreel lets you customize your overlay using the below-mentioned elements:
Text: Add your text to the overlay. You can stylize your input using the floating toolbar.
Image: Select an image from our library to place on your overlay or upload one from your local storage. You can use this option to add your logo. After adding, you can drag and drop the image to re-position it. Resizing is also easy.
Video: Upload an MP4 video from your system or paste the YouTube video URL to display to visitors.
Button: Add call-to-action (CTAs) to the overlay and set the desired action event upon click based on its placement.
Timer: Promote time-sensitive offers by attaching a timer with the overlay. You can select from where the timer countdown will begin. Either a specific date and time or when the popup appears on the screen. You can shuffle between the two conditions based on your requirements.
Input Fields
Based on your popup content, you can collect input from customers by adding fields to the overlay. Use the name, email, or phone field. You can also add custom fields and collect additional information. Moreover, you can make any field mandatory for your target visitors.
Click ‘Save’ to finalize your changes.
You've successfully set up engaging overlays using Picreel. If you encounter any issues or have any questions, don't hesitate to reach out to our support team.
Related Articles:
