How to Effectively Use Squarespace Blocks to Create Beautiful Blog Posts
One of the reasons I love blogging with Squarespace is the ability to create beautifully structured content that displays my work, as well as provides resources for other self starters and entrepreneurs, in a way that is visually appealing and easy to digest when time for reading blogs is limited.
Today I'm sharing how and when to use blocks to create beautifully structured content.
What is a Squarespace Block?
Per the definnition on the Squarespace website, "Blocks are the foundation of your site. You can add, move, and combine blocks on a page to create a custom layout. "
Squaresapce allows you to add text, images and other items to your blog and website through a block system. In writing a blog post, you have the ability to hover over "Insert Points" and chose what you'd like to add at any given point on a post or page. You also have the option to "drag and drop" content, allowing you to create unique layouts within your posts.
001 | The Text Block
This one may seem a little obvious. Of course your blog post is going to have text. But there are some really unique things you can do with text to add interest and hierarchy to your blog posts that perhaps you haven't considered before.
Shorter paragraphs, clearly organized structure, economical use of language, lists, strategic formatting choices, visual elements and an understanding of how to write for the ears in a conversational tone. These are things you need to consider when you write online. - uberflip
Much as you'd expect, the Squarespace text box allows you to create bold or italic text, and adjust the alignment to center or right justified if needed. But, you also have the option to toggle between your "Normal" body text and the header font formatting you've specified in your Style Editor, making your blogs easier to organize and structure. In this section alone, I've used the option to create a right justified quote, and have used my default header fonts to create a section header, so that it is clear what this section of the post entails.
Tip: I've already shown a few examples in this post alone. When writing tutorial or instructional posts, creating sections by utilizing a header option and perhaps center justification makes it obvious to a reader what the main points and takeaways of your article are.
002 | The Line Block
The line block, while so simple, is one of my absolute favorites, and a great way to separate content in an article. As bloggers, it is our duty to direct our readers to the most important information of our page through our writing style and formating, and to make each point we are making clear and actionable. The line block allows you to visually separate content, which makes it much more digestable for readers, rather than a long text heavy blog post.
Tip: Use lines to separate sections, action items or topics within a single blogpost. This makes it easier for your reader to gather the main topics and know the key takeaways immediately.
003 | The Gallery Block
This block is great for photographers and designers looking to showcase their work. Readers don't like to scroll through for long periods of time waiting to get to the meat of your content, and long photograph heavy posts meant to showcase your work and attract an audience can have the opposite affect and turn readers off by forcing them to scroll through for what feels like forever. Using Gallery blocks to showcase your work is a great way to use a smaller space and still showcase the work you are proud of.
For an example of using this as a designer, you can take a look at this post. In this example, I display 5 pages of a website design for "The Tasting Room," rather than just posting the images individually in the post.
Tip: Use the gallery block to limit the scrolling required of your readers, while still showcasing your beautiful work.
004 | The Summary Gallery Block
This is another absolute favorite, and one I utilize not only in blog posts, but in my archives page and blog side bar as well. One of the best ways to use the Summary Gallery Block is to showcase past relevant content in new posts. The Summary Gallery Block has the ability to display posts and thumbnails by category, so for this post as an example, I could create a Summary Gallery Block to display past posts that are tagged with an "Entrepreneurship" category.
This brings us to another key point - make sure you have a few key categories that relevant to your blog and brand that you are assigning to each post. It's also helpful to add a thumbnail image to each blog post in the options tab, so that when you use the summary gallery block you have perfectly formatted images that are pulled.
Tip: Use the Summary Gallery Block to point readers to past blog posts relevant to the post they are reading. For designers or photographers, tag your posts with relevant categories and use the Summary Gallery Block to show potential clients additional relevant examples of your work.
005 | The Form Block
Form blocks are an obvious tool for contact pages or as add ons to a home page or services page, but have you ever considered using it in a blog post? Using the Form Block in a compelling blog posts gives readers the opportunity to reach out to you, without having to navigate to a new page on your website. Making it easy for readers to figure out what to do next on your site should be a key goal. If your goal is to have someone contact you to book services, or to start a conversation about a recent blog post, adding a form block makes it easier for readers and makes it more likely that they will reach out.
Tip: Use the form block at the end of a blog post as a call to action for your readers. This makes it easier for them to contact you, and therefore more likely to do so.
006 | The Content Link Block
This is a neat block to use within your blog posts, especially if you are diligent about adding thumbnail images to each of your pages. It is also a great way to direct readers to different relevant parts of your website in a way that is visually appealing and engaging, rather than a simple text link which could get lost among your content. Below is an example of a content link block directing you to my archives, design services and recent work pages.
Tip: Be sure to use page thumbnails when building your Squarespace website. This will serve you later when redirecting readers to relevant parts of your website.
007 | The Newsletter Block
This one, much like the form block, allows readers to easily opt in to your newsletter and mailing list, without having to navigate to a new page. Below is an example of an opt-in for the Broad + Main Newsletter. This is a simple and easy way to give your audience a chance to subscribe to your mailing list, without needing to figure out how to do so.
08 | The Code Block
The code block, while not used often, allows for great integration with lead capture programs such as LeadPages. I use the code block quite a beat to insert images into my blog posts that allow readers to joint my free resource library and download free content or "lead magnets." Services like these allow you to give your readers valuable information, in exchange for their email address, and the code block makes it easy to integrate.
For example, this:
turns into this:
Tip: The above image is live and would allow you to get your invitation to the Broad + Main Library! Check it out!
I hope you found this helpful! Do you have questions about using Squarespace? I want to help you! Leave your questions in the comments and I would be happy to help. Who knows... your question could become my next blog post!