diff options
Diffstat (limited to 'README.md')
| -rw-r--r-- | README.md | 31 |
1 files changed, 31 insertions, 0 deletions
@@ -92,6 +92,34 @@ curl -L "https://cdn.jsdelivr.net/npm/prismjs@1/components/prism-javascript.min. Then add each `<script>` tag for these files to `index.html` (see Step 3). +### Optional: Copy-to-Clipboard Button + +To add a **copy** button to every fenced code block, download the +[docsify-copy-code](https://github.com/jperasmus/docsify-copy-code) plugin. As with +the assets above, it is fetched once and served locally thereafter: + +```bash +# Copy-to-clipboard plugin +curl -L "https://cdn.jsdelivr.net/npm/docsify-copy-code@3/dist/docsify-copy-code.min.js" \ + -o assets/js/docsify-copy-code.min.js +``` + +The plugin injects its own CSS via JavaScript, so there is **no separate CSS file** +to download. Just add its `<script>` tag to `index.html` **after** `docsify.min.js` +(see Step 3). Copying uses `document.execCommand('copy')`, so it works over plain +`http://` as well as `https://`. + +It works with no configuration. To customise the button labels, add a `copyCode` +block to the `window.$docsify` object in `index.html`: + +```js +copyCode: { + buttonText: 'Copy to clipboard', + errorText: 'Error', + successText: 'Copied' +} +``` + --- ## Step 3: Create `index.html` @@ -121,6 +149,9 @@ Create `index.html`: <script src="assets/js/docsify.min.js"></script> <script src="assets/js/search.min.js"></script> + <!-- Remove the line below if you did not download the copy-code plugin --> + <script src="assets/js/docsify-copy-code.min.js"></script> + <!-- Remove the lines below if you did not download Prism --> <script src="assets/js/prism-core.min.js"></script> <script src="assets/js/prism-bash.min.js"></script> |