Skip to main content
Live DoBeacon tour — running on this page

Guided tours,
built right in

Click the button. DoBeacon will take over this page — scrolling to each section, highlighting elements, and walking you through exactly how it works.

No account needed · The tour runs live on this page

How it works

From idea to live tour in minutes

01

Build with the Chrome extension

Click any element on your live site. The extension captures the selector and lets you write the step content — title, body, media — right there.

02

Embed one script tag

Drop a single `<script>` on your site. The SDK is under 12 kb, loads async, and auto-initialises from the `data-project-key` attribute.

03

Your users get guided

Tours trigger automatically by URL, time delay, or user state — or launch on demand. Every interaction is tracked in your analytics dashboard.

Step types

Every kind of guide, one platform

Mix and match step types in a single tour. Point at an element, slide in a drawer, pop a modal — all in sequence.

💬
Most popular

Tooltip

A small callout anchored next to any element. Points at exactly what you mean. Draggable. Supports images and rich text.

Non-blocking

Drawer

Slides in from any edge — bottom, top, left, right. Starts condensed so users can keep working. Expands on demand.

Full focus

Modal

Full-screen dialog for announcements, media, or long explanations. Dark overlay keeps focus on the message.

Passive

Guide bubble

A floating button that surfaces your tour at the right time. Trigger it on scroll, after a delay, or when a user looks stuck.

< 12 kb

Minified + gzipped

Loads async, never blocks your page

~4 min

Average time to first tour

One script tag, build in the dashboard

Frameworks supported

React, Vue, Next.js, plain HTML — anything

Installation

Three lines. That's it.

Drop this into your site. DoBeacon initialises automatically from the project key. Your first tour is live the moment you publish it — no new deployments.

index.html
<script 
  src="https://dobeacon.com/v1/beacon.min.js"
  data-project-key="pk_live_…">
</script>
No npm installNo build stepWorks on any stackWCAG 2.1 AANo cookies

Ready to guide your users?

No credit card. No code changes to your existing site. Build your first tour and share it in under five minutes.

Start building for free →

No credit card · First tour in under 5 minutes