Recording videos
How to record MP4 and WebM videos of any website with Urlbox, including scrolling videos and section-controlled scrolling
To record a video with Urlbox, set the format to mp4 or webm and pass a URL as usual. By default the recording holds the page still for a few seconds.
Request
video_time sets the recording length in milliseconds (video_duration is the same thing in seconds). Frame rate, output size and encoding are controlled by video_fps, video_width/video_height, video_quality, video_preset and video_codec.
Scrolling videos
Set video_scroll to true to smoothly scroll down the page while recording, great for showing off a long landing page the way a visitor would actually experience it.
Request
The scroll's feel is fully tunable: how long each movement takes (video_scroll_duration), pauses between movements (video_rest_duration), lead-in and tail time (video_prescroll_duration, video_postscroll_duration), the easing curve (video_ease), whether it scrolls back to the top (video_scroll_back), and human-like randomisation (video_jitter). If the page lazy-loads content, video_warmup does an unrecorded scroll first so everything is loaded before the take.
Section-controlled scrolling
Sometimes you don't want a constant scroll at all. You want to visit specific sections of the page and hold on each one for a set time, whether that's to highlight features in turn, build a guided walkthrough, or line the scroll up with a voiceover. That's what video_scroll_to does.
Request
Each entry is a stop. The target can be:
- A CSS selector:
#reviews,.pricing-table,[data-section=faq]. Selectors automatically pierce open shadow DOM, so pages built from web components work without special syntax. - A text locator:
text=Customer Reviewsmatches visible text (case-insensitive substring match, resolving to the deepest matching element), handy when a page has no useful ids.
Each stop takes optional settings after ; in a render link, or as object keys in a JSON body:
| Key | What it does | Default |
|---|---|---|
wait | How long to pause at the section (4s, 500ms, or ms as a number) | video_rest_duration, else 2s |
duration | How long the scroll to this section takes | video_scroll_duration, else 1.5s |
ease | Easing for that scroll (see video_ease) | video_ease |
offset | Stop N pixels above the element, which keeps sections visible under sticky headers | video_scroll_offset, else 0 |
Set video_scroll_offset to change that default for every section at once, rather than repeating ;offset= on each stop.
In a JSON body the same stops can be objects, which is easier to generate programmatically:
{
"url": "https://urlbox.com",
"format": "mp4",
"video_scroll_to": [
{ "selector": "#full-page-screenshots", "wait": "20s" },
{ "text": "Screenshots at internet scale", "wait": 30000, "offset": 80 }
]
}Timeline behaviour
The video's total length is derived from your stops. The scroll choreography (each scroll and wait) is capped at 400 seconds, with prescroll, scroll-back and postscroll time added on top. If you pass video_time explicitly, it caps the scroll choreography and truncates it. Lead-in, scroll-back and tail still ride on top.
If a section isn't found on the page, Urlbox holds the current position for that stop's full time slot rather than skipping ahead. That keeps every later section on schedule, so the rest of your timeline stays in sync even if one selector breaks. If you'd rather fail loudly, set video_scroll_require_sections to true and a missing section returns a 400 error naming the selector.
Tips
- Sections are visited in the order you pass them, and top-to-bottom order usually looks most natural.
- Give the first stop a
waiteven if it's the top of the page; a beat on the hero reads better than an instant scroll. - Long choreographies can take minutes to render, so use the async API with a webhook rather than a synchronous request.
- Renders are cached like any other Urlbox render, so re-using the same render link serves the finished video instantly.