Shopify themes, liquid, logos, and UX
How do I code a button that will copy specific text to the clipboard?
For example: <p>DISCOUNTCODE</p>, customer will click on the button, and the <p>DISCOUNTCODE</p> will be copied to the user clipboard so he/she can paste it on checkout.
Hello, I was working on a similar issue, so I thought I would post my solution. I used java to create a citation for blog articles. I am unsure where you will use your code but this may help if you are in the liquid.
<p id="sample">your conent to be copied</p>
<a class="btn btn--tertiary btn--small" href="#" onclick="CopyToClipboard('sample');return false;">Copy</a>
<script>
function CopyToClipboard(id)
{
var r = document.createRange();
r.selectNode(document.getElementById(id));
window.getSelection().removeAllRanges();
window.getSelection().addRange(r);
document.execCommand('copy');
window.getSelection().removeAllRanges();
}
</script>
You can see an example of it here at the bottom of the page https://vincenttriola.com/blogs/ten-years-of-academic-writing/hr-s-role-in-public-private-sector
Did you figure this out? I need this as a possible workaround for Dawn's silly placement of the discount code prompt in checkout.
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025