Tired of Squarespace Blog Categories Reloading to the Top? Try This Code-Free Fix
If you're using categories on your Squarespace blog—whether to group posts, help readers explore topics, or act like search buttons—you’ve likely run into this frustrating issue: You set up your category link, someone clicks it, the page reloads... but they land right back at the top of the screen.
Even though the blog content has filtered correctly, the reader often won’t realise anything’s changed—especially on mobile where they’d have to scroll down past banners, text blocks or headers just to see the posts.
After running into this over and over across client sites, we finally found a clean, reliable, code-free fix that makes Squarespace category filters behave more like actual search buttons—taking people exactly where they need to go.
The Code-Free Fix ✅ Use an Anchor Link After the Category Path
Here’s the good news: you don’t need Developer Mode or any fancy plugin. You just need to add a small tweak using a built-in web feature called an anchor link.
This method works seamlessly with Squarespace’s default category setup—and it’s fast, clean, and mobile-friendly.
🔧 Step-by-Step:
1. Add a new section above your blog content
This could be a blank, one-row section placed right before your blog summary block. You won’t need to add anything inside it—just make sure it sits above your posts.
2. Open the section settings and give it an ID
Now you’re going to create a ‘jump-to section’. Click on the section’s gear icon, open the Advanced tab, and assign it an ID like this:
#new-search
3. Add a category to your blog post.
Select a blog post and add a category in the settings.
4. Get your category link
View your website on the front end (i.e. not from inside the Squarespace editor) and click your category. You can then copy the URL, then paste it into a button (back inside the editor). You’ll add your ‘jump-to section’ ID, so it will look like this:
/your-blog/category/Test+Category#new-search
5. Refresh your website & test your Category Button.
Now when a visitor clicks a category:
The page still reloads with the filtered posts
But the user jumps directly to the blog content thanks to that anchor
It works exactly like a search jump—and eliminates confusion for mobile users or anyone browsing long-form content.
Tip: if it’s not working, ensure everything is spelled correctly or the exact same way, including the jump-to section ID name, the category in your blog post and how all these show up in the link you’ve pasted into the button.
Bonus Upgrade: Dynamically Show the Current Category
While the anchor link fixes the scroll issue, you can go a step further by displaying the active category name on the page. This helps reassure visitors that they’re seeing filtered content—and looks more polished overall.
🔧 Step-by-Step:
1. Add a placeholder code block inside your jump-to section
Copy and paste the following code into a code block (you can determine the style based on the HTML tag you reference):
Use paragraph styles: <p id="category-heading"></p> Use Heading 1 styles: <h1 id="category-heading"></h1> Use Heading 2 styles: <h2 id="category-heading"></h2> Use Heading 3 styles: <h3 id="category-heading"></h3> Use Heading 4 styles: <h4 id="category-heading"></h4>
2. Paste the following script into your site’s Footer Code Injection
(Found under Settings > Advanced > Code Injection)
Tip: you can update the text “Showing posts in” to whatever is appropriate for your website. For example, “Posts categorised under” or “Posts related to” etc.
<script> window.addEventListener("DOMContentLoaded", function () { const heading = document.getElementById("category-heading"); const path = window.location.pathname; const categoryMatch = path.match(/\/category\/([^\/]+)/); if (heading && categoryMatch && categoryMatch[1]) { const rawCategory = decodeURIComponent(categoryMatch[1]).replace(/\+/g, " "); heading.textContent = "Showing posts in: " + rawCategory; } }); </script>
3. Refresh your website & test your Category Button again.
Now when someone visits a category link, the page will automatically display:
“Showing posts in: Test Category”.
Below is also some CSS you can apply for some extra formatting. Add this to Settings > Advanced > Custom CSS:
#category-heading { text-align: center; }
Why This Works (And Why It Matters)
Squarespace’s native category filtering works technically, but it’s not optimised for user experience. When pages reload and land at the top—especially on mobile—it creates confusion, makes people second-guess the filter, or worse, assume it didn’t work.
This fix solves that by:
Jumping straight to the blog section on reload
Making the blog act more like a search tool
Improving the flow without disrupting your site design
Providing clear context with a visible category label
All without installing anything or using Developer Mode.
💡 Final Thoughts
This is one of those small-but-mighty tweaks that’s easy to overlook, but makes a big difference in how visitors engage with your content.
If you’re using your Squarespace blog as a strategic tool—whether to share insights, build SEO, or organise content by topic—this fix helps make sure users can actually find and see what they’re looking for.
It’s the kind of tidy, UX-focused solution we love finding and sharing—clean, simple, and highly effective.