highlightjs-copy Demo

View on GitHub

Basic examples

Basic copy/paste

Try copying the code below and pasting in the preview.

function readmeDemo() {
  alert("Hello world!");
}

let x = 5;
let y = 8;
return x + y;
// 13

console.log('Hello world!');

Advanced hooks

Hooks allow you to listen to copy events and intercept the copy event before it is applied to the clipboard.

Usage

hljs.addPlugin(new CopyButtonPluginClass({
  hook: (text, el) => text.toUpperCase()
}));

Append strings

You can append string values to copied code. In this example, a copyright message will automatically be appended.

Here's an example where you can prepend copy...

Replace strings

In this example, we'll replace the template strings with predefined values when copying.

Replace template strings with other values.
My name is {{name}}
my favorite animal is a {{dog}}

Update the code element

Change the color of the codeblock when it is copied.

Copy me and watch me change!