Sticky Banner

The LeadsWithDemos sticky banner is a horizontal, non-intrusive banner that can be positioned at the top or bottom of the screen. It is ideal for consistent visibility on your website, LeadsWithDemos landing pages, or WordPress product demos.

Settings for Sticky Banner includes:

“Design” Settings for Sticky Banner

Position

Defines the placement of the banner within the viewport. You can specify whether you want the sticky banner to be placed at the top or bottom.

Top

This option places the banner at the top of your potential leads’ screen.

• Remain at top: This is an on or off toggle that you can enable to ensure the banner remains visible when scrolling.

Bottom

This option places the banner at the bottom of your potential leads’ screen.

• Remain at bottom: This is an on or off toggle that you can enable to ensure the banner remains visible when scrolling.

Allow Closing

This is an on or off toggle that allows you to add a close button to the banner, enabling users to dismiss it if they choose. You can personalize the look and feel of this button.

Hide Duration

Determines the duration, in days, for which the banner should stay hidden after a user closes it.

Close button

Customization options for the close button include background color, hover background color, icon color, hover icon color, position, shape, size, weight, padding, and margin.

• Background color: Enables you to modify the popup close button’s background color.
• Icon color: Allows you to change the color of the popup close button icon.
• Hover background color: Lets you alter the popup close button’s background color when hovered over.
• Hover icon color: Permits changes to the color of the popup close button icon when hovered over.
• Position: Provides options to position the close button at the top-right, top-left, bottom-right, or bottom-left of the popup banner.
• Shape: Enables you to choose the shape of the popup close button, whether circular or squared.
• Size: This feature allows you to customize the size of the popup close button, with options available in small (S), medium (M), large (L), and extra-large (XL).
• Weight: Enables you to set the icon’s weight to be thin, regular, or bold.
• Padding: Allows you to add padding around the close button.
• Margin: Permits the addition of margin around the close button.

Box Shadow

You can add a shadow effect around the sticky banner, enhancing its depth and visual appeal. This feature allows for the customization of various parameters that define the shadow’s appearance, giving the banner a three-dimensional look without altering its original shape.

You have the option to either not add a shadow effect to the banner or select a pre-defined shadow by choosing your preferred option. Alternatively, you can select a preferred option and adjust its settings to achieve your desired look.

Box shadow key parameters:

• Popup Shadow Horizontal Position: Determines the horizontal offset of the shadow from the element. A positive pixel (px) value will shift the shadow to the right, while a negative pixel (px) value will shift it to the left.
• Popup Shadow Vertical Position: Controls the vertical offset of the shadow from the element. A positive pixel (px) value will move the shadow downward, and a negative pixel (px) value will move it upward.
• Popup Shadow Blur Strength: Specifies the amount of blur applied to the shadow. A higher pixel (px) value creates a softer, more diffuse shadow, while a lower pixel (px) value results in a sharper shadow.
• Popup Shadow Spread Strength: Adjusts the size of the shadow. A positive pixel (px) value will increase the shadow size, while a negative pixel (px) value will decrease it, effectively making the shadow sharper or more pronounced.
• Shadow Color: Defines the color of the shadow, allowing for customization to match the overall design of the banner and website.
• Popup Shadow Position: Offers the option to apply either an outer shadow (surrounding the banner) or an inner shadow (inside the banner), impacting the visual effect and depth perception.

This combination of parameters allows for flexible and aesthetically pleasing designs that enhance the user interface of the sticky banner.

“Targeting” Settings for Sticky Banner

These settings enable you to determine when, where, to whom, how often, and on which devices your sticky banner will appear—whether on your website, LeadsWithDemos landing pages, or WordPress product demos.

When to Display It?

Allows you to set triggers based on scroll percentage, exit intent, loading delay, or inactivity.

• Trigger on page scroll: An on/off toggle that activates the popup based on how far the user scrolls down the page. When enabled, you can set the scroll percentage at which the popup will appear.
• Trigger on exit intent: An on/off toggle that displays the popup when the system detects the user is about to leave your website, the landing page or your WordPress product demo.
• Trigger after loading delay: An on/off toggle that shows the popup after a specified duration that the user has spent on the page. When enabled, you can set the delay time in seconds.
• Trigger after inactivity: An on/off toggle that displays the popup after a certain period of user inactivity on the page. When enabled, you can define the inactivity duration in seconds before the popup appears.

