How to add Elfsight widget to a Squarespace website

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

If you are a New Dashboard user, you can find the installation code of your widget following the steps described in this article - Where to get Elfsight widget installation code (new dashboard).

In this article

Adding your inline widget to a specific page

1
Go to Squarespace admin panel
Log in to your Squarespace account and choose the website where you'd like to add the widget:
2
Open the page settings
Select the Website section on the left side menu:

Choose the page you'd like to add the widget to and click Edit:

3
Add section for the block
Choose the needed place for your widget and click Add Section there:

Click Add a blank section option in the popup window:

4
Add block for the installation code
Push the Add block button and choose the Code option:
5
Paste the installation code
Click on the Edit icon and paste the widget installation code in the Content popup:
6
Adjust the Block size
Change the block's width by dragging the widget's border to the right:

Adding your floating widget to a specific page

1
Go to Squarespace admin panel
Log in to your Squarespace account and choose the website where you'd like to add the widget:
2
Open the page settings
Click on the Website section on the left side menu: Choose the page you'd like to add the widget to and click on the Gear icon:
3
Paste the installation code
Go to the  Advanced tab, paste the installation code, and click Save to apply changes:

Well done! You have successfully added your floating widget to a specific page of your Squarespace website!

Adding your widget to all pages

1
Go to Squarespace admin panel
Log in to your Squarespace account and choose the website where you'd like to add the widget:
2
Open your website's settings
Click on the Settings section on the left side menu: Then select the Developer Tools tab: And choose Code Injection:
3
Paste the installation code
Paste the widget installation code into the Footer field and click Save:

Great! You have successfully added the widget to all pages of your Squarespace website!

Adding your widget on a Personal Squarespace plan

Due to the peculiarities of the Squarespace platform, users with a free or Personal Squarespace plan are not allowed to add HTML codes to their websites. The Code Injection feature is available for Business and Commerce plans only. However, there's a workaround for the Personal Squarespace plan that you can try.

1

Go to Squarespace admin panel
Log in to your Squarespace account and choose the website where you'd like to add the widget:

2
Open your page settings
Click on the  Website section on the left side menu and then click Edit:
3
Add section for the block
Choose the needed place for your widget and click Add Section there:

Click Add a blank section option in the popup window:

4

Add block for the installation code
Push the Add block button and choose the Markdown option:

5

Paste the installation code
Click on the Edit icon and paste the widget installation code in the Content popup:

The widget may not appear in the block right away. In this case, save the changes and go back to editing, the widget will be visible.

6

Adjust the Block's size
Change the block's width by dragging the widget's border to the right:


Please note that if your website uses Ajax, the widget may not be displayed until the page is refreshed. Here is an article explaining how to prevent such a situation.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us