Explore the JavaScript API with interactive examples. Click any card to trigger the corresponding Beacon action.
⚠️ Tracking Protection Detected
Your browser's tracking protection (or an ad blocker) may be blocking Help Scout Beacon.
The Beacon script loads from beacon-v2.helpscout.net which can be blocked by:
Firefox Strict Mode — blocks cross-site cookies and tracking content
Brave Shields — blocks third-party scripts by default
uBlock Origin / AdBlock — may block beacon scripts
Privacy Badger — learns to block tracking-like behavior
Option 1: Add an exception for this site
Click the shield icon in Firefox's address bar
Toggle off "Enhanced Tracking Protection" for this site
Refresh the page
Option 2: Switch to Standard protection
Go to about:preferences#privacy
Select "Standard" instead of "Strict"
Refresh the page
Option 3: Use Custom settings
Go to about:preferences#privacy
Select "Custom"
Uncheck "Tracking content" or set it to "Only in Private Windows"
Refresh the page
For your production site:
Consider adding a similar detection message to help users who have strict privacy settings.
You can also implement a fallback contact method (like a simple mailto: link) for users who can't load the Beacon.
Initialize Beacon
⏸ Beacon not initialized. Enter your Beacon ID above to get started.
Basic Controls
🚀
Open Beacon
Opens the Beacon widget
Beacon('open')
✕
Close Beacon
Closes the Beacon widget
Beacon('close')
🔄
Toggle Beacon
Toggles open/close state
Beacon('toggle')
💥
Destroy Beacon
Unmounts Beacon from DOM
Beacon('destroy')
Navigation
🏠
Home Screen
Navigate to the welcome screen
Beacon('navigate', '/')
❓
Ask Screen
Navigate to the Ask screen
Beacon('navigate', '/ask/')
✉️
Message Form
Go directly to the message form
Beacon('navigate', '/ask/message/')
💬
Chat Screen
Open live chat (if enabled)
Beacon('navigate', '/ask/chat/')
📚
Answers Screen
Navigate to docs/answers
Beacon('navigate', '/answers/')
🤖
AI Answers
Navigate to AI Answers
Beacon('navigate', '/ai-answers/')
📜
Previous Messages
View conversation history
Beacon('navigate', '/previous-messages/')
Search & Content
🔍
Search Docs
Search documentation articles
Beacon('search', 'query')
💡
Ask AI Question
Send a question to AI Answers
Beacon('ask-question', '...')
📄
Open Article
Open a specific docs article by ID
Beacon('article', 'ARTICLE_ID')
✨
Suggest Articles
Suggest specific articles (comma-separated IDs)
Beacon('suggest', [...])
Form & Identity
👤
Identify User
Set user name and email
Beacon('identify', {...})
📝
Prefill Form
Pre-populate the contact form
Beacon('prefill', {...})
🔄
Reset Beacon
Clear all form data
Beacon('reset')
🚪
Logout User
Clear identified user data
Beacon('logout')
Configuration Examples
⬅️
Position: Left
Move Beacon to bottom-left
display: { position: 'left' }
➡️
Position: Right
Move Beacon to bottom-right
display: { position: 'right' }
⚫
Icon Only
Show only the icon button
display: { style: 'icon' }
💬
Icon + Text
Show icon with "Need Help?" text
display: { style: 'iconAndText' }
🎨
Blue Theme
Apply blue color theme
color: '#3B82F6'
🎨
Purple Theme
Apply purple color theme
color: '#8B5CF6'
Event Log
Events will appear here when Beacon is initialized...