Miscellaneous site customizations & edits

A quick walk-through on MISC. updates you’ll need to make to your Squarespace 7.1 website!

This video covers:

Adding social media links
Adding your instagram embed block
changing your site contact form & FORM storage
Email NEWSLETTER FORMS

VIDEO TRANSCRIPT

This video is going to cover the smaller tweaks and edits that often get overlooked. Specifically, I'll be teaching you how to link your social icons, how to add your Instagram account to pages, how to set up form contact blocks, email newsletter signup form.

Let's get started.

 Firstly, I'll show you how to set up your social links.

You can access in two ways. You can use your keyboard shortcut by typing the forward slash and then just typing social links, and you'll see it pops up here. Or otherwise, you can go into your settings, and your social links option is here as well. So this is where you can actually just copy paste your social link directly to your profile, and it will auto populate the icon for you.

Not all Social links will auto populate icons. So for example, if you're trying to link to your Google reviews page, it will actually just populate with a little link icon. So I'll show you what that looks like. Yeah. So it'll just be a little link icon, but Instagram, Yelp, Pinterest YouTube, and I believe TikTok as well will automatically populate the icon for you.

To add your social links anywhere on your website, you'll just click edit, and then pick the section where you want to add them, click add block, and then just type social. And the social links block will pop up for you. And if you want to make any changes to the links, you can actually do so directly within your editing.

You can add more social links, and you can change the design functionalities as well. So you can have shapes around them. Just outline the solid versions. You can change the sizing of them. Plenty of different optimizations. Then we simply move it around like any other block on our site.

If you end up deciding you want to change the color of your social links across your site, we can simply go into site styles, click colors, and typically you'll be able to just hover over and click the social link block and it'll populate. Sometimes Squarespace will give this little error message where it's not actually letting you select the block. But typically, to give you an example You'll usually be able to select it, and it'll take you directly to the social links block. So in this case, it's having me change the colors in this theme, which is bright 2. So we can actually go into our palette and select different colors, or add a custom color, and that will change the color of the social links for this theme specifically on bright 2.

But to find it manually, again, for this one, for whatever reason, it's not selecting it, we'll just scroll all the way to the bottom of our color selection and find social links block, and we can change the color here.

 You can also embed your Instagram on your website so that people can click through directly to the content that you're posting over there as well. So to add a new block for Instagram, let's say we just add it here. We'll do add section, or again, you can add this to an already existing section.

We'll click add block. And then if we just type Instagram, it'll pop up for us. So you'll want to scale the block to whatever sizing you like and fits within your site design.

I like this We're having it equally spaced as you can see there's equal distance on either side But it doesn't stretch to the entire length of our website So I think that looks nice if we want to add a little heading above it We want to say follow us on Instagram or anything like that. We'll simply just add any of our heading text and then just type whatever text you want.

Then I'll change this to my heading four. Perfect. To edit this form block, we'll just press the edit button, and then you'll want to connect to your related Instagram account.

And then we can choose how many items we want to show up. So for example, if I set this to four, it means that only these four. First images will show up once I connect my Instagram account. Once you connect your account, these other ones will disappear. But if you do want to keep a nice big block of a bunch of images, you could very well just scoot this number up and display as many or as few as you like.

But I typically, just for aesthetic purposes, prefer to keep the number of images between 3 to 6. Our design functionality will let us change how it's displayed. For the Instagram grid, you'll want to keep it in the grid setting. And I usually recommend keeping it in the aspect ratio of 1 to 1 as well. You can choose the thumbnails per row.

So let's say, for example, I wanted to have six total items displayed and I wanted two rows of three. We would just set it to six items and then three images per row and you can see it automatically changes. Once again, these last rows will disappear once we've updated our account to match whatever display settings we've set.

You can also change the padding so you could have the images touch completely, or you can have really wide spacing, totally your preference. And then I recommend keeping this selected so that when they're clicking on your Instagram images, it's still keeping your web browser open in their window.

 Next up is our contact form. So for any of your contact pages, I highly recommend keeping the contact form because it allows people to reach out to you without having to list your email specifically, which occasionally can be helpful for reducing spam so after we've clicked edit at the top, we'll just click directly on our form block, click edit.

