Skip to content
Dashboard

Custom HTML Redirects

Between the tap and the App Store, users see a Detour page. You can replace it with your own HTML, with your logo, your loading state and your wording, instead of a generic interstitial.

Each app has three such pages, each on its own tab:

  • Redirect page — shown during the immediate redirect and fingerprinting.
  • Copy link page — the background of the iOS clipboard flow.
  • App preview — an optional interstitial shown before the store redirect, which the visitor continues from with a tap.

To customize your app’s redirect pages:

  1. Log in to the Detour Dashboard.
  2. Select your mobile App from the sidebar.
  3. Open the Redirect page settings, and pick the Redirect Page, Copy Link Page or App Preview tab.

The redirect page renders in the user’s browser while the platform detects the device OS, records the click, and gathers fingerprint data.

  • Best for — loading spinners, your app logo, or a short line like “Opening the app…”
  • How it is served — inside a sandboxed iframe. JavaScript is disabled, so only HTML markup and inline CSS are allowed.

The copy link page appears only for iOS users, and only when the Copy Link flow is enabled for the app.

Recent iOS versions block pasteboard access from a direct page redirect. Detour works around that by asking the user to copy the link before installing, which gives probabilistic matching a strong extra signal.

When you customize the HTML for the Copy Link page:

  • Your HTML serves as the background layout for the page.
  • Detour automatically injects and displays the interactive Copy Link Dialog Box on top of your HTML.
  • The dialog box contains buttons to copy the link, install the app, and open the app store.

Because the dialog is injected dynamically, you configure its appearance in the dashboard rather than in your markup:

  • Banner Theme — Switch between Light and Dark themes to match your background.
  • Banner Language — Choose from 11 supported languages (English, Polski, Español, Français, Deutsch, Italiano, Português, Nederlands, 日本語, 한국어, 中文) to automatically localize the copy-link prompt.

The app preview is an optional interstitial: instead of sending a mobile visitor straight to the store, Detour shows a page you control, and the visitor continues with a tap on a Continue button. Use it to say what the app is before asking someone to install it.

It is off by default. Turn on Show App Preview on the App Preview tab.

  • Who sees it — mobile visitors only. Desktop and web visitors always go straight to your fallback URL, preview or not.
  • Configured but off — nothing is shown and visitors are redirected immediately. The dashboard flags this rather than failing silently.

The default source is a form, so no markup is needed:

FieldLimit
Headline80 characters
Body280 characters
App icon URL2048 characters
Button text64 characters
Background, text and button colorshex

On Scale and Enterprise the page can be raw HTML instead, with the same limits as the other two pages. The Continue button is always injected by Detour, and you only choose where it goes:

MarkerResult
{{CTA}}The button is rendered in its place and flows with your layout.
id="detour-cta"The element is replaced whole by the button.
neitherThe button is appended as a fixed overlay pinned to the bottom of the page.

Its color and label come from the same Button text and Button color fields as the template, so they stay configurable without editing markup.


All three pages are subject to the same rules, which limit their size and the resources they may load:

  • Size — the HTML must not exceed 50 KB (51,200 characters).
  • Scripts<script> tags and inline JavaScript (onload, onclick, and the rest) are blocked.
  • Media — images, fonts, and external stylesheets must be hosted on an HTTPS server of your own (a CDN, for example) and referenced by absolute URL.