Where to Display It?

Determines the specific URLs where the popup should appear or be excluded. You can configure the popup to display on all pages, match a specific URL, contain part of a URL, begin with a certain string, or match a pattern with a wildcard.

Where not to Display It?

Determines the specific URLs where the popup should not appear.

+ Add Rule for Where to Display It and Where Not to Display It:

The “+ Add Rule for Where to Display It and Where Not to Display It” feature allows you to create custom conditions for displaying popups on specific web pages. By clicking this option, you can define criteria such as specific website URLs or parts of website URLs where the popup should appear. Define the exact conditions under which the popup will be shown based on the URLs of your website, landing page or WordPress product demo. When a new rule is added, the condition defaults to OR, meaning the popup will display if any of the specified criteria are met.

For both ‘Where to Display’ and ‘Where Not to Display,’ here are the rules that will be available once you click on ‘+ Add Rule’:

• Is:

Behavior: The popup shows only on pages with URLs exactly matching the specified rule.
Example: Setting Website URL is “https://leadwithdemos.com” displays the popup on leadwithdemos.com but not on https://leadswithdemos.com/features/sandbox-creation/.

• Contains:

Behavior: The popup appears on any page with a URL that includes the specified value.
Example: If the rule contains “/features/”, the popup will be shown on pages with URLs like
https://leadswithdemos.com/features/sandbox-creation/ and
https://leadswithdemos.com/features/lead-capturing/ but not on
https://leadswithdemos.com/wordpress-sandbox/.

• Begins with:

Behavior: The popup appears on pages where the URL starts with the specified value.
Example: A rule beginning with “https://leadswithdemos.com/” will display the popup on various feature pages but not on https://app.leadswithdemos.com/.

• Ends with:

Behavior: The popup appears on pages where the URL ends with the specified value.
Example: A rule that ends with “/lead-capturing/” will display the popup on any page ending with “/lead-capturing/”.

• Matches wildcard:

Behavior: The popup appears on pages where the URL fits a specified pattern, with * serving as a wildcard.
Example: Using “leadswithdemos.com/*/lead” will show the popup on pages like
https://leadswithdemos.com/features/lead-capturing/ and
https://leadswithdemos.com/features/lead-management/, but not on
https://leadswithdemos.com/features/popups-forms/.

Who to Display It to?

Here, you can decide whether to exclude first-time visitors from seeing the popup. You have the option to show the popup to all visitors or only to specific visitors (Filtered Visitors).

Additionally, when you select “Filtered Visitors” within “Who to Display It To”, you have the option to add a “Filter Group” to further refine the selection of specific visitors who will see the popup. These filters use the same AND and OR logic as the advanced filters in LeadsWithDemos. If you click “+Add Rule” within a filter group, the applicable logic will be “AND,” meaning that all specified criteria must be met for a visitor to be included in the results. The logic between filter groups, however, is “OR,” allowing for broader filtering of who the LeadsWithDemos popup will appear to.

You can tailor your popup visibility to specific visitors based on the following criteria:

• Audience Lists: If the visitor is a tracked lead in your LeadsWithDemos database belonging to a specific audience list.

• Visitor: Whether the visitor is a tracked lead in your LeadsWithDemos database or an unidentified visitor.

• Browser Language:  The browser language setting of the visitor.

• Country:  The visitor’s country, determined by their IP address. 

• Days Since Last Visit:  The time elapsed since the visitor’s last visit to your site. When using the “less than” filter, first-time visitors are considered to have a “days since [action]” value of 0. This includes both new visitors and returning visitors without an existing cookie. For instance, applying a filter for “Last page visits less than 7 days ago” will include new visitors since their “days since [action]” is 0, which is less than 7.

• Popup Viewed: Whether the visitor has previously encountered a specific popup.

• Session Count: The total number of analytics sessions recorded for the visitor on your site.

• Page Visited: If the visitor has been to a specific page URL before.

• Referral URL: If the visitor arrived at your site through a specific referral URL.

How Often to Display It?

Controls the frequency of the popup’s appearance.

Frequency

Which Devices to Display It?

Sets the popup to show on desktops, tablets, or mobile devices.

“Advanced” Settings for Sticky Banner

Custom JavaScript

This setting allows you to add personalized JavaScript code to your popup or form, enhancing its functionality.