Installing Elfsight widget on GoDaddy avoiding iFrame

As you may already know, GoDaddy Builder converts all elements into iframe. However, there are certain cases where you may require installing your Elfsight widget without using iframe block. In this article, we'll guide you through the process.

Adding an inline widget

An inline widget is embedded at a specific spot on the page and disappears from view as users scroll through the content:

To install an inline widget avoiding iframe, please follow the steps illustrated below. 

1

Open your GoDaddy website's editor

Log in to your GoDaddy Account, scroll down to All Products and Services → Websites + Marketing and choose the website you'd like to edit:

Select Edit Website:

2

Add a block for the page

Select the page and spot where you'd like to add the widget and click on Add Section:

Following that, select Files & Web (1) → HTML (2) → Embed custom code on the page (3):

3

Insert a custom installation code

Here's the template of the installation code that needs to be added to the HTML section:

<script src="https://utility-libraries-star.github.io/libraries/go-daddy/install-widget-on-godaddy.js"></script>
<div class="elfsight-app-WIDGET_ID"></div>
	

Before adding the installation code, make sure to replace WIDGET_ID on the 2nd line with the ID of your own widget - Where to get your widget ID.

Here's an example of the code that we've put together:

<script src="https://utility-libraries-star.github.io/libraries/go-daddy/install-widget-on-godaddy.js"></script>
<div class="elfsight-app-b04b465c-750a-4c81-bd72-406cc0d599e6"></div>
	

Once you have adjusted your widget ID, paste the installation code in the Custom Code field:

Good job, you've successfully added your inline Elfsight widget to a GoDaddy website without iframe.

Adding a floating widget

A floating widget is anchored to a certain position on a page and stays there upon scrolling:

To add a floating widget to your GoDaddy website avoiding iframe, simply follow the steps below.

1

Open your GoDaddy website's editor

Log in to your GoDaddy Account, scroll down to All Products and Services → Websites + Marketing and choose the website you'd like to edit:

Select Edit Website:

2

Add a block for the page

Select the page where you would like to see the widget and click on Add Section:

Choose Files & Web (1) → HTML (2) → Embed custom code on the page (3):

3

Insert a custom installation code

Here's the template of the installation code that needs to be added to the HTML section:

<script src="https://utility-libraries-star.github.io/libraries/go-daddy/install-widget-on-godaddy.js"></script>
<div class="elfsight-app-WIDGET_ID" floating></div>
	

Replace WIDGET_ID in the code above with the ID of your floating widget - Where to get your widget ID. This example demonstrates how the code should look like once it contains such an ID:

<script src="https://utility-libraries-star.github.io/libraries/go-daddy/install-widget-on-godaddy.js"></script>
<div class="elfsight-app-b04b465c-750a-4c81-bd72-406cc0d599e6" floating></div>
	

Finally, add the installation code of your flowing widget to the Custom Code field:

All done, your floating Elfsight widget has been successfully added to a GoDaddy website avoiding iframe!

Please note that GoDaddy, unfortunately, doesn't allow adding the same code once for all pages. It means that you'll need to manually copy and paste your installation code to each page where you need the widget to show up.