Skip to content

Overlays

Overlays are timed elements that appear on top of the player — a call to action, a watermark, an email form, a clickable hotspot, a banner, a WordPress shortcode, and more. You can place any number of overlays on a video and control exactly where and when each one shows.

Where to configure overlays

Overlays live in the Overlays panel of the player configuration:

  • In the Gutenberg block inspector, or
  • In the dashboard Media (or preset) editor inspector.

Open the panel, add an overlay, pick its type, and a drawer opens with that overlay's options and a live preview. Because overlays are part of the player config, they can also be saved into a reusable preset.

Overlay types

TypeWhat it does
TextA simple text note or label on the player.
CTAA call-to-action card with a headline and a linked button.
Action barA bar of buttons, typically pinned along the bottom of the player.
Email captureA form that collects email addresses — submissions are saved as Leads.
WatermarkA small logo or text mark; can auto-move around the frame to deter screen capture.
Image / BannerA clickable image (such as a banner ad) with a link, alt text, width, and an optional Ad badge.
HotspotA clickable marker placed anywhere on the frame. On click it opens a link, seeks to a time, or pauses.
ShortcodeRenders any WordPress shortcode on top of the player, using normal WordPress server-side shortcode rendering.
CustomYour own custom HTML.

Positioning

Every overlay is positioned freely on the frame.

  • Placement presets — nine quick anchors (the corners, the edges, and center).
  • Custom — choose Custom placement to reveal horizontal and vertical sliders and drop the overlay at any exact point.

Layout-style overlays (the action bar, email capture, and CTA) pin themselves sensibly — for example the action bar spans the bottom — while point-style overlays (text, watermark, hotspot, image) sit exactly where you place them.

Timing

Each overlay controls when it appears:

  • Always — visible for the whole video.
  • Playing — visible only while playback is active.
  • Paused — visible when playback is paused.
  • After a percentage — appears once playback passes a percentage of the video's length.
  • Percentage range — visible between two percentage points.
  • Time range — visible only between a start and end time.

Most overlays can also be made skippable so viewers can dismiss them.

Styling

Depending on the type, you can adjust colors (text, background, button), opacity, padding, corner radius, font size, and stacking order (z-index) — all from the overlay's drawer, with the live preview reflecting changes as you make them.

Email capture & leads

The Email capture overlay turns the player into a lead magnet: gate or interrupt playback with a short form, and every submission is stored on the Leads page. You can choose what happens after a viewer submits — continue playback, or simply hide the form.

Shortcode overlays

The Shortcode overlay is for WordPress plugin output that needs PHP rendering, normal page CSS, JavaScript, and AJAX behavior. Add the shortcode, pick its placement, and decide when it appears. Ink Player renders the shortcode during the page request and keeps the overlay hidden until the timing rule is met.

Good uses:

  • Contact, opt-in, or survey forms.
  • Paginated tables and directories.
  • Booking widgets or event lists.
  • Quizzes, membership widgets, or LMS snippets.

TIP

For shortcode output with large datasets, rely on the shortcode plugin's own pagination or AJAX loading. Ink Player controls when the overlay appears; the shortcode plugin should still control how much data it loads.

Banners & ad overlays

The Image / Banner overlay is ideal for sponsor banners or house ads: pick an image, give it a click-through link, set its width, and optionally show a small Ad badge in the corner. For full interruptive video ads (pre-roll, mid-roll, post-roll), see Ads instead.

TIP

Overlays render identically wherever the media is placed — block, shortcode, or page builder — because they're saved on the media record. Configure once, and every placement shows them.

Built for WordPress.