Adding Elfsight widget to Wix website
You've made the decision to enhance your Wix website by incorporating your Elfsight widget, but unsure of where to start? This step-by-step guide will navigate you through the whole installation process.
In order to add the widget to your Wix website, you'll need its installation code. If you don't know where to find it, please take a look at the following article - Where to get Elfsight widget installation code.
In this article
A floating widget is anchored to a certain position on a page and stays there upon scrolling.
Adding your widget to a specific page
- 1
- Go to Wix website editor
Log in to your Wix account and choose the website where you'd like to add the widget. Click Edit Site:
- 2
- Add HTML block
Click the Plus icon (1), go to the Embed Code section (2) and select Embed HTML (3) on the Popular Embeds tab:
- 3
- Paste the installation code
Click Enter Code (1), paste your installation code (2) and press Update (3):
- 4
- Adjust the widget's size and position
Drag the widget to the right page area and stretch it to get the size you need. Keep stretching until scroll bars are gone and all the required information fits into the block:
- 5
- Adjust the mobile appearance and Publish
Switch to the mobile editor by clicking on the Mobile icon (1), adjust your widget's size by stretching it (2), and press Publish (3):
The Wix Website Builder is built on iframes, which sometimes can cause certain issues. If you encounter issues caused by iframe, you can try installing your Elfsight widget using an alternative method - Installing Elfsight widget on Wix avoiding iFrame.
Well done. You have successfully added your Elfsight widget to a specific page of your Wix website!
Adding your inline widget to all pages
- 1
- Go to Wix website editor
Log in to your Wix account and choose the website where you'd like to add the widget. Click Edit Site:
- 2
- Add HTML block
Click Plus icon (1), go to Embed section (2) and select Embed a Widget (3) on Custom Embeds tab:
- 3
- Paste the installation code
Click Enter Code (1), paste your installation code (2) and press Update (3):
- 4
- Adjust the widget's size and position
Drag the widget to the right page area and stretch it to get the size you require. Keep stretching until scroll bars are gone and all the required information fits into the block:
- 5
- Publish the widget to all pages
Right-click on the widget's container → select Pin to Screen (1) → turn on Show on All Pages (2) toggle and click Publish (3):
You have successfully added your inline widget to all pages of your Wix website!
Adding your floating widget to all pages
- 1
- Go to Wix website dashboard
Log in to your Wix account and choose the website where you'd like to add the widget. Click on the Settings (1) section in your Dashboard menu, find the Advanced section and choose Custom code (2):
- 2
- Add Custom Code
Click on the + Add Custom Code button in the right upper corner:
- 3
-
Insert the widget’s installation code into the Paste the code snippet here field. In the Place Code in options, select Body - start, then click Apply to save the changes.
If you want to add the widget to a specific page, click Choose specific pages, select the page from the dropdown, choose Body - start in the Place Code in options, and click Apply.
Great job! You have successfully installed your floating widget on your Wix website!