Adhesion ads are always visible and anchored at the bottom or top edge of the screen. They’re also responsive, dynamically resizing for device browser size and orientation, and can expand on click, hover, timed, or in view into a second screen. Note, you can add additional screens to any ad format by clicking the + icon in the screens and layers panel.
This article will walk you through creating an Adhesion banner using Adventive’s template.
Fashion example here
Adhesion Ad Unit
In the Builder, Create a New File, type in File Name, and select Adhesion from the dropdown.
Select ad dimensions or click custom to enter your own.
Backup Image – Any image asset that matches the dimensions you’ve entered will be displayed in the dropdown list. You can select one here or add a backup in the builder under general properties in the “Fallback Image” field. This Backup Image will be displayed if the user’s browser is out of date and cannot support HTML5.
Click URL – The default click URL. The click URL is automatically applied to any area of the ad unit without an associated click or event action (i.e. buttons, hitboxes, expand actions etc.). Users that click on the fallback image will also be directed to this URL.
Setting Up Your Canvas
A blank canvas will load onto the screen. This is where you'll place your ad content.
Ad Properties (In the Properties panel to the right of the Builder)
Width and Height
The Width and Height of your canvas will be the sizes you choose from the Create New File template. You can change these at any time.
Opacity of the ad canvas
Click to change or update the name of your ad
Default Click URL
Click to change or update the default click URL
UPDATE: You can now choose to have the Default Url open in a “New Tab” or the “Same Tab” by clicking on the dropdown arrow next to the “Open In” field in General Properties:
Click to add or update your fallback image. This will open your assets, displaying only images that are identically sized to the initial load screen dimensions of your ad unit.
- Position - select the arrow to choose to display the ad at the top or bottom of the page
- Roadblock - the roadblock option prevents the user from navigating past the ad unit - hides the close button for a set number of seconds. If selected, a "Seconds" field will appear and you can type in the amount of seconds to delay the close button:
- Responsive Setting - Two setting options, "Maintain Aspect Ratio" and "Maintain Height".
Maintain Aspect Ratio - if selected, will maintain aspect ratio of imagery.
Maintain Height - if selected, will keep a constant adhesion ad height and will truncate the width of the ad when responsive.
- Hide ad when scrolling– if selected, the ad will be hidden when the viewer scrolls up or down the page but reappears when scrolling stops
- Disable Close Button – if selected, the default “x” close button will not appear and the ad will always display
- Close Button Icon – click the input box to upload a custom close button icon image here (the asset manager will open, just select or upload the image you want to use)
- Close on Timer – automatically closes the ad after a specified number of seconds
- Seconds – specify the number of seconds before auto closing the unit
- Show Timer – if selected, the timer will display at the top of the ad (you can also change the Timer Color)
- Cancel close timer on engagement – cancels the close on timer action if the user engages with the ad unit – includes hovering over the ad for 2+ seconds
To Add a Screen click the + icon in the screens and layers panel at the bottom of the Builder. You can add additional screens to any ad format by clicking the + icon as well as Rename. * You can select a screen and drag it/reorder the screens - this will automatically update the ordering numbers listed on the Screen tabs. (You should check any previous actions you have in case you need to update Go to Screen actions, etc.) Also see Screens & Layers article here.
Select Screen 2 and set the Width and Height in the General properties for the canvas size.
Open As Full Page Flex
For this example, “Open as Full Page Flex” is chosen from the Action dropdown with the Action on Click going to Screen 2:
Expand Ad Unit Up
As another example, Go To Screen could be chosen from the Action dropdown with the Action on Click going to Screen 2 with the Transition set as a Slide with the Direction as Up:
Save the ad.
Go to the Preview icon to view the ad.