Catfish, sticky, branding (skin) and interstitial formats

A catfish (a bar stuck to the bottom of the screen), a sticky, a branding or skin (the background around a site’s content), a pause ad or a fullscreen interstitial is not a banner type you pick in Epom. Each one is markup that positions itself on the page — a template the network built once, filled per banner — served into a Non-standard placement whose tag writes the ad straight into the page. This page explains that set-up and what to check when such a format misbehaves.

Note: how a particular format looks and behaves — where it docks, its close button, a delay before it appears, a collapse arrow, how the skin’s side panels line up with the content — is written in your network’s template, not in Epom’s code. Two networks’ “catfish” can behave differently. Ask whoever maintains your templates (Account → Templates) about a specific option; this page covers what Epom itself does around them.

Who this is for

• Publishers placing a catfish, sticky or branding code on a site.
• Network managers setting up the placement and the template.
• Advertisers whose rich-media creative does not show or click as expected.

Prerequisites

• A Non-standard Placement (catfish, sticky, interstitial, branding) — or a Mobile Site placement for mobile-only formats. See Create a placement.
• A template for the format (Account → Templates), or the advertiser’s own HTML code that draws the format itself. Template banners need the rich-templates permission.

How catfish, sticky, branding and interstitial ads are built in Epom

There are two ways to get a format on the page:

Way	What carries the format	Use it when
Template banner	The banner is of type Template; the template body draws the catfish/skin and the banner fills its properties (image, landing URL, colours…)	You sell the format to many advertisers and want each to supply only creatives
Adapter template on the placement	The placement’s Native adapter template (a template of type Placement Content Adapter) wraps whatever banner wins — its markup lands where the template says $$AD_CONTENT$$	You want every ad on the slot — image banners, HTML code, programmatic bids — shown as a catfish or interstitial without rebuilding each creative

Either way, copy the placement’s Universal JS tag with Ad wrapper → Without Wrapper (placement Ad Tags & API → Settings). The other wrappers put the ad in an iframe sized to the slot, and a catfish or skin cannot dock to the screen edge or paint the page background from inside a frame.

Note: the old built-in pop-up, pop-under and skin ad units were retired. A format built on templates is the supported way.

Steps — set up a catfish or sticky placement

1. Create a Non-standard Placement in the zone of the site (Create a placement).
2. Either link Template banners built on the catfish template, or pick the format’s Placement Content Adapter template in Native adapter template (Basic info → Advanced settings) and link ordinary banners.
3. On Ad Tags & API → Settings, set Ad wrapper to Without Wrapper and copy the Universal JS tag.
4. Put the tag on the page once — usually just before </body>.
5. Check it on the placement’s Preview, then on the live page from a phone and a desktop.

How big is a catfish or sticky slot?

• On a Non-standard or Mobile Site placement the tag sizes its inner container to the served banner’s size, not the placement’s — so a 320×100 banner makes a 320×100 bar.
• In an adapter template, $$WIDTH$$ and $$HEIGHT$$ are the banner’s width and height.
• Fit container (Ad Tags & API → Settings, Mobile Site and Non-standard only) makes the ad take 100% of the element you placed the tag in — use it when the template sizes the bar itself (full width on mobile, say).
• Allow variable banner sizes on the placement lets banners of other sizes serve into it; it does not resize them. A creative with a fixed width wider than the phone screen is cut off — the creative itself has to be responsive.

Close button, delay and showing it once per visitor

• The close button, a delay before it appears and a collapse are parts of the template (often template properties you set per banner). If an advertiser’s own HTML code draws its own bar and close button, that code — not your template — decides how they look and work.
• Showing it once per visitor (or once per hour) is a frequency cap on the campaign or banner. Epom does not count a close as anything (unless the template fires its own tracking for it); only the cap stops the next impression.
• When a capped campaign is the only one eligible for the slot, capped visitors get no ad (or the placement’s Default code) — a drop in impressions after adding a cap is expected.

Show the catfish only on mobile (or only on desktop)

Use Device targeting (Add targeting). Targeting is checked at every level — advertiser, campaign and banner — and all of them must pass. A campaign targeted to desktop with a banner targeted to mobile serves nowhere. When a mobile branding “doesn’t show”, compare the device rules on the campaign and on the banner.

The catfish or branding stopped showing (or shows twice)

Work down the list:

1. The code is not on the page any more. A site redesign often drops the bottom-of-page code while the in-content banners stay. Requests for the placement fall to zero in a General report grouped by placement — that is the sign.
2. The page carries a code from a different placement. The placement is decided by the tag’s data-key alone; a code copied from another site’s placement serves that placement’s ads and targeting. Compare the key on the page with the placement’s tag.
3. Two copies of the format’s code on one page. Every <ins> slot sends its own request, so two catfish codes give two catfish — close one and the other appears under it. Keep one.
4. Paused or off. The placement, zone, site, banner, campaign and advertiser must all be on. See My ad is not serving.
5. A frequency cap or a limit used up the only eligible campaign (above).
6. Targeting: device or country rules on the campaign or banner (above).
7. A template change. Editing a template changes every banner on it once the ad cache reloads — see Create and manage banner templates.

