Skip to main content
All CollectionsWidgetsHow to embed widget in CMS and Page Builders
How to Embed a Widget on Your Website: A Universal Guide
How to Embed a Widget on Your Website: A Universal Guide
Updated over 2 months ago

Embedding a widget on your website is an excellent way to add functionality and enhance user interaction. This guide will walk you through embedding a widget using JavaScript code within a standard HTML block. This guide is suitable for most popular content management systems (CMS) and website builders.

Step 1: Obtain the Widget Code

Before you can embed the widget, you need to obtain the JavaScript code for the widget. This code is usually provided by the widget developer or available on the widget provider's website. The code consists of a script that you need to insert into your site.

Step 2: Open Your Website Editor

To embed the widget, you need to open your website editor. The process may vary slightly depending on the platform you are using:

  • WordPress: In the admin panel, go to "Appearance" -> "Editor" or "Widgets".

  • Wix: In the Wix editor, select "Add" -> "Embed" -> "HTML iframe".

  • Squarespace: In the editor, go to "Pages" -> "Edit" -> "Code Block".

  • Weebly: In the Weebly editor, select "Embed Code" and add an HTML block.

  • Joomla: In the admin panel, go to "Modules" -> "Create" -> "Custom HTML".

Step 3: Add an HTML Block

Most website builders and CMS platforms offer the ability to add an HTML block to your page. Find this option in your editor. This HTML block allows you to insert custom HTML and JavaScript code.

Step 4: Insert the Widget Code

Insert the JavaScript widget code you obtained into the HTML block you added to your site. Ensure the code is inserted correctly and completely.

Step 5: Save Changes

After inserting the widget code, save your changes and publish them on your site. This action might be labeled "Save", "Publish", or something similar, depending on the platform.

Step 6: Verify the Widget

Visit your website and ensure the widget is displayed and functioning correctly. If the widget does not appear, try refreshing the page or clearing your browser cache.

Conclusion

Embedding a widget using JavaScript code is a simple and effective way to enhance your website. By following these steps, you can quickly and easily integrate any widget using a standard HTML block, available in most CMS and website builders.

Did this answer your question?