Table of Contents
Installing Lighthouse
Lighthouse is a widget that helps you assist your users within your app whenever they get stuck. This means your users can help themselves without ever leaving your site and you'll reduce repetitive support tickets.
Lighthouse is a widget that helps you assist your users within your app whenever they get stuck. This means your users can help themselves without ever leaving your site and you'll reduce repetitive support tickets.
The Lighthouse widget is highly customizable with a variety of options to make it look and act the way you want.
Before you start π
To get started with Lighthouse, you'll need:
- A HelpDocs account
- You'll need to be on the 14 day free trial or on a specific plan
- A technical team member who is able to paste code within your app
Finding the code snippet π
You can find the JavaScript code snippet by heading to Settings > Lighthouse (or click here) and tick Enable Lighthouse. Hit Save, and in the snippet on that page we'll insert your widget_key
for you.
Alternatively you can copy and paste the code below into your, making sure you replace WIDGET_KEY with your widget key.
<script type="text/javascript">
window.hdlh = {
widget_key: "WIDGET_KEY"
};
(function(h,d){var s=d.createElement("script");s.type='text/javascript';s.async=true;s.src=h+"?t="+new Date().getTime();d.head.appendChild(s);})("https://lighthouse.helpdocs.io/load",document);
</script>
Placing the code snippet π
When inserting Lighthouse into your app, you'll need to paste the code snippet before the closingΒ </body>
Β tag on every page you'd like to display the widget. Here's an example:
<!DOCTYPE html>
<html>
<body>
<h1>Hello World</h1>
// HelpDocs Lighthouse
<script type="text/javascript">
window.hdlh = {
widget_key: "WIDGET_KEY"
};
(function(h,d){var s=d.createElement("script");s.type='text/javascript';s.async=true;s.src=h+"?t="+new Date().getTime();d.head.appendChild(s);})("https://lighthouse.helpdocs.io/load",document);
</script>
</body>
</html>
Customizing Lighthouse π¨
Now you've installed the widget within your app, it's time to make it your own. To start customizing head to the Widget API and start adjusting the config values and/or using the methods provided. Have fun!
What did you think of this doc?
Integrating Lighthouse with Live Chat Providers
Adding Lighthouse Trigger Buttons to Webflow