How to Add a Copy Link Button in Webflow CMS (Full URL, No Hacks)
In this tutorial, I’ll show you how to add a Copy Link button in Webflow CMS that correctly copies the fully qualified page URL — including blog posts and dynamic CMS slugs.
Many no-code solutions rely on hidden text fields, attributes, or manually constructed URLs. The problem? Webflow CMS only exposes the slug — not the full domain path — which makes copying the complete blog post URL messy and unreliable.
In this video, I’ll walk you through:
• Why most copy-to-clipboard methods break on CMS pages
• The problem with hidden URL text blocks
• How to access the full page URL using window.location.href
• The exact classes you need (copy-link-btn + copy-link-text)
• Where to paste the script in Webflow page settings
• How to test properly on staging
This lightweight vanilla JavaScript solution works on:
✔ Webflow CMS blog templates
✔ Dynamic collection pages
✔ Static pages
✔ Multiple buttons on the same page
No jQuery. No hacks. No hidden URL fields.
————-
🔗 Related Blog Post & Script:
If you’re building blogs, marketing sites, or documentation in Webflow, this pattern keeps your copy link buttons clean, reliable, and easy to maintain.
Happy designing & developing!
– Kelly Barkhurst
Designer to Fullstack
_____________________________________________________________
*JOIN MY EMAIL LIST*
Love quick, helpful tutorials? You’ll love the emails too. 💌
*ABOUT ME*
Hello, world. I’m *Kelly Barkhurst* —an experienced Mac-based full-stack designer, educator, and entrepreneur passionately blending artistic vision and creativity with deep technical expertise.
With a BFA and MFA in Graphic Design and a certificate in Full-Stack Web Development, I’m uniquely positioned to work at this intersection of design and tech. My driving force is creating meaningful solutions and helping clients and students do the same.
*What’s Kelly’s superpower?* It’s using design thinking to strategically plan the BIG picture, then diving deep into the technical “weeds” to bring that vision to life—through beautiful visual design, compelling writing, or well-crafted, functional code.
*What brought you JOY today? *
👇 Share in the comments below
*SOCIALS*
https://twitter.com/@designer2fstack
https://www.facebook.com/designertofullstack
https://www.youtube.com/@UCWk0aZ-yFzCQX5bMLaISrog