clipboardjs

Overview

The Clipboard.js module provides integration with the clipboard.js library, which allows non-flash based clipboard copying using the HTML5 Clipboard API.

Usage

The module provides a field formatter for email, link, string, string_long, number and slug fields.

Available are the Clipboard.js Button, the Clipboard.js Snippet, the Clipboard.js Textarea and the well-known Clipboard.js Textfield formatter.

The Clipboard.js can be added to any supported field type field by visiting the manage display page for the entity and choosing Clipboard.js as the field formatter.

Custom form fields can also use clipboard.js using the form api or in a render
array using the theme function to display the element:

$form['clipboardjs'] = [
  '#theme' => 'clipboardjs_button',
  '#value' => 'Any copyable value.',
];

Or a full example of one of the available templates e.g., clipboardjs_button,
clipboardjs_snippet, clipboardjs_textarea or clipboardjs_textfield:

$form['clipboardjs'] = [
  '#type' => 'item',
  '#theme' => 'clipboardjs_textfield',
  '#title' => $this->t('Clipboard.js Textfield'),
  '#value' => 'Any copyable value.',
  '#label' => $this->t('Click to copy'),
  '#alert_style' => 'tooltip', // e.g., 'tooltip', 'alert' or 'none'
  '#alert_text' => $this->t('Copied!'),
];

Requirements

• Clipboard.js library

Installation
It is assumed you are installing Drupal through Composer using the Drupal
Composer facade. See https://www.drupal.org/docs/develop/using-composer/using-composer-to-man...

It is recommended downloading third-party libraries using composer. See https://www.drupal.org/docs/develop/using-composer/manage-dependencies#t...
Follow the instructions to set up the Asset Packagist.

composer require npm-asset/clipboard:^2.0.11

🇺🇦

#StandWithUkraine
Please consider supporting Ukraine in a fight for their freedom and safety of Europe.

Logo icon by Solar Icons in CC Attribution License via SVG Repo