Jekyll Code snippet copy-to-clipboard button : <h1>The Problem</h1>

<p>I am building a Jekyll site with the <a href="https://github.com/jekyll/minima" rel="noreferrer">minima</a> theme to publish some tutorial online. The tutorial pages contain many code snippets, for example:</p>

<pre><code>```javascript
/* Global scope: this code is executed once */
const redis = require('redis');

const host = &lt;HOSTNAME&gt;;
const port = &lt;PORT&gt;;
const password = &lt;PASSWORD&gt;;

...
```
</code></pre>

<p>I would like to add a "copy to clipboard" button to each code snippet (<a href="https://clipboardjs.com/#example-target" rel="noreferrer">example</a>), but not sure what's the right way to do it in Jekyll.</p>

<h1>What have I tried</h1>

<ul>
<li>Using <a href="https://clipboardjs.com/#example-target" rel="noreferrer">clipboardjs.com</a>. It requires a unique ID for each snippet, and I'm not sure how to implement this in Jekyll/Markdown.</li>
<li>STFW</li>
</ul>

<h1>My question</h1>

<p><strong>How can I add a "Copy to Clipboard" button for code snippets in Jekyll?</strong></p>
