Getting Started
Setting Up a Custom Domain
Managing Users
Setting or Updating the Name in Your Profile
Can I Schedule a Demo?
The HelpDocs Trial
Setting the URL Style for your Articles
Switching Between Multiple Accounts
Adding or Changing Your Profile Image
Logging In To Your HelpDocs
Understanding Smart 404 Pages
Understanding Top Articles
Writing and Editing Articles
Stale Articles
Text Editor
Content Blocks
Using Markdown Blocks
Adding an HTML Block
Inserting Videos
Adding Embeddables
Using Code Blocks
Getting Started with Content Blocks
Using Quote Blocks
Editing Images
Inserting Images
Understanding Article Statuses
Article Backups, Revisions, and Versioning
Managing Clips
Text Editor Shortcuts
Adding Tags to Articles
Using Folds
Using Ordered Lists
Moving an Article to a Different Category
Inserting Images into Ordered Lists
Adding Note, Tip, and Warning Callouts
Switching the Editor Mode
Adding Buttons
Unassigned Articles
Hiding Articles from Public Search Engines
Exporting & Backing Up Your Articles
Understanding Search Results
Duplicating an Article
Incompatible Browser Extensions
Filtering Articles
Downloading Articles to PDF
Deleting an Article
What is Readability?
Collaborating on Articles with Presence
Adding a Table of Contents
Restoring Deleted Articles
Editing Category Metadata
Delete a Category
Featuring an Article
Creating Draft Versions of Published Articles with Working Copy
Bulk Select & Edit Multiple Articles
Creating a Subcategory
Hidden Categories
Linking to a Part of an Article
Previewing Articles
Using help.new to Create Articles
Setting Up Integrations
Front Integration
Slack Integration
Available Commands in Your Slack Workspace
Get Feedback, Activity, and Contact Form Notifications in Slack
Installing the Slack Integration
Sharing Articles From HelpDocs to Slack
Configuring Your Slack Integration
Intercom Integration
Drift Integration
Chrome Extension
Connecting Heap
Connecting Google Analytics
Adding a Feedier Carrier
Adding Hotjar
Connecting Gorgias
Connecting Lucidchart
Connecting GoSquared
Connecting Gainsight PX
Connecting Segment
Connecting Kommunicate
Using HelpDocs with Ticketing Systems
Connecting LiveChat
Connecting Chatra
Connecting Statuspage
Connecting Crisp
Connecting Belco
Syncing Content to elevio
Adding FullStory
Enabling Comments with Disqus
Connecting Doorbell
Connecting Sunshine Conversations
Connecting Hyperping
Customizing your HelpDocs
Code Snippets
Condense Top Article Spacing on Bars V4
Adding Lightboxes to Images
Overriding the Font on Your Knowledge Base
Making Your Printed HelpDocs Look Nicer
Making Video Embeds Responsive
Disabling Authorship and Updated Times
Getting Help with Code Snippets
Disabling Top Articles
Using Different List Styles
Using HelpDocs with RTL Languages
Disabling Related Articles
Using a Background Image in the Header
Making Tables Scroll When They're Too Wide for the Page
How to Change the Logo Link
How to Add Extra Spacing
Add HTML Before the Closing Body Tag
Customizing Feedback Icons
Custom HTML Templates
Setting a Custom Favicon
Customizing an Article Slug, Meta Description & Short Version
Understanding the Contact Form
Changing the Language in Common Phrases
Hiding the Contact Button
Adding Custom CSS
Setting Article Display Order
Adding Custom Navigation Links
Setting Category Display Order
Uploading Your Brand Logo
Adding URL Redirects
Featuring a Category
Adding Icons to Categories
Hosting HelpDocs at a Subfolder of Your Site
Adding an Open Graph Fallback Image
Choosing a Template
Testing Customizations with .dev
Adding Custom JavaScript
Adding Cookie Consent
Lighthouse
Understanding Lighthouse
Lighthouse Widget API
Integrating Lighthouse with Live Chat Providers
Installing Lighthouse
Adding Lighthouse Trigger Buttons to Webflow
Data & Analytics
Understanding Productivity with Leaderboard
Filtering Stats
Getting Team Event History with Audit Trail
Understanding Articles Clicked
What are Tickets Avoided?
Exporting Your Stats
What is the Happiness Score?
Multilingual Translation
Machine Translations
Understanding Machine Translation Credits
Customizing How Machine Translations Work
Automatically Translate Articles with Machine Translations
Setting Up Multilingual
Understanding Multilingual Translation
Translating Categories
Translating Articles
Permissioning
Creating a Read-Only Permission Group for Public Articles
Creating and Managing Permission Groups
Getting Started with Permissioning
Assigning Permission Groups to Categories
Assigning Permission Groups to Articles
Removing Permission Groups from Articles
Authentication
Setting Up Two-Factor Authentication
Setting Up and Using SAML Single Sign-On
Restricting your HelpDocs with Custom JWT SSO
Using OpenID Connect for Single Sign On
Configuring Slack Single Sign On
Restricting Your Docs to Logged In Users
Shared Password Protection
Accessing User Data in HelpDocs
Security & Compliance
Anonymizing IP Addresses
Setting Custom HTTP Headers
Is HelpDocs GDPR compliant?
Signing a Data Processing Agreement (DPA)
Is my data secure and protected?
Billing
Cancelling Your Account
Downloading Invoices and Receipts
Updating Your Billing Information
Changing Your Plan
Subscribing to a Plan for the First Time
European Union VAT Charges
Tax Residency Certificates and Forms
FAQs
Can I embed files into HelpDocs?
I can't log in to my HelpDocs account or complete signup
How do I reset my password?
How do I change my email?
Can I use multiple HelpDocs accounts together?
Can I migrate or import my data from another service?
Who counts towards the user limit on plans?
Can I Change the HelpDocs Branding?
Can I have a single article appear in multiple categories?
Can I host my internal docs in HelpDocs?
Iβm seeing a blank screen when I load my knowledge base
Help! No articles are appearing on my knowledge base
What is an account slug?
I've added a script but it isn't working
Help! My app's not loading π
How do related articles work?
Can I host my API docs in HelpDocs?
Will translated articles be deleted if I remove that language?
My Article Has a Blank Space to the Left. What's Wrong?
One of my headings isn't showing in the table of contents
I'm getting 'Your connection is not private' on my custom domain
HelpDocs Support Scope
How do I publish an article that's not available in the default language?
Why isn't my contact form showing up?
Guides
Optimizing Your Knowledge Base for Search
Creating a Knowledge Base from Scratch
Finding CSS Selectors in Your Browser
Clearing the Cache in Your Browser
Writing Clear and Digestible Knowledge Base Articles
Resources
- Knowledge Base
- Lighthouse
- Adding Lighthouse Trigger Buttons to Webflow
Adding Lighthouse Trigger Buttons to Webflow
Updated
by River Sloane
Using Webflow for your site but want to open up an article or category when clicking on an element with HelpDocs Lighthouse? You'll need to implement some custom code to get it working properly.
This is what you should end up with:

