Copy Link Button for Shopify (Dawn) — 1-Minute Install
Make sharing easy: add a ‘Copy link’ button to any tutorial or promo page. This guide is built for Dawn and works with our Lab’s token system.
On this page
Why This Exists
Make sharing easy: add a one-tap “Copy link” button you can reuse on any tutorial or promo page built on Dawn.
What it is
A tiny helper that finds tokens in your content (like [copy-page-url] or [copy:step2]) and turns them into a real, styled button that places text on your shopper’s clipboard.
How To Use It
Follow the steps below. You’ll add a small JS asset once, then drop tokens where you want the button.
Step-by-step
Before Any Changes: Make a Copy of Dawn / Your Site
- Go to your Shopify Admin → left sidebar, click Online Store → Themes.
- On the right side, under Current Theme, click the … (three dots) menu.
- From the dropdown, click Duplicate.
- Shopify will create a copy of your theme. It will appear just below your current theme in the list, with the name “Copy of Dawn” (or “Copy of [Theme Name]”).
- That’s the one you’ll edit. Safe: you can break it without affecting your live store. When ready: you can hit Publish later to make it live.
- Pro Tip: Always keep an untouched backup copy (your live theme), so you can roll back if needed.
Step 1
- Create the JS asset →
- Go to your "Dawn" Online Store → Themes → … → Edit code
- It will take you to a new window that will show you a bunch of folders
- Look for the → Assets
- Click the arrow to open up the Assets folder
- Once folder is open look to the right for a new file icon
- Click to Add a new asset file
- This will → Create a blank file → name it: sns-article.js (exactly)
- Paste the script (see Step 2) into that file.
- then Save - Very small words on the right hand side of the screen (next to a icon that looks like a open book called Split Editor)
Step 2
- Copy this code — [copy:step2]
Step 3
Drop this token wherever you want a button: [copy-page-url]
Optional: add more buttons with [copy:yourTextHere] (URL-encode if you use spaces)
Goals
- Reduce friction (one-tap copy).
- Make sharing easier for your shoppers.
Q&A & common gotchas
-
Button shows as plain text?
Use the token format in rows and text fields, e.g.
[copy-page-url]or[copy:step2]— don’t paste raw HTML for the button. The script finds these tokens and builds the real button. - Customizer “Preview” doesn’t copy? Clipboard APIs are sometimes blocked inside the theme editor. Click the eye icon (Online store preview) and test there. Live pages work normally.
-
Copy specific code (like Step 2)?
Use
[copy:step2]. The text forstep2comes fromSNS_SNIPPETS.step2inassets/sns-article.js. - Multiple buttons on a page? Drop as many tokens as you want. The script converts them all and keeps them in sync.
- Put a button inside an accordion? Allowed. Our script watches for content that opens later and injects the button when the row appears.
-
Want to copy custom text?
Use
[copy:Your%20message]. Remember to URL-encode spaces/symbols. - See an alert instead of a toast? That’s the fallback for very strict browsers. The copy still works; the alert just confirms it.
Download
Grab the file and get nerdy.
© 2025 SomeNerdStuff. All rights reserved. All images, copy, content, and materials on this website are the property of SomeNerdStuff. By using this website, you agree to our Terms & Conditions, acknowledge our Privacy Policy, and accept our Lab Terms.