Squarespace Integration Guide

Complete guide to integrate MyFormConnect with Squarespace

Setup time: 5-10 minutes

Difficulty: Easy

Compatible versions: Squarespace 7.0, 7.1

Integrate MyFormConnect with your Squarespace website to capture leads from contact forms and custom pages. Squarespace powers millions of websites with beautiful, professional designs.

Prerequisites

A MyFormConnect account - Sign up here
Your MyFormConnect integration code from your dashboard
Squarespace site admin access
Squarespace Personal plan or higher (Business/Commerce recommended)
Active Squarespace website (7.0 or 7.1)

Integration Methods

Code Injection

5 minutes Easy

Use Squarespace's built-in Code Injection feature to add MyFormConnect site-wide. This is the recommended method for most users.

Access Code Injection Settings

Navigate to the Code Injection section in your Squarespace settings.

Log into your Squarespace account
Go to Settings → Advanced
Click Code Injection
You'll see Header and Footer code areas

Important Note

Code Injection is available on Personal plans and higher. Free trial sites have limited access.

Add MyFormConnect to Header

Insert your MyFormConnect code in the Header Code Injection area.

Click in the Header code box
Paste your MyFormConnect integration code
Click Save at the bottom of the page

<!-- MyFormConnect Integration for Squarespace -->
<script>
(function() {
  var script = document.createElement('script');
  script.src = 'https://widget.myformconnect.io/widget.js';
  script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
  script.setAttribute('data-squarespace', 'true');
  document.head.appendChild(script);
})();
</script>

Important Note

The data-squarespace attribute helps optimize the widget for Squarespace-specific features and styling.

Test the Integration

Verify that MyFormConnect is working correctly on your Squarespace site.

Visit your live website (not the editor preview)
Look for the MyFormConnect widget (usually a floating button)
Test the callback form by filling it out
Check your MyFormConnect dashboard for the test submission

Important Note

Changes may take a few minutes to appear. Clear browser cache if you don't see the widget immediately.

Page-Specific Code Block

8 minutes Easy

Add MyFormConnect to specific pages using Squarespace's Code Block feature for targeted placement.

Add Code Block to Page

Insert a Code Block element on the specific page where you want MyFormConnect.

Open the page editor for your target page
Click the + (Add Block) button
Search for and select Code block
Place the code block on your page

Configure Code Block

Add the MyFormConnect integration code to the Code Block.

Click on the Code Block to edit it
Select HTML as the code type
Paste your MyFormConnect code
Click outside the block to save

<script>
(function() {
  // Check if MyFormConnect is already loaded to prevent duplicates
  if (!window.callmebackLoaded) {
    var script = document.createElement('script');
    script.src = 'https://widget.myformconnect.io/widget.js';
    script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
    script.setAttribute('data-squarespace', 'true');
    document.head.appendChild(script);
    window.callmebackLoaded = true;
  }
})();
</script>

Important Note

This method is useful for landing pages or specific sections where you want targeted lead capture.

Position and Style

Adjust the Code Block position and styling as needed.

Drag the Code Block to your desired location
The block itself will be invisible but will load MyFormConnect
Preview your page to test the integration
Publish your changes when ready

Troubleshooting

Still having issues?

Can't find the answer you're looking for? Our support team is here to help with your integration.

Contact Support

Related Integrations

References & Official Documentation

Next Steps

Configure MyFormConnect

Set up your timezone
Configure lead notifications
Set up advanced spam detection
Add team members to your account

Advanced Features

Use our custom form templates
Try AI Insights for Leads
Integrate with your CRM
Set up automated workflows

Need Help?

Our support team is here to help you with your integration.

Contact Support

Prerequisites

A MyFormConnect account - Sign up here
Your MyFormConnect integration code from your dashboard
Squarespace site admin access
Squarespace Personal plan or higher (Business/Commerce recommended)
Active Squarespace website (7.0 or 7.1)

Integration Methods

Code Injection

5 minutes Easy

