How to Hide Next and Previous Buttons on Squarespace Blog Posts

If you’ve ever visited a blog post on a Squarespace website, you’ve probably seen the "Next Post" and "Previous Post" links at the bottom of the page. While these navigation links can be useful, they can also make a blog look cluttered—especially on mobile.

If you want a cleaner blog layout without these links, the good news is you can remove them with a simple CSS tweak. In this tutorial, I’ll walk you through the process step-by-step.

Watch the video

Check out the YouTube video below. 👇🏼

Step 1: Open Your Blog Post in Squarespace

First, navigate to your Squarespace site editor and go to your blog.

  1. Click on Pages from the left menu.

  2. Locate your Blog section and click into any blog post.

  3. Scroll down to the bottom of the post—you should see the Next and Previous post links displayed there.

These links are automatically added by Squarespace, but we can hide them using custom CSS.

Step 2: Open Developer Tools to Find the Right CSS Selector

To remove the next and previous buttons, we need to identify the correct CSS selector. Here’s how:

  1. Right-click on the "Next Post" or "Previous Post" link and select Inspect (Google Chrome) or Inspect Element (Firefox).

  2. This will open the Developer Tools panel.

  3. Look for a section ID or class name that controls this part of the blog layout.

From my testing, the pagination section is labeled as:

.item-pagination[data-collection-type^="blog"]

This is the CSS selector we’ll use to hide the blog navigation.

Step 3: Add Custom CSS to Remove Blog Navigation

Now, let’s apply a simple CSS rule to hide the next and previous buttons.

  1. In Squarespace, go to Website ToolsCustom CSS(or just use the magnifying glass to search “CSS”)

  2. Scroll down to an empty line and paste in the following code:

.item-pagination[data-collection-type^="blog"]{

display: none;

}

3. Press Save to apply the changes.

Once you save, the next and previous blog post links will disappear—making your blog design look cleaner and less cluttered.

Step 4: Verify on Mobile & Desktop

To make sure everything looks great across devices:

Check desktop view to ensure the pagination is gone.
Switch to mobile view to confirm it’s no longer cluttering small screens.

With this change, your blog will look much more polished, professional, and distraction-free.

Final Thoughts

Removing the next and previous blog post links in Squarespace is a quick fix that can improve readability and user experience.

✔ If you prefer a minimalist blog layout, this trick is perfect.
✔ Your blog will look cleaner, especially on mobile.
✔ And best of all—it’s a simple one-line CSS change!

If you found this tutorial helpful, subscribe to my newsletter below for more Squarespace tips, and if you need a custom Squarespace website, feel free to reach out!

 

📨 Join my mailing list to get Squarespace tips & tricks right in your inbox

 
Squarespace Web Designer - Bryan Jernigan

Your Designer

I'm Bryan, a Squarespace web designer and founder of Abound Web Design. I have worked with all types of businesses and organizations from preschools to publishing companies to chiropractic clinics and everything in between. If you want to discuss a potential project, you can email me at bryan@aboundwebdesign or get in touch with me here. Alternatively, you can book in a free 15-minute consultation call here.

Bryan Jernigan

Freelance web designer for Abound Web Design LLC

https://www.aboundwebdesign.com
Previous
Previous

How to Use Saved Sections in Squarespace Footers

Next
Next

How to Add & Style a Testimonial Section in Squarespace