PRODUCTION READY

not production ready

Copy to Clipboard

About

A very easy to use script tag that allows copy functionality. Additional options include custom copy text and custom cursors.

Implement

Step 1. Embed The Script Tag

The implement this code resource, simply and paste this code onto your website:

Step 2. Set Attributes

Set Script Tag Attributes

No items found.

Set Element Attributes

No items found.
1. Activate Functionality
jl-copy-to-clipboard="true"
Set the jl-copy-to-clipboard to true to enable functionality. You can set multiple attributes on the same page.

2. Copy Custom Text (optional)
jl-copy-to-clipboard-text="{{your text here}}"
If you wish to set custom text to copy, you can use the jl-copy-to-clipboard-text attribute. Otherwise, the text of the element content will be copied.

3. Set Custom Cursor (optional)
jl-copy-to-clipboard-cursor="true"
If you want to show a icon when the user hovers over the element, add the jl-copy-to-clipboard-cursor attribute and set it to true.

Demo

Code

If you're comfortable with JavaScript, you can add (and potentially alter) the following code directly on your website.

More Code Resources

See All Code Resources