Adding Lighthouse Data Attributes to Triggers
- First of all you'll want to have an icon ready you'd like to use. A help icon should do the trick. If you don't have one handy, feel free to use ours by downloading ours here.We can't help with the placing or making of Webflow elements.
- You'll want to wrap the image in a link block. It should look something like this (we've added the
Lighthouse Link
class to our link block): - Select the Link Block, then on the right hand panel select the Element Settings (or cog icon):
- Add a Custom Attribute and name the class
data-lighthouse
- Want to open up an article? Use
article-ARTICLEIDHERE
- Want to open up a category? Use
category-CATEGORYIDHERE
- Want to open up an article? Use
Making the Triggers Work with Lighthouse
To make the data attributes work properly, you'll want to paste in some custom code. We recommend placing it in your Webflow Website Footer. You can find that in the Custom Code section of your Webflow account.
dataAttribute
value if you'd like to use a different name π// You can replace the data attribute name here
var dataAttribute = 'data-lighthouse';
// Get all elements on the page with the data attribute
var dataEls = document.querySelectorAll(`[${dataAttribute}]`);
try {
if (!dataEls) throw 'No data-lighthouse found on this page';
Array.prototype.forEach.call(dataEls, dEl => {
var data = dEl.getAttribute(dataAttribute);
if (!data) throw 'Could\'nt find data attribute';
data = data.split('-');
if (data.length !== 2) throw 'You need to include a method and content ID';
dEl.setAttribute('onclick', `Lighthouse.navigate('${data[0]}','${data[1]}')`);
});
} catch (e) {
console.log(e);
}