Tour Triggers: How to Launch Your Beacon Tours at Just the Right Moment

Ever landed on a website and immediately had a tour pop up in your face? If you're like me, your first instinct is probably to close it. You probably weren't ready for it. But a well-timed, helpful tour? That's golden, especially when you're onboarding new users or rolling out a critical feature.

The difference isn't always the tour content itself; often, it's how the tour gets triggered. At Beacon, we give you a few powerful ways to control exactly when and where your tours appear. Choosing the right one makes all the difference between a delightful user experience and an intrusive one. Let's dig into each option.

1. URL Matching: Automatic Tours for Core Workflows

URL matching is your go-to for tours that need to start automatically when a user lands on a specific page. Think essential onboarding flows, mandatory compliance training, or guiding users through a brand-new feature the first time they encounter it.

Beacon's URL matching gives you three levels of precision:

• Exact Match: The tour only plays if the URL is identical to the one you specify. Use this for critical, single-page experiences like a final confirmation screen or a very specific report page. It's the most precise, and often, the safest choice.
• Starts With: This triggers the tour if the URL begins with your specified string. It's great for sections of your app that live under a common path, like /settings/profile or /dashboard/analytics. Just define /settings and any page within that section will trigger the tour. I've seen teams struggle with contains matching too broadly and accidentally triggering tours on pages where they're not relevant. Starts With often hits the sweet spot for breadth without overreach.
• Contains: The most flexible, but also the most potentially problematic if not used carefully. This will trigger the tour if your specified string appears anywhere in the URL. Use this for highly dynamic URLs where an exact path is unpredictable but a key identifier (like ?modal=true or a specific product ID) is always present. Just double-check your match string doesn't show up on unrelated pages.

To set this up, you'll configure it directly in the Beacon dashboard under your tour's settings. Just select 'URL Match' and input your pattern.

When to use URL Matching:

• Critical onboarding: Guiding new users through their first steps after signup.
• Mandatory training: Ensuring staff complete a specific workflow on a particular page.
• New feature adoption: Introducing a new UI element the moment a user first sees the relevant page.

2. Manual Launch: Contextual Help on Demand

Sometimes, you want a tour to be available, but only when a user explicitly asks for it. This is where manual launch comes in. It requires a tiny bit of code to integrate, but it gives you ultimate control over when a tour appears.

With manual launch, you'll use the Beacon SDK's Beacon.startTour(tourId) method. You get the tourId directly from your tour's settings in the Beacon dashboard (it's a UUID, like tour_abc123). Then, you can call this method from your application's code, typically tied to a button click, a specific event, or an element hovering.

For most contextual help tours, I actually prefer a manual launch. It puts the user in control, letting them decide when they need assistance. Sure, it requires a tiny bit of code on your end, like wiring up a 'Help' button in your UI, but that control over the user experience is worth it. Plus, it lets you trigger tours based on any event in your app, not just a URL change – a button click, a specific data load, a new state being reached, whatever you can dream up with JavaScript.

When to use Manual Launch:

• Contextual help: A small '?' icon next to a complex form field that launches a tour explaining it.
• Advanced integrations: Triggering a tour based on a specific user action or internal application state.
• Embedded support: A link in your application's internal help documentation that directly launches a relevant tour.

3. The Launcher Widget: Self-Service & Exploration

For a more hands-off, self-service approach, Beacon offers the launcher widget. This is a small, floating bubble (often in the corner of the screen) that, when clicked, reveals a list of all published tours relevant to the current page. Users can then browse and select the tour they want to start.

Think of the launcher widget as your friendly librarian. It's always there, but it won't interrupt you unless you approach it. It's perfect for a knowledge base of 'how-to' guides or for less critical, exploratory features where users might want to browse help topics at their own pace. You enable it globally in your project settings, and then individual tours can be marked as 'available via launcher'.

One thing I appreciate about the launcher is how it scales. As you build more tours, you don't need to embed individual buttons everywhere. Just add the tour to the launcher, and it becomes available, reducing UI clutter and keeping your app tidy.

When to use the Launcher Widget:

• Self-service support: Allowing users to find answers to common questions themselves.
• Exploratory learning: Letting users discover advanced features at their own pace.
• Internal knowledge bases: Providing staff with a quick way to access SOPs and training guides without navigating away.

Choosing the Right Trigger

There's no single best option; the right trigger depends entirely on your tour's purpose and your user's context.

• URL matching is powerful for mandatory or critical flows where immediate guidance is essential.
• Manual launch provides precise, contextual help for specific UI elements or user actions, offering a good balance of accessibility and user control.
• The launcher widget is ideal for self-service, exploration, and optional learning, keeping your main UI clean.

Consider your user's state, their intent, and the importance of the information. Don't be afraid to combine them – you might have an onboarding tour that's URL-matched, but a help tour for an advanced feature that's only available via a manual button or the launcher.

Ready to put these triggers into action? Build your first tour for free and experiment with how your users experience guided help.

Install the Chrome Extension or sign up to start building at https://dobeacon.com/signup