To serve one format code on several sites but see them apart, either create one placement per site, or keep one placement and set the tag’s data-channel to the site’s domain — the channel is groupable in reports, targetable and available as $$CHANNEL$$ (see Invocation codes).

Branding or catfish is not clickable, or the click goes to the wrong page

Check in this order:

1. Is something of the page drawn on top of the ad? With Without Wrapper the ad lives in the page itself, so the page’s own CSS applies to it. A content block, a header or another floating widget with a higher z-index over the skin’s side panels catches the clicks — the ad looks right but only part of it reacts. Inspect the clicked point in the browser’s developer tools: the element that gets the click is the one on top. The fix is on the page (layering, the position of the code) or in the template’s styles.
2. Is it the advertiser’s own code? An HTML Code banner that builds its own bar and close button controls its own click area; ask the advertiser to fix it, or move it onto your template.
3. Where does the click go? A Template banner has no Url field of its own — the landing page is a template property. Check the value of that property on the banner. On image banners it is the banner’s Url.
4. Is the click counted? The template (or the HTML code) must send the click through Epom — $$CLICK_REDIRECT_URL$$ in front of the landing URL. A link straight to the landing page works for the visitor but records no click. See Fix click tracking on third-party ad tags.
5. Does it work in Preview but not on the site? Preview writes the markup straight on its own page, so the site’s layout is missing; a click that works there and not on the site points back to step 1. A creative that refuses to be framed by another domain can also fail on a site that puts the tag inside its own iframe.

Video overlay: attach it to the right player on the publisher’s page

A video overlay in Epom is the VAST/VMAP Video Overlay (IMA + Video.JS) template on a Non-standard placement. It finds the publisher’s video on the page, pauses it, plays the ad video over it, and resumes the publisher’s video when the ad ends. If it is not under Account → Templates on your network, ask your network manager to import it; Epom support or your account manager can provide the template. Three template properties on the banner decide which video it covers:

Property	Options	What it does
Parent Selection Strategy	Auto Select Biggest Video (default) · Parent Selector (Single-select) · Parent Selector (Multi-select)	How the player is found
Parent Selector	A CSS selector, e.g. #main-player or .article-video video	Used by the two selector strategies
Insertion Type	Wrap Parent And Append Overlay To Wrapper (default) · Append Overlay To Parent	Wrap moves the player into a new container and puts the overlay in that container; Append adds the overlay inside the element the selector found

How each strategy behaves:

• Auto Select Biggest Video takes the largest <video> element on the page. Fine on a page with one player; on a page with several videos it covers whichever is biggest when the code runs.
• Parent Selector (Single-select) takes the first element that matches the selector. Use it when the page has several videos — target the main player’s id or a class only it carries. A selector strategy with an empty Parent Selector falls back to the biggest video.
• Parent Selector (Multi-select) creates one overlay for every element that matches, at the moment the code loads.

To choose the selector: open the publisher’s page, right-click the player → Inspect, and pick an id or class on the player’s own element (or its wrapper) that is stable across pages. Test it in the browser console with document.querySelector("#main-player") — it must return the player, and the element must have a visible size. Use double quotes inside the selector; a single quote breaks the template’s script.

The AI assistant can look for the player in the page’s HTML: give it the page URL and it lists the <video> elements, player iframes (YouTube, Vimeo, JW Player and similar) and elements whose id or class names a player, each with a suggested selector. It reads the raw HTML without running scripts, so a player injected by JavaScript is not found — then use Inspect as above. Check its suggestion in the console the same way.

To change the selector, edit the banner’s Parent Selector (or switch the strategy) and save. The ad servers pick the change up on their next cache reload; pages already open keep the old value until they reload.

The AI assistant can set the Parent Selector, the strategy or the Insertion Type for you — ask it, for example, “set the overlay banner’s parent selector to #main-player”. It reads the banner’s template properties first and changes only the ones you name; the same works for a catfish’s or sticky’s options. Over the API the pair is GET / POST /rest-api/banner/{bannerId}/template-properties.do.

The overlay does not appear, or appears over the wrong video

