How To Style Squarespace Blog Comments

This old tutorial is getting a makeover, but the code still works for any version of Squarespace!

In this tutorial, I wanted to show you some simple codes you can use to change the standard comment section on your blog. As usual, this out-of-the-box style didn't quite fit with my own bright color scheme, so I used some creative CSS to make mine really stand out, and I wanted to share it with you!

Now the actual element names themselves are below, but I also created some premade styles that you can copy and paste into your own site.

---

Here are the basic code names from the tutorial that you can use to customize your Squarespace blog.

Comment Count [ Comments (#)]

.squarespace-comments .header-controls .controls .comment-count

Comment Controls - Both

.squarespace-comments .header-controls .controls .comment-controls

Comment Controls - Subscribe

.squarespace-comments .header-controls .controls .comment-controls .subscribe

Comment Controls - Unsubscribe

.squarespace-comments .header-controls .controls .comment-controls .unsubscribe

Comment Controls - Sort

.squarespace-comments .header-controls .controls .comment-controls .comment-sort

Comments Box

.squarespace-comments .new-comment-area

Input Text Area

.squarespace-comments .new-comment-area .input form.comment-form textarea

Button Wrapper (bottom of comments box; contains preview text and post comment button)

.squarespace-comments .comment-btn-wrapper

Preview “Button”

.squarespace-comments .comment-btn-wrapper .btn-text

Post Comment Button

.squarespace-comments .comment-btn