HopeVideo JS - Redirect Screen Demo

Redirect Screen Settings

Configure the redirectScreen payload. On Apply, the player remounts so you can test behavior immediately.

Player Flags

Player ID?Unique identifier. Keep stable unless you want a brand-new instance.Muted?Often required for autoplay to work across browsers.Autoplay?Attempts autoplay. If blocked, user gesture is required.Ads?Toggles ad flow for this demo (if supported by your HopeVideo component).

redirectScreen?Shows an end-screen / redirect overlay after a given time. Your player decides whether this is based on playback time, wall clock, or some event.

Enabled

Time (seconds)?When the redirect screen should appear. Use 0 to show immediately (if your player supports it).Title?Main text shown on the redirect screen.URL?Redirect target. Accepts absolute URLs (https://...) or internal paths (/somewhere).Image?Hero image URL. Accepts https://..., /local-path, or data: URLs.

Image Preview?Purely a UI preview. Your player may render differently.

redirect preview

Suggestions?Cards shown inside redirect screen. Keep count limited for performance (demo caps at 12).

Suggestion #1

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 1

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Suggestion #2

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 2

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Suggestion #3

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 3

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Suggestion #4

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 4

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Suggestion #5

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 5

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Suggestion #6

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 6

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Suggestion #7

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 7

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Suggestion #8

Title?Suggestion card title.

Preview?UI-only preview for your convenience.

suggestion 8

URL?Click target. Absolute URL or internal path.Image?Card image URL. https://..., /path, or data: URL.

Live JSON Preview

{
  "id": "hope-video-redirectscreen-demo",
  "muted": true,
  "autoplay": true,
  "ads": false,
  "redirectScreen": {
    "enabled": true,
    "time": 800,
    "title": "Lorem ipsum dolor sit amet.",
    "url": "/hopevideojs/",
    "image": "https://www.umutyaldiz.com/cover-16x9.jpg",
    "suggestions": [
      {
        "title": "Suggestion #1",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      },
      {
        "title": "Suggestion #2",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      },
      {
        "title": "Suggestion #3",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      },
      {
        "title": "Suggestion #4",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      },
      {
        "title": "Suggestion #5",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      },
      {
        "title": "Suggestion #6",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      },
      {
        "title": "Suggestion #7",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      },
      {
        "title": "Suggestion #8",
        "url": "https://www.umutyaldiz.com/",
        "image": "https://www.umutyaldiz.com/cover-16x9.jpg"
      }
    ]
  }
}

Demo Content

To test the redirect screen, keep the video playing until the configured time is reached. If your implementation shows it on ended instead, set time to 0 and seek near end for quick testing.

HopeVideoJS is a flexible and customizable video player solution based on Video.js, developed by Umut Yaldız. HopeVideoJS offers a modern and powerful media playback experience with its open source structure.

Logs