How To Add Back To Top Button On Shopify Online Store Dawn OS 2.0

Store Design
, , ,

Topic summary

Implementing a “Back to Top” button on Shopify’s Dawn (OS 2.0) theme.

  • A contributor shared a ready-to-use snippet with Liquid settings and a YouTube tutorial. Key variables: vertical_offset_for_trigger (pixels before button appears) and position_from_bottom (CSS offset like ‘7em’). It also links Font Awesome 4.0.3 for the icon.

  • Another user couldn’t see the button in the inspector on Dawn v11 (site: themeatclub.com.sg). After review, the helper noted the code wasn’t implemented correctly (confirmed via a screenshot).

  • Root cause: a missing hyphen “-” in the code (between words), which prevented the element from rendering. After correcting the hyphen, the button appeared.

Outcome: Issue resolved by fixing the typo. No further open questions. The shared code and tutorial remain the recommended approach, with adjustable offsets for when and where the button appears.

Summarized with AI on January 7. AI used: gpt-5.
9

Ah! It was the ‘-’ between each word! Thank you!

1 Like