How to add Elfsight widget to Lightspeed website

To add our Elfsight widget to your Lightspeed website, you need the installation code. Here is an article that explains where to get it - Where to get Elfsight widget installation code.

In this article

Simple way of adding your widget to a specific page

Unfortunately, adding a widget to Lightspeed website is limited by the themes' settings - each of them has a designated spot for extra content on the page and it makes it impossible to add the widget to any place you want. If you need to install the widget to a specific spot, please follow the steps of Advanced installation

To make the widget work, the website should initialize the platform which is the first line of our widget installation codes. Unfortunately, Lightspeed automatically removes the platform from the widget's code. That's why before installing the widget you need to add the platform manually. 

1
Add the widget's platform to your website

Open the  Settings tab:

Go to Website Settings -> Web Extras:

Find Custom Head Code section and press Add code:

Add this URL https://apps.elfsight.com/p/platform.js to the External script URL field and click on Save:

The platform is added and now you can add the installation code itself.

2
Open the page's editor 
Log in to your Lightspeed account and go to your website's Content -> Pages tab:

Select the page you'd like to edit:

3

Add the widget installation code
Find the Content section and click on Source code:

Add the code and press the Ok button:

Voila! The widget is installed to your Lightspeed theme!

Advanced way of adding your widget to a specific page

Using this way you'll have the possibility to add the widget to any spot of your website. However, please be careful, edit the code only if you're confident with what you're doing.

If you're not sure how to edit your website's code, please contact our Support Team, our developers would be glad to install the widget for you!
1
Open your website's Theme Editor

Log in to your website's backend and open  Design -> Theme Editor tab:

2
Choose the page where you'd like to install the widget
Select the file of the page you need to edit. For example, to place the widget to the homepage, index.rain is the file you need:

3
Paste the installation code

Select the spot where you'd like the widget to be and paste the installation code. For example, if you want your widget at the bottom of the page, please add the code to the end of the document and press Save:

Done! You've successfully installed your inline widget to a specific position.

Adding your inline widget to all pages

1
Go to your Lightspeed Theme editor
Log in to your Lightspeed dashboard and go to  Design ->  Theme Editor tab:

2
Edit your theme’s code
Open Advanced tab and click on Edit code button:
Please keep in mind that after editing the theme's code you'll stop receiving automatic theme updates. Don't worry, if you want to restore the original theme, you'll just need to reinstall it from the Lightspeed Theme Store. 

3
Select the custom.rain file's editor
Select the  custom.rain file in the Layouts section:

4
Add the widget installation code
Paste the widget installation code before the closing </main> tag and click on Save:

Voila! Your inline widget is installed on all pages of your website!

Adding your floating widget to all pages

1
Go to your Lightspeed Theme editor

Log in to your Lightspeed dashboard and go to Design -> Theme Editor tab:

2
Edit your theme’s code
Open the  Advanced tab and click on Edit code button:
Please keep in mind that after editing the theme's code you'll stop receiving automatic theme updates. Don't worry, if you want to restore the original theme, you'll just need to reinstall it from the Lightspeed Theme Store. 

3
Insert the code to the website's footer
Find the footer.rain file, add your widget installation code to the end of the file and press Save:

Done! You've successfully installed a floating widget to your Lightspeed website.

Did this article answer your question? Share your feedback: Thanks for sharing your feedback. It helps us grow! There was a problem submitting your feedback. Please try again later.

Still looking for assistance? Contact Us Contact Us