Squarespace Tutorial: 4 Steps Contact Form Database

If today were an emoji, it would be the facepalm emoji x 10000.

🤦🏼‍♀️🤦🏼‍♀️🤦🏼‍♀️🤦🏼‍♀️🤦🏼‍♀️🤦🏼‍♀️

TODAY, I legit realized that when I redesigned my website, my new contact form WAS NOT connected to my new email address, therefore meaning that new clients were trying to contact me and I couldn’t even see their form submissions! GAH!

Thankfully, I had set up my contact form to back up to a Google Spreadsheet Database. Here are my 4 steps for how to connect your contact form (or any form on Squarespace for that matter) to a Google Spreadsheet Database.

To start, here are some reasons why you might want to think about backing things up to databases:

  • save your ass for when this happens

  • to track your month over month inquiries

  • to give yourself an ‘all at once’ view of who is interested in your services

  • to see how many jobs come to fruition i.e. I like to color code mine after out consultation to see which ones went through and which did not.


tko web.png

Step 1 - Login in to your Squarespace Account.

A NOTE ON SQUARESPACE: I love to use Squarespace for my clients’ websites for a few reasons…mostly because Squarespace is super user friendly, as the design elements are drag and drop. Also, SS doesn’t have plug-ins like wordpress, meaning you won’t have to be constantly updating to make sure that features work. Also, I think that SS is a great platform for showing off your branding. DUH.


Screen Shot 2019-05-21 at 5.21.28 PM.png

Step 2 - Find your Contact Page

This may be in a few different places depending on how your site was set up. Your contact form may be in your Primary Navigation, Secondary Navigation or Unlinked pages. It may also be contained within a folder of an index. On Squarespace,

a 'folder’ is a way to organize pages so that they become a dropdown when added to your navigation.

an ‘index’ is like a stack of cards. They will display as ‘chunks’ in your site that you can drag and drop to different positions. Some themes have indexes, and some do not. My website does, which is how I am able to get the color bar effect throughout the site.

Keep in mind your contact page may also be under a different name… some unique names I’ve seen for contact form pages are:

  • inquire

  • book a consult

  • get started

  • let’s go


Webp.net-gifmaker.gif

Step 3 - Find your Contact Form Dialogue Box

Once you’ve located your contact form page, mouse over the form and click “EDIT”. This will bring up the Form Dialogue Box.

Once in the Form Dialogue Box, click “Storage” from the top Menu.

Next, DOUBLE TRIPLE QUADRUPLE CHECK THAT YOUR EMAIL IS CONNECTED IN THE FIRST BOX LIKE THIS: (this is where I went wrong)

Screen Shot 2019-05-21 at 5.31.44 PM.png

Secondly, scroll to the bottom of the Dialogue box where you see the option to connect to Google drive like this:

Screen Shot 2019-05-21 at 5.00.23 PM.png

Follow the Prompts for connecting your desired google drive account.

Type in a name for your contact inquiries. This will become the title of your spreadsheet in Google Drive.


Screen Shot 2019-05-21 at 5.34.08 PM.png

Step 4 - Login to your Google Drive and Check

Submit a test contact form through your own website and double, triple check that it sends to the Google Drive Spreadsheet that you’ve allocated via Squarespace.

Login to your google drive account. Locate said spreadsheet (will likely be your most recent doc).

VOILA! You’ll see that your test contact filled in all of the cells! WOO! Now, you can color code, format, add and rearrange the cells as you please. Either way, you’ll now have a back up of anyone who submits a contact form saved to your google drive account WHICH TOTALLY SAVED ME TODAY.

DO YOU HAVE A NEW BRANDING/WEB DESIGN PROJECT TO START?

Now that you know my contact form is working as it should, feel free to drop me a note and let me know what you’re working on!