Install/Embed Beacon

Beacon Docs

Back to Dashboard

Search…

Beacon

Beacon can be easily embedded on your webpage by just pasting the code that is provided on your dashboard. In the documentation, you will find video tutorials on how to install beacon window on commonly used channels for creating websites. The main procedure remains the same for all the other channels too, you can contact me if you have some problems in installing the beacon window.
The embed code follows the following structure.
<!-- This is the beacon-app element, it supports
certain attributes that can be found in SDK. Use it
directly in your web page -->
<beacon-app key="<BEACON_KEY>"></beacon-app>
<!-- This script contains the main magic, use it wherever
you decide to add the beacon-app element -->
<script src="https://beaconapp.in/b.js"></script>
Both <script> , <beacon-app> tags should be present on the same page for beacon window to work correctly.
How to get the embed code?
Follow the following steps to get the Beacon embed code.
Go the main dashboard overview page (once you are logged in).
Select a Beacon from the list that you want to embed. This will open the Beacon editor.
Click on the Embed button, this will open a dialog with the embed code that you can copy.
Additionally, you can modify the Position of the beacon window on your page.
Position
Part of Beacon SDK​
The position of the beacon window can be changed while embedding it on the web page. The <beacon-app> element has an attribute pos that sets the position of the beacon window on the page.
These are the positions that Beacon currently supports along with how it can be added to the <beacon-app> element:
Bottom left - pos="left"
Bottom right - pos="right"
By default, the position is Bottom left.
After adding the pos attribute, the code looks like
<beacon-app key="<BEACON_KEY>" pos="right"></beacon-app>
​

Options

HTML

Last modified 4yr ago

Copy link

On this page

How to get the embed code?

Position