Skip to main content

How To Embed Calculator Into Squarespace

In this tutorial you will learn how to embed Creative Widgets calculator into your Squarespace website.

How to Embed Creative Widgets Calculator within Liquid Theme Preview​

Here's a step-by-step guide for embedding a Creative Widgets calculator into a Squarespace web using the Code component:

Navigate to Page Editor​

Open your Squarespace admin panel and navigate to the page where you want to add the calculator. Click Edit to open the page editor.

Add New Section​

Click the Add Section button at the location where you want the calculator to appear on your page.

Insert Code Block​

From the block menu, search for and select the Code block. This allows you to embed custom HTML and scripts into your Squarespace page.

Paste Calculator Code​

Copy the HTML embed snippet from your Creative Widgets Editor. Paste the complete code into the Code block editor, ensure that the Display Source Code is not selected.

Preview in Safe Mode​

Click the Preview in Safe Mode button within the Code block settings. This allows you to view how the calculator will render with scripts enabled before publishing.

Verify Placement​

Review the calculator's position and functionality on the page. Ensure it displays correctly and all interactive elements work as expected. Save and publish your changes when satisfied.

This method integrates the calculator seamlessly into your Squarespace site without requiring custom theme modifications, making it accessible for any page layout.