1. The selector matches nothing, or an element with no size. The overlay keeps waiting for a visible match — it does not time out and shows no error. Check the selector in the console as above; a player that is hidden or collapsed until the visitor clicks counts as “not found” until it has a size.
2. The publisher’s video is not playing. The ad starts only once the covered <video> plays. A player that waits for a click shows the overlay after the click.
3. The code runs in a cross-origin iframe. The overlay searches the document it runs in. Inside Epom’s own friendly iframe it climbs to the page when the page is the same domain; inside a publisher’s iframe from another domain it cannot see the page’s player at all. Put the tag on the page itself (Universal JS, Without Wrapper).
4. The player is not a <video> element. Auto-select looks only for <video>; a player drawn by a cross-origin iframe of its own (an embedded third-party player) cannot be covered.

The overlay hides the player or breaks its layout (player styles lost)

With the default Wrap insertion the template takes the element it found out of its place on the page, puts it inside a new <div>, and lays the overlay over it in that <div>; when the ad ends, the element goes back where it was. Nothing of the page’s styling is copied to the new <div> except the position of an absolutely positioned player, and its width and height are set to inherit. So for the length of the ad the player has a different parent, and page CSS written for the old structure stops applying:

• rules such as .player-box > video, :first-child or a flex/grid layout that sized the player as a direct child no longer match — the player loses its size or styling;
• a player sized in percent now takes its size from the new <div>, which inherits the declared width/height of the old parent rather than its real size — the player collapses or overflows;
• a position: fixed or sticky player is not carried over — the new <div> is plain relative.

What to change on the banner (a domain-targeted copy if only one publisher’s page needs it):

1. Switch Insertion Type to Append Overlay To Parent. Append leaves the page’s structure alone: it adds an absolutely positioned layer (top-left, over everything) inside the element the selector found, and removes it when the ad ends.
2. Point the selector at the player’s container, not the <video>. Append needs an element that can hold children — the <div> around the video. A <video> element does not display anything placed inside it, so Append on a bare <video> (which is what Auto Select Biggest Video finds) shows no ad. Use Parent Selector (Single-select) with the container’s id or class.
3. The container should be positioned (position: relative or similar) in the page’s CSS — an absolutely positioned layer is placed against the nearest positioned ancestor, so without it the ad can land over another part of the page.

The overlay layer itself always sits on top (it is the ad), and it follows the player’s size while it plays. An ad that covers the player after it ended, or a player that stays broken after the ad, points at the page re-styling the moved element — test the page with Append before looking further.

The publisher’s page or player frame reloads — the overlay is lost

The overlay attaches once, to the element it found when the code ran. It does not watch for the player being replaced and does not request a new ad. So:

• The whole page reloads → the tag runs again, sends a new ad request and attaches to the new player. Nothing to do.
• The page swaps the player without reloading (single-page apps, a playlist that rebuilds the player, an iframe around the player that refreshes) → the overlay stays on the old, removed element and is gone for the rest of the page view.
• What to do: have the page re-run the Epom tag after it creates the new player — insert a fresh <ins> slot (or call the loader’s init again, as for any dynamically added slot, see The JavaScript API). Each re-run is a new ad request and can be capped like any other.

Whose impression is it — the overlay’s or the player’s?

The overlay is an ad of the overlay’s placement — the Non-standard placement whose tag is on the page — and of the overlay banner’s campaign. The impression is counted when the overlay’s ad video starts playing (the template fires it itself, not on page load), and a click when the viewer clicks the ad. It appears in reports under that placement and banner like any other impression.

The ads the publisher’s own player shows (its pre-rolls from its own ad server) are separate impressions on that ad server; Epom does not see them. If the publisher’s player also runs on an Epom Video placement, those are impressions of the Video placement — a page view can carry both, and they are reported on two different placements.

Note: a VAST non-linear ad (the In-Stream video type Non-linear on a Video placement) is the other kind of overlay: there the publisher’s player requests it from Epom and draws it, so no selector is involved — see Linear vs non-linear.

Corner cases and gotchas

Corner case: a Template banner shows the Enable passback functionality option only on Site and Non-standard placements. Use it (or the template’s own “next body” message — see Target related templates) when the format should hand the slot over to other demand instead of leaving it empty.

Corner case: the Native adapter template wraps every banner on the placement, including the programmatic bids. A bid that already draws its own sticky bar inside your catfish wrapper shows a bar within a bar — keep such demand off the adapter placement.

Corner case: an adapter template wraps the banner’s markup only when the banner returned some; if nothing is served, nothing is drawn, so an empty catfish never covers the page.

Per-role notes

• Publishers usually only place the tag; the template and the banners belong to the network.
• Without the rich-templates permission the Template banner type is not offered; without Templates view the placement’s Native adapter template field is hidden.
• Read-only / shared (Can view): the placement and banner forms are locked; the tag can still be copied.

Related

• Create and manage banner templates
• HTML code and Template banners
• Serve an HTML5 creative from a ZIP bundle
• Display placements (site, mobile site, non-standard)
• Ad tags, invocation codes and the API
• Frequency capping
• One slot, several formats: video first, then iframe or native
• Tags and preview problems