How to Add a "Scroll to Top" Button in website (theme"Radiant" latest).

Shopify Discussion
,

Topic summary

A user seeks to implement a “Scroll to Top” button on their Shopify store using the Radiant theme. They want the button to:

  • Appear after scrolling down
  • Be fixed in the bottom corner (preferably right side)
  • Have customizable colors

They’ve shared a reference image and are comfortable editing theme code.

Solution provided:

Another user recommends avoiding direct theme code edits to preserve update compatibility. They suggest:

  • Add a “Custom Liquid” section to the “Header Group” if using a sticky header
  • Use CSS-only implementation (no JavaScript needed)
  • Replace placeholder text with an arrow-up SVG snippet from the theme

The original poster confirmed the solution was helpful. The discussion appears resolved with a working approach that maintains theme flexibility.

Summarized with AI on October 29. AI used: claude-sonnet-4-5-20250929.
1

Hello, Shopify partners, users and the experts, hope you are doing well.

I’m looking to add a “Scroll to Top” button on my Shopify store so that visitors can easily return to the top of the page after scrolling down. I want it to appear once the user scrolls down a bit and be fixed at the bottom corner (preferably right side).

Has anyone done this before or can guide me through the process? I’m comfortable editing the theme code if needed. Any help or code snippets would be greatly appreciated!

Here’s the sample image but I want that I can adjust colours according to my need later in the code.

IMG-20250405-WA0030.jpg
IMG-20250405-WA0030.jpg540×1078 65.3 KB

Thanks in advance!

Abdullah.

2

You may not need to edit theme code – this is a good idea to avoid it alltogether to allow for easier theme updates.

Can even be done without JS.

If you have a sticky header, you can add a “Custom Liquid” section to your “Header Group” sections group. The code can be similar to:


  BTT

You’d only need to find a snippet which renders an arrow-up SVG in your theme and include {% render “snippetname” %} instead of the BTT…

1 Like
3

Thanks alott :beating_heart: .