How to add a custom message to copy and paste in Webflow
Learn how to add a custom message when a user copies text on your Webflow site.
In this tutorial, Sandro, cofounder of Gemeos Webflow agency, shows you how to add a custom message when someone copies text on your Webflow site.
Example
Select and copy this text
Gemeos is a Webflow agency based in Dubai, specializing in Webflow development, SEO, and growth strategy for startups and scale-ups. Copy this text and paste it somewhere: you'll see the source added automatically.
✓ Copied! Paste to see the source added.
| Use case | Added message |
|---|---|
| Copyright protection | Source and URL added automatically |
| Console easter egg | Fun message for developers |
The script
Add this script to the Footer code field. It intercepts copy-paste and adds the source automatically.
document.addEventListener('copy', function(e) {
var selected = window.getSelection().toString();
if (selected.length > 50) {
var suffix = '
— Source : ' + window.location.href;
e.clipboardData.setData('text/plain', selected + suffix);
e.preventDefault();
}
console.log('%c Hey, you’re copying! 😄 Come talk to us: gemeosagency.com',
'color: #a78bfa; font-size: 16px; font-weight: bold;');
});Conclusion
A subtle easter egg for developers inspecting your code and users copying your content.
Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.