And we have some options to customize the actual form fields. For example, if you want your contact block to be more of an inquiry block for people reaching out to inquire about your services, and you want to collect some more information from them instead of just their name, email, and the email itself, you can actually click edit form fields, and there's a bunch of different options to add fields.

So you can add text areas, multiple choice answers, so on and so forth. Once you've decided all the fields that you want to add, you can also change your button submit text, so if you want to say send or something else, you can change that here. And you can also change your post submit message. This will be the message that pops up once they've clicked that submit button.

So for example, if you're doing a longer lead inquiry form, you could say something like, thanks, we'll reach out shortly, or thank you, our team will be in touch, something like that. There is also the option to redirect them, so for example, if you want to take them to a longer sales page, or if you want to gift them with a freebie, something like that, you can redirect them to a page once they've clicked the submit button.

There are some minor design tweaks you can make to the form as well. So for example, if you want there to be a different background color, you can make selections for that here. And then the most important part is going to be our storage. Once someone submits this form, we want to make sure it's not just disappearing into the ether of the internet. We want to make sure you're actually getting these messages.

So you'll want to change what email will be notified. So you can change it to whatever email you like.

You can also create additional storage options. So if you want to start a collection of submissions in Google Drive, if you use Zapier or MailChimp, those are additional storage options and you can go through the connection processes. You can find documentation through Squarespace for setting those up specifically.

If at some point you do end up getting a lot of spam emails, you can also always turn on your Google Captcha to make sure that you're filtering out spam messages. But I only recommend doing this if you're already getting a bunch of spam messages. It's not really necessary otherwise.

Once you've added the appropriate email that you want, set up additional storage if you'd like it, it's important to send yourself a test email.

That's as simple as just going to your website and then submitting through your contact form as a regular internet guest would. The best way to do this is to copy your built in Squarespace URL. So you'll just take the whole URL, open it in a new tab, and then just add question mark, no redirect. This will let you pull up your website in real time, and not through your editor, so you can actually use the form.

So you'll go to your contact, submit form details, and then just make sure you're getting the email in your inbox.

Alright, so speaking of emails, if you want to set up an email newsletter, that's something you can also do through Squarespace.

I do highly recommend using Flodesk. I've just found a ton of success with it with my business. It's really easy to use. It's very easy to integrate with your website.

But if you're just getting your website set up and you just want to start collecting emails right away, we can actually add a newsletter form block directly through Squarespace as well.

So let's say I want to add a newsletter form block to my homepage. I'll click edit. Let's scroll down all the way to the bottom here. And let's just add a new section. You can also just add it within an existing section as well. Because it's just going to be a form block.

Click add blank section. Then add block. And then you can type newsletter or it's just right here for you. And this will be the built in Squarespace newsletter block. We can customize this, of course, by pressing the edit button. You can change the name of the newsletter form.

This is just for your own personal records, so you can keep track of where people are subscribing, for example. So I can put this as my home newsletter block. And then we can also change, of course, the title and the description as well. So I typically recommend when you're trying to entice people to sign up for your newsletter, putting something that's a little bit more personal and relevant, rather than just saying, sign up for my newsletter.

Tell them what they're going to expect in your newsletter, how often you send it, add a little bit of personality to it. You can also change the disclaimer at the bottom. You can just remove it entirely if you like, which is typically what I like to do to just eliminate clutter. And then, of course, change the button text as well.

I do recommend selecting the require name field. Unfortunately, Squarespace doesn't give you the option, like Flodesk, to just have a first name. It does require first and last name, but that's really helpful because once you're sending emails, you can personalize it. And I just like knowing the names of people that are subscribed to my newsletter. Just like our contact form block, there's a post submit option. So you can add a custom thank you message.

You could also redirect them to a specific page. So this comes in handy, especially if you have a freebie that you're offering as a lead magnet. Once they submit this, you could deliver the lead magnet directly through email, or you could redirect them to a webpage that you've built on your site As I mentioned, I really love using Flodesk. I've just found it really helpful for my business, and you'll see they offer customized newsletter blocks that you can embed in your website that can perfectly match your branding.

All of this is done in the Flodesk side, and it's pretty easy to do. You'll just have to reference your Flodesk documentation to see how to embed the forms into your site.

If you end up having any questions about Flodesk integration, feel free to email me at any time at support@elocreativestudio.Com and I'm happy to provide some guidance.