Click to Copy to Clipboard
Add a click to copy to clipboard to your Webflow site using a Javascript snippet. This copy to clipboard functionality allows you to designate the class and text that you'll allow your users to copy.
Add a click to copy to clipboard to your Webflow site using a Javascript snippet. This copy to clipboard functionality allows you to designate the class and text that you'll allow your users to copy.
How to add it
- Add the Javascript snippet code to the head section of your page custom code
- Add the Javascript script to your closing body custom code
- Add the HTML embed to your page
- Update the data-clipboard-text attribute with the text you want to copy
The code
Javascript
<!-- Add to header -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script>
<!-- Add to closing body -->
<script>
var clipboard = new Clipboard('.copy-btn');
clipboard.on('success', function(e) {
console.log(e);
$('.copy-btn').click();
});
clipboard.on('error', function(e) {
console.log(e);
});
</script>
HTML
<div class="copy-btn" data-clipboard-text="28A745">Copy the attribute</div>
