Here is a simple way to make your Táve contact form fit in with your Squarespace website.

Enter the Following Code into a Code Block on Your Contact Page

To embed the contact form into your Squarespace website, you will insert a code block on your contact page wherever you’d like the form to appear, and paste the code provided below like so.  See the explanation below the code, as you will need to make one or two minor changes to customize it for your Táve contact form.

<iframe id="taveForm" src="https://tave.com/yourstudioname-inline" width="100%" height="1400px" frameborder="0" scrolling="no"></iframe>

You need to change the part that says yourstudioname-inline to what you see at the tail end of your brand’s secure domain (URL for Embedding) on your Branding page in Táve.  If you copy and paste the entire URL, be sure to change it to https:, not http:!

That is the only part of the code you need to change, and it should be up and running easily for you once you put it all in the right places.  Note that you can also change the height of the form in the code block, like I did above, changing it from 1400px to 800px, if your contact form is too long or short for the default 1400px.  Be sure to test out your contact form on a mobile device to check which length is ideal for your form.

Redirecting an Embedded Contact Form

If you are redirecting your embedded contact form to a new URL, you'll need to add a specific script to your branding settings so that the redirect doesn't happen inside of the iFrame. To do this, simply go to Settings › Branding › Advanced Design Editor and then click on the Page Footer HTML tab. You'll then copy and paste the following code into the box: 

<script id="RedirectJS" src="https://tave.com/static/Permalinks/InlineBreakout.js" type="text/javascript"></script>

It should look like this:

Did this answer your question?