Add a “Back to Top” Button in Squarespace
⬆️ Back to Top Button Generator
Add a “Back to Top” Button in Squarespace
(Without Plugins or Coding Headaches)
Long blog posts or scrolling-heavy pages are great for readers—but once they reach the end, getting back to the top can be a pain. That’s where a simple, elegant "Back to Top" button comes in.
This tool lets you instantly generate a Squarespace-ready scroll-to-top button, complete with:
Customisable label (like ⬆ Back to Top, ↑, or your own wording)
Button color that matches your brand
Flexible positioning: bottom left, bottom right, or centered
Lightweight code that works without plugins or third-party scripts
No JavaScript knowledge needed. Just copy, paste, done.
How to Use It
Choose your settings
Enter your preferred label, pick a button colour, and choose where you want the button to appear.Click “Generate Code”
The tool will output a fully-formed code snippet with all your settings baked in.If you place it in Footer Code Injection:
It loads on every page site-wide.
The button appears on all pages, including blogs, home, contact, etc.
Best if you want it to be globally available.
If you place it in a Code Block on a specific page:
It only appears on that page.
Useful if you want it just on long-form articles or scrolling pages.
Keeps other pages clean.
Test on a long page
Scroll down and the button will appear once you’ve moved 300px down the page. Clicking it smoothly scrolls back to the top.
Why Use This?
Improves mobile and accessibility experience
Easy scrolling on long posts or sales pages.Matches your site design
Brand-friendly button color and layout options.Lightweight and compatible
Works across all Squarespace templates with no slowdown.No fluff or dependencies
All code is self-contained—no jQuery, no plugins, no tracking.
Is This Free to Use?
Personal use is free forever.
If you’re using this tool/game on your own blog, portfolio, or personal Squarespace site, you don’t need to pay — enjoy it freely.
Commercial use requires a one-time license.
If you’re a developer, agency, or using this on a client project or monetized site, please purchase a commercial license. It helps support ongoing development and gives you peace of mind.
One-time cost: £49.99 (normally £79.99)
Covers unlimited client sites, all current tools, and future updates.
👉 Learn more or buy a license here
Frequently Asked Questions
Can I add a “Back to Top” button in Squarespace without a plugin?
Yes — this tool lets you add a floating back-to-top button using just a Code Block or Footer Code Injection. No plugins or external scripts needed.
Will this button work on mobile as well as desktop?
Absolutely. The button is fully responsive and appears once the user scrolls 300px down the page — regardless of device.
Can I customize the button label or color?
Yes. You can choose any text or emoji (like ⬆, ↑, 🔝), and customize the background color to match your site branding.
Where will the button appear on my Squarespace site?
You can place the code site-wide (in Footer Injection) or just on specific pages using a Code Block. Position it bottom left, bottom right, or centered.
Does this tool support Squarespace 7.1?
Yes. The scroll-to-top button works on all Squarespace 7.1 templates and doesn’t interfere with custom styling or layouts.
Is this button accessible?
Yes. The button uses semantic HTML and a clear aria-label for screen readers. It improves both UX and accessibility for long pages.
Do I need a license for use on client or paid sites?
Yes. While personal use is free, you’ll need a one-time license (£49.99) for client work or monetized blogs.
Disclaimer
This script is provided as-is with no guarantees. While it's designed to be safe for most Squarespace sites, always test changes before going live — especially if you’ve installed third-party plugins, custom fonts, or heavy integrations. By using this code, you accept that we are not liable for any unexpected behavior or performance changes.