Use Squarespace's built-in Code Injection feature to add MyFormConnect site-wide. This is the recommended method for most users.

Access Code Injection Settings

Navigate to the Code Injection section in your Squarespace settings.

Log into your Squarespace account
Go to Settings → Advanced
Click Code Injection
You'll see Header and Footer code areas

Important Note

Code Injection is available on Personal plans and higher. Free trial sites have limited access.

Add MyFormConnect to Header

Insert your MyFormConnect code in the Header Code Injection area.

Click in the Header code box
Paste your MyFormConnect integration code
Click Save at the bottom of the page

<!-- MyFormConnect Integration for Squarespace -->
<script>
(function() {
  var script = document.createElement('script');
  script.src = 'https://widget.myformconnect.io/widget.js';
  script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
  script.setAttribute('data-squarespace', 'true');
  document.head.appendChild(script);
})();
</script>

Important Note

The data-squarespace attribute helps optimize the widget for Squarespace-specific features and styling.

Test the Integration

Verify that MyFormConnect is working correctly on your Squarespace site.

Visit your live website (not the editor preview)
Look for the MyFormConnect widget (usually a floating button)
Test the callback form by filling it out
Check your MyFormConnect dashboard for the test submission

Important Note

Changes may take a few minutes to appear. Clear browser cache if you don't see the widget immediately.

Page-Specific Code Block

8 minutes Easy

Add MyFormConnect to specific pages using Squarespace's Code Block feature for targeted placement.

Add Code Block to Page

Insert a Code Block element on the specific page where you want MyFormConnect.

Open the page editor for your target page
Click the + (Add Block) button
Search for and select Code block
Place the code block on your page

Configure Code Block

Add the MyFormConnect integration code to the Code Block.

Click on the Code Block to edit it
Select HTML as the code type
Paste your MyFormConnect code
Click outside the block to save

<script>
(function() {
  // Check if MyFormConnect is already loaded to prevent duplicates
  if (!window.callmebackLoaded) {
    var script = document.createElement('script');
    script.src = 'https://widget.myformconnect.io/widget.js';
    script.setAttribute('data-account', 'YOUR_ACCOUNT_ID');
    script.setAttribute('data-squarespace', 'true');
    document.head.appendChild(script);
    window.callmebackLoaded = true;
  }
})();
</script>

Important Note

This method is useful for landing pages or specific sections where you want targeted lead capture.

Position and Style

Adjust the Code Block position and styling as needed.

Drag the Code Block to your desired location
The block itself will be invisible but will load MyFormConnect
Preview your page to test the integration
Publish your changes when ready

Troubleshooting

Still having issues?

Can't find the answer you're looking for? Our support team is here to help with your integration.

Contact Support

References & Official Documentation

Next Steps

Configure MyFormConnect

Set up your timezone
Configure lead notifications
Set up advanced spam detection
Add team members to your account

Advanced Features

Use our custom form templates
Try AI Insights for Leads
Integrate with your CRM
Set up automated workflows

Squarespace Integration Guide

Prerequisites

Integration Methods

Code Injection

Access Code Injection Settings

Important Note

Add MyFormConnect to Header

Important Note

Test the Integration

Important Note

Page-Specific Code Block

Add Code Block to Page

Configure Code Block

Important Note

Position and Style

Troubleshooting

Still having issues?

Related Integrations

References & Official Documentation

Next Steps

Configure MyFormConnect

Advanced Features

Need Help?

Squarespace Integration Guide

Prerequisites

Integration Methods

Code Injection

Access Code Injection Settings

Important Note

Add MyFormConnect to Header

Important Note

Test the Integration

Important Note

Page-Specific Code Block

Add Code Block to Page

Configure Code Block

Important Note

Position and Style

Troubleshooting

Still having issues?

Related Integrations

References & Official Documentation

Next Steps

Configure MyFormConnect

Advanced Features

Need Help?

MyFormConnect - Request Demo

Thank you for scheduling a demo!

MyFormConnect - Any issues?

Thank you for your request!

MyFormConnect - Tailored Solution