[104] How to Choose the Right Squarespace Features Before You Design
-
This transcript was generated by Descript AI and may contain errors.
Squarespace Staff Directory by Function over Form
[00:00:00] Somebody just hired you to make a staff directory on their Squarespace website. Let's say they have 50 people that work for them. For each one of these 50 people, they need to have a photo, the person's headshot, they wanna have the name, they wanna have the person's title, maybe an email address, and a little bio available there.
[00:00:19] And let's say they have multiple locations, so it'd be cool if you could filter down by department and filter down by location to see exactly who you might wanna contact. Now, how would you build that in Squarespace?
[00:00:31] I think the first instinct for a lot of us is to picture the end result, to picture the page. All right, let's assume we're gonna want some kind of grid. Uh, we're probably going to want names underneath, maybe a hover effect for that bio, or maybe you click on it and then we get a pop-up with more information.
[00:00:48] But honestly, that's not where I would start this project. I don't wanna start with how things look at the end. What I wanna start is with the functionality underneath. [00:01:00] What information do I need to have available for each one of these people, and how do I set that up within the ecosystem that is Squarespace?
[00:01:09] That's where we really need to start these projects, because no matter what we build, we can always make it look awesome. So how do we find the functionality that we need with the platform that currently exists? That's what I'm gonna be breaking down in this episode of Think Inside the Square. I'm Becca from Inside the Square, a Squarespace expert turned educator, and I love sharing tips and tricks to help you make a website uniquely yours.
[00:01:33] Before I go any further, the term "Squarespace" is a trademark of Squarespace Incorporated. This content is not affiliated with or endorsed by Squarespace Incorporated. This is just my opinion and perspective as a designer, and I wanted to share it with you. And if you want a transcript of this episode along with the links to any resources that I might mention, visit insidethesquare.co/podcast.
[00:01:53] All right, friend, let's get into it
[00:01:55] All right, so before I start thinking about how I want this page to look, [00:02:00] I need to think about what I want the information to do. My number one job with pretty much every website that I create is I wanna create something people can manage without me. I don't want to have to be the bottleneck for any changes happening on the website.
[00:02:14] If they need to fire an employee all of a sudden, I don't want them to wait until I'm back in my inbox to make sure that their website reflects that change. That can be really important to a lot of my clients. So thinking about this information and what I need to put on the page and how easy it needs to update, to be honest, I'd start with a blog.
[00:02:34] Yeah, with a Squarespace blog, and let me tell you why. Blogs have categories and tags. Those could be things like the location and the department. Blogs have the title. Blogs have a thumbnail image. Blogs work within summary blocks. Blogs also work within archive blocks. Archive blocks are great ways to say, "Hey, in this collection, I wanna see just the things that fit this category or just the [00:03:00] things that fit this tag."
[00:03:01] There are a lot of use cases for blogs, and this staff directory, that's definitely one of them
[00:03:06] Another thing that makes blogs a perfect choice for this, excerpts. Every blog post can have an excerpt, and that can be where the bio lives. We can show that inside a summary block if we wanna feature it that way, And then we also have the click source title to link to a different URL in case we wanna expand it to something different, or have someone click on the person's name and instantly have the option to email them or visit their LinkedIn profile.
[00:03:31] A blog gives us a lot of features, and that's the number one thing I want you to take away from this episode. The features built into Squarespace don't have to be used for exactly how they're named. Now, I made a video about this on my YouTube channel just last week, and it kinda touches the surface on this concept that I wanna dig into deeper inside this episode.
[00:03:51] Because this isn't really about blogs not being used for blogging. This isn't really about event collection pages not being used for events. Maybe we [00:04:00] can use it for an archive of updates that happened at a software company. That was my YouTube video example.
[00:04:05] These are just high level examples of the fact that what we're doing is changing the way we solve the problem. With Squarespace, as a designer, I no longer think about the design first and foremost. I think about the function first and foremost, then applying the design later. Now, a lot of this confidence comes from using custom code for over a decade.
[00:04:27] I am very confident that I can look at something in Squarespace, and I can edit it to look exactly the way I want it to by changing the style of the site. Sometimes this involves a little bit of light JavaScript to move things around or turn things that might not be a pop-up into a pop-up, and that's where things like vibe coding with AI totally come in handy.
[00:04:47] But the confidence to create anything in Squarespace and turn it into something that I want, that rests in the fact that I trust the functionality. Squarespace is built in a very specific way, and they took care of [00:05:00] a lot of the details that I can use to make the most of the platform and turn a blog into something entirely different, something my client can manage.
[00:05:08] So again, I wanna talk to you about changing the order in which you solve things on, when it comes to creating a Squarespace website. I don't want you to think about how something should look and then forcing Squarespace to fit that, or how something should look and then using AI to force Squarespace to fit that.
[00:05:26] Sometimes that works, but sometimes it also gives you, like, 400 lines of JavaScript that will take forever to load and totally bloat your site. Nobody needs that. So what I start with is what I'm building with, and then I try to figure out how to make it look the way that I want it to.
[00:05:42] And I think that's the very important distinction here. It's not what it needs to look like, it's what it needs to do. That's the foundation of any project that I start. So going back to the staff directory
[00:05:52] If I'm starting with appearance, I might choose one of the meet the team sections that Squarespace has. It looks correct. [00:06:00] It's got an image, it's got a title, it's got a little excerpt about somebody. I could use one of the list sections, also called people sections, also called whatever the heck Squarespace has named it now.
[00:06:11] I can use one of those sections, and again, I get this look. But then when I dig into the functionality to be able to filter by location or to be able to filter by, uh, department that the person happens to be in, that's data that I can't really tie to a content block. I can't tie that data to a list item.
[00:06:30] That data needs to live inside the page somewhere. It needs to be associated with that picture and associated with that name, and that functionality is where I then bring up the concept of a blog. Now, I do think blogs are some of the best ways to edit content on a Squarespace website, but they do leave a lot to the imagination when it comes to the actual content of the post.
[00:06:52] So I'm not using the blog post here. I'm using the title, the categories, the tags, the thumbnails, the excerpt, and [00:07:00] the click to reach the source URL feature that's built right into Squarespace. That's the functionality I need for this specific project
[00:07:07] I think the best part about this is also the summary block feature, because a summary block can pull this content. Let's say I've got a landing page where I'm talking about an event that's happening at a particular location. I could pull in a summary block and show a quick staff directory for that location, or just the people that work in the event planning department at that location in case someone wants to contact them.
[00:07:30] This opens up a world of possibilities for how to connect that data at other places of my site. If I wasn't using a block, if I was just using one of those content block layouts or one of those list sections, I'd manually have to make those changes or teach someone on the team to make those changes. I would much rather make it easier for all of us, myself and my client, to quickly grab that information and add it to any part of the site that they need to.
[00:07:57] Because again, the client handoff is a pretty [00:08:00] important thing for me. If I can teach them how to make a blog post, add a category, tag, image, excerpt and link , all of that good stuff, my client is set up for success. Again, I don't have to be the bottleneck on their project, and that's something I'm really focused on here inside the square.
[00:08:15] I like to help people help themselves
[00:08:19] So before I get way off topic and start talking about off-boarding clients and all of that stuff, let me pull it back a little bit and get back to the core premise of this episode.
[00:08:29] Let's talk about how to decide what features to use in Squarespace for what you need to accomplish
[00:08:35] Here are some key questions that I like to ask. Does every item need its own page? Do those items need to be organized somehow? Does something need to happen on a certain date or at a certain time? That could be scheduling something to be released, removing something, anything along those lines. Does somebody need to buy something?
[00:08:57] Does the website need to keep track of how many [00:09:00] are available? And does the content need to appear in multiple places? Also, does someone need to add something in six months without calling me? All of those are very important questions.
[00:09:12] This is where knowing the underlying structure of Squarespace becomes incredibly useful. Now, instantly, when I say blogs, you're gonna think articles, you're gonna think posts, news, whatever. But underneath all of that is the functionality that can be used to organize content in a very efficient way that works across your website
[00:09:32] all right, let me share another example with you, because this one I thought was pretty darn cool. This is definitely a wild card. I had a client who needed to have landing pages for six different items, and these landing pages needed a lot of details. There's no way a blog post would have been enough. We needed to use a full-on portfolio of projects inside Squarespace.
[00:09:52] But here's the tricky part. What they needed was to have on the portfolio page that showed all of the projects, they needed more than [00:10:00] just the image and the title. They needed a little bit of data that was going to be unique to the individual portfolio item. So guess what we did? Portfolios, they don't have categories or tags.
[00:10:10] We had no way to add that kind of data to it. But we did have the ability to add some SEO data there, to change the SEO description and to change the SEO title. So I used a little bit of clever code, and we found a way to write the SEO description so that it would contribute to their search engine optimization, but part of it contained the information we wanted to show on the portfolio.
[00:10:33] Then I vibe coded with a little bit of Claude's help, and we created a cool plugin that we put on the site so that we could see the title and the information from the SEO excerpt. It'd be unique to the page. It would be something the client's comfortable editing, because they're editing the SEO description anyway, but we could still get the flexibility of the portfolio page and the project page inside of it to make sure their design was outstanding.
[00:10:57] So again, knowing the functionality and [00:11:00] features within Squarespace and then manipulating them to work for the client, that was the perfect way to approach that project, and I'm really proud of what we created.
[00:11:08] So start thinking about the structure of features inside Squarespace and what problems those could solve. I never really use a blog for a blog anymore. I can use it for recipes, a directory of vendors, list of locations. There are so many different things that we can do using the features inside Squarespace.
[00:11:27] No one cares what Squarespace named the collection. What they care about is the way that we use that feature inside the website itself
[00:11:35] Now there is a little bit of dangerous territory here, and that is once you start thinking this way, you become the person that basically tries to make everything weird. And don't get me wrong, I've kind of built my career on making weird websites and doing weird things with Squarespace. It's something I really enjoy doing.
[00:11:53] But sometimes building something the way it's designed right out of the gate, not a bad idea
[00:11:58] Just because you [00:12:00] can use an events collection for some super complicated content management system that actually is completely unrelated to events doesn't necessarily mean that you should. That discretion, that is definitely your skill set as a designer right there. But I wanna encourage you to look at the features that Squarespace currently has rather than trying to develop something entirely new.
[00:12:21] If someone comes to you with a staff directory and they need headshots, they need the person's name, their title, a click to email, a click to contact on LinkedIn, and a bio, and they wanna filter by location, and they wanna filter by department, you don't need to vibe code a plugin for that. What you can do is use the features built into Squarespace and use your own design skills to make it look the way you want it to.
[00:12:44] So again, start with feature, end with design, not the other way around
[00:12:49] I'm Becca from Inside the Square, and this is just my hot take on all the cool things we can do with Squarespace these days. I wanna encourage you to get creative, to make weird websites, and to think [00:13:00] about the features that exist in terms of their features, not necessarily the way that Squarespace named them.
[00:13:06] So just something to think about. I truly hope you enjoyed this episode. If you've got a creative workaround that you made in Squarespace, let me know in the comments or send me an email, hello@insidethesquare.co. I'd love to hear from you. Thank you so much for tuning in, and most importantly, have fun with your website.
[00:13:22] Bye for now
Start With Function, Then Make It Look Good
Let’s say someone hires you to build a staff directory in Squarespace. They have 50 employees, multiple locations, different departments, headshots, bios, contact information, and they want visitors to be able to filter through all of it.
Your first instinct might be to picture the finished page. Maybe it’s a beautiful grid with headshots, names underneath, and some slick hover effect. But that’s not where I’d start.
I’d start with the information.
What needs to be stored? How does it need to be organized? Where else might it appear on the website? And six months from now, can the client add a new employee without calling me? Once I know those answers, I can start looking at the features already built into Squarespace and decide what makes the most sense underneath the design.
For that staff directory, I’d probably use a blog. Not because we’re publishing articles, but because blogs already give us titles, thumbnails, excerpts, categories, tags, links, summary blocks, and archive blocks. Suddenly, I have most of the functionality I need before I’ve written a single line of custom code. Then I can use design, CSS, and occasionally a little JavaScript to make it look nothing like a blog.
That shift in thinking has become a huge part of how I build Squarespace websites. Instead of deciding exactly how something should look and then forcing Squarespace or AI to recreate it, I start by asking what it needs to do. In this episode of Think Inside the Square, I’m sharing how I make those decisions, a much stranger portfolio workaround from a real project, where AI-assisted coding fits into the process, and why knowing when not to get clever might be one of the most valuable skills you can develop as a Squarespace designer.
