Title: Clipboard Snippet Copier
Author: WebCodingPlace
Published: <strong>🍂 🔟 13, 2025</strong>
Last modified: 🌸5️⃣ 21, 2026

---

Search plugins

![](https://ps.w.org/clipboard-snippet-copier/assets/banner-772x250.jpg?rev=3546975)

![](https://ps.w.org/clipboard-snippet-copier/assets/icon-256x256.png?rev=3536562)

# Clipboard Snippet Copier

 By [WebCodingPlace](https://profiles.wordpress.org/webcodingplace/)

[Download](https://downloads.wordpress.org/plugin/clipboard-snippet-copier.1.4.zip)

 * [Details](https://emoji.wordpress.org/plugins/clipboard-snippet-copier/#description)
 * [Reviews](https://emoji.wordpress.org/plugins/clipboard-snippet-copier/#reviews)
 *  [Installation](https://emoji.wordpress.org/plugins/clipboard-snippet-copier/#installation)
 * [Development](https://emoji.wordpress.org/plugins/clipboard-snippet-copier/#developers)

 [Support](https://wordpress.org/support/plugin/clipboard-snippet-copier/)

## Description

**Clipboard Snippet Copier** lets you share ready-to-use shortcodes, demo layouts,
or any reusable code snippets with your visitors. Click a button and the snippet
is copied straight to their clipboard. No manual selection, no copy/paste errors.

You decide whether the snippet stays hidden (fetched only when copied) or is displayed
inline as a styled code block. Either mode is one click away for the visitor.

#### Why use it?

 * **Sell or showcase shortcodes** — give buyers a “Copy Demo” button without exposing
   messy markup.
 * **Document your code** — share PHP / JS / CSS examples on tutorial pages with
   a proper copy button.
 * **Reduce support tickets** — eliminate “the shortcode didn’t work” issues caused
   by smart quotes, missing brackets, or whitespace mangling.
 * **Track engagement** — built-in per-snippet copy counter shows what your audience
   actually uses.

#### Key features

 * 📋 One-click copy to clipboard with success/failure tooltip.
 * 🔒 **Hidden mode** — the snippet is stored in the admin and fetched via AJAX 
   only when copied (never rendered in the HTML).
 * 👁️ **Inline mode** — render the snippet visibly as a `<pre><code>` block with
   a copy button on top.
 * 🧱 **Gutenberg block** with sidebar controls (snippet ID, label, inline toggle,
   language hint).
 * 🔢 **Shortcode** for the Classic Editor, WPBakery, Elementor and any other builder.
 * 🧮 **Copy counter** — sortable “Copies” column on the admin list, so you can 
   see what’s popular.
 * ⚙️ **Settings page** — default label, default CSS class, tooltip text, guest-
   access toggle.
 * 📝 **CodeMirror editor** on the snippet edit screen — keeps your indentation 
   and angle brackets intact.
 * ⚡ Tiny footprint — no jQuery dependency on the frontend, no external libraries.
 * 🌐 Translation-ready.

#### How it works

 1. You add a snippet in **Code Snippets  Add New** and note its ID.
 2. You drop the **Clipboard Snippet** block (or the `[clipsnco_code_copy_btn]` shortcode)
    onto any page.
 3. When a visitor clicks the button, the snippet is fetched over AJAX and written 
    to their clipboard — without ever appearing in the page source (unless you turned
    on inline mode).

### Usage

#### Quick start (shortcode)

    ```
    [clipsnco_code_copy_btn id="123" label="Copy Code"]
    ```

Where `123` is the ID of your snippet (visible in the **Code Snippets** admin list).

#### Shortcode attributes

 * `id` _(required, integer)_ — the snippet ID.
 * `label` _(optional, string)_ — button text. Defaults to the value set on the 
   Settings page.
 * `class` _(optional, string)_ — extra CSS classes added to the button.
 * `inline` _(optional, “yes” / “no”)_ — when `yes`, the snippet is rendered as 
   a `<pre><code>` block with a copy button on top. Default `no`.
 * `language` _(optional, string)_ — e.g. `php`, `js`, `css`. Adds a `language-xxx`
   class on the `<code>` element so syntax-highlighter libraries (Prism.js, highlight.
   js) can colourise it.

Examples:

 * Hidden snippet, custom label: `[clipsnco_code_copy_btn id="42" label="Copy shortcode"]`
 * Inline display with PHP highlighting: `[clipsnco_code_copy_btn id="42" inline
   ="yes" language="php"]`
 * Extra CSS class for theme styling: `[clipsnco_code_copy_btn id="42" class="my-
   cta-btn"]`

#### Gutenberg block

In the block editor, search for **“Clipboard Snippet”** and insert it. The sidebar
lets you set:

 * **Snippet ID** — the post ID of the snippet to copy.
 * **Button label** — overrides the default label.
 * **Show code inline** — toggle hidden vs inline display.
 * **Language hint** — optional syntax-highlighter class.

The block is server-rendered, so you can switch between block and shortcode usage
freely.

#### Alternative button markup

If your page builder won’t let you drop a `<button>` element, you can put any element
on the page with the data attribute or the helper class — the plugin’s frontend 
script picks it up automatically:

    ```
    <a href="#" class="wcp-code-copy-btn" data-codecopy-id="123">Copy</a>
    ```

…or, when even attributes aren’t allowed, use the class-only form:

    ```
    <span class="wcp-code-copy-btn data-codecopy-id-123">Copy</span>
    ```

#### Settings

**Code Snippets  Settings** lets you configure:

 * Default button label
 * Default CSS class applied to every button
 * Tooltip text shown on copy success / failure
 * Whether non-logged-in visitors are allowed to copy snippets

#### Copy counter

Every successful copy by a non-editor user bumps a `_clipsnco_copy_count` post meta
value. The count is shown in the **Copies** column on the snippets admin list. Click
the column header to sort by most-copied.

#### Styling

The button receives the class `wcp-code-copy-btn` plus anything you add via the 
shortcode/block `class` attribute. The inline-mode wrapper uses these classes (override
them from your theme):

 * `.clipsnco-inline-wrap` — outer container
 * `.clipsnco-inline-toolbar` — top bar containing the copy button
 * `.clipsnco-pre` — the `<pre>` element
 * `.clipsnco-code` — the `<code>` element (also gets `language-xxx` when set)

## Screenshots

[⌊The Code Snippets admin list with the ID, Shortcode and Copies columns.⌉⌊The Code
Snippets admin list with the ID, Shortcode and Copies columns.⌉[

The Code Snippets admin list with the **ID**, **Shortcode** and **Copies** columns.

[⌊Editing a snippet — the CodeMirror editor keeps indentation and syntax intact.⌉⌊
Editing a snippet — the CodeMirror editor keeps indentation and syntax intact.⌉[

Editing a snippet — the CodeMirror editor keeps indentation and syntax intact.

[⌊The Settings page (default label, default class, tooltip text, guest-access toggle).⌉⌊
The Settings page (default label, default class, tooltip text, guest-access toggle)
.⌉[

The Settings page (default label, default class, tooltip text, guest-access toggle).

[⌊The Clipboard Snippet Gutenberg block with its sidebar controls.⌉⌊The Clipboard
Snippet Gutenberg block with its sidebar controls.⌉[

The **Clipboard Snippet** Gutenberg block with its sidebar controls.

[⌊A copy button on the frontend, with the success tooltip.⌉⌊A copy button on the
frontend, with the success tooltip.⌉[

A copy button on the frontend, with the success tooltip.

[⌊Inline mode rendering the snippet as a styled <pre><code> block.⌉⌊Inline mode 
rendering the snippet as a styled <pre><code> block.⌉[

Inline mode rendering the snippet as a styled `<pre><code>` block.

## Blocks

This plugin provides 1 block.

 *   Clipboard Snippet

## Installation

 1. Upload the plugin files to `/wp-content/plugins/clipboard-snippet-copier`, or install
    it directly from the WordPress.org repository.
 2. Activate the plugin through the **Plugins** screen.
 3. Go to **Code Snippets  Add New** to create your first snippet.
 4. Insert the **Clipboard Snippet** block on any page, or paste the shortcode below.

## FAQ

### Can I use multiple buttons on the same page?

Yes. Drop as many blocks/shortcodes as you like — each one copies its own snippet.

### Will the snippet appear in the page source?

Only if you enable inline mode. In the default hidden mode the snippet lives in 
the WordPress admin and is fetched over AJAX the moment the button is clicked.

### Does it work with page builders like WPBakery or Elementor?

Yes. Place the `[clipsnco_code_copy_btn]` shortcode in any text/HTML widget, content
block or builder element.

### Can I show the code on the page AND have a copy button?

Yes — that’s inline mode. Set `inline="yes"` on the shortcode or flip the **Show
code inline** toggle on the block.

### Does this play nicely with syntax highlighters?

Yes. In inline mode, add the `language` attribute (`language="php"`, `language="
js"`, …) and the plugin emits a matching `language-xxx` class on the `<code>` element.
Prism.js, highlight.js and most other highlighters pick that up automatically.

### Where can I see how many times a snippet has been copied?

Go to **Code Snippets** in the admin. The **Copies** column shows the running total;
click the header to sort.

### Can I prevent non-logged-in visitors from copying snippets?

Yes. **Code Snippets  Settings  Allow guests** controls this.

### Does the plugin require jQuery?

No. The frontend script uses native `fetch` and the Clipboard API, with an `execCommand`
fallback for older/insecure contexts.

### Is the plugin translation-ready?

Yes — text domain `clipboard-snippet-copier`, translations loaded from the `/languages`
folder.

## Reviews

There are no reviews for this plugin.

## Contributors & Developers

“Clipboard Snippet Copier” is open source software. The following people have contributed
to this plugin.

Contributors

 *   [ WebCodingPlace ](https://profiles.wordpress.org/webcodingplace/)

[Translate “Clipboard Snippet Copier” into your language.](https://translate.wordpress.org/projects/wp-plugins/clipboard-snippet-copier)

### Interested in development?

[Browse the code](https://plugins.trac.wordpress.org/browser/clipboard-snippet-copier/),
check out the [SVN repository](https://plugins.svn.wordpress.org/clipboard-snippet-copier/),
or subscribe to the [development log](https://plugins.trac.wordpress.org/log/clipboard-snippet-copier/)
by [RSS](https://plugins.trac.wordpress.org/log/clipboard-snippet-copier/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

#### 1.4

 * New: **Gutenberg block** “Clipboard Snippet” with sidebar controls (id, label,
   inline toggle, language hint).
 * New: **Inline mode** — render the snippet visibly as a `<pre><code>` block with
   a copy button on top (`inline="yes"`).
 * New: **Language hint** attribute that emits a `language-xxx` class for syntax
   highlighters.
 * New: **Settings page** — default label, default CSS class, tooltip text, guest-
   access toggle.
 * New: **Copy counter** per snippet, shown as a sortable admin column.
 * New: **CodeMirror editor** on the snippet edit screen for proper code formatting.
 * Improvement: Frontend script no longer depends on jQuery.
 * Improvement: Centralised `CLIPSNCO_VERSION` constant used across asset enqueues.
 * Improvement: Translations now properly loaded via `load_plugin_textdomain()`.
 * Improvement: Escaped admin column output.
 * Improvement: AJAX response now includes a `content` key (legacy `shortcode` key
   preserved for backwards compatibility).
 * Fix: Removed stray `console.log` from the frontend script.

#### 1.2

 * Fixed: Resource version not set in call to `wp_enqueue_style()`.

#### 1.1

 * Bug fixes.

#### 1.0

 * Initial release of Clipboard Snippet Copier.

## Meta

 *  Version **1.4**
 *  Last updated **5 months ago**
 *  Active installations **Fewer than 10**
 *  WordPress version ** 5.0 or higher **
 *  Tested up to **7.0.7**
 *  PHP version ** 7.2 or higher **
 *  Language
 * [English (US)](https://wordpress.org/plugins/clipboard-snippet-copier/)
 * Tags
 * [clipboard](https://emoji.wordpress.org/plugins/tags/clipboard/)[code snippet](https://emoji.wordpress.org/plugins/tags/code-snippet/)
   [copy](https://emoji.wordpress.org/plugins/tags/copy/)[Gutenberg block](https://emoji.wordpress.org/plugins/tags/gutenberg-block/)
 *  [Advanced View](https://emoji.wordpress.org/plugins/clipboard-snippet-copier/advanced/)

## Ratings

No reviews have been submitted yet.

[Your review](https://wordpress.org/support/plugin/clipboard-snippet-copier/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/clipboard-snippet-copier/reviews/)

## Contributors

 *   [ WebCodingPlace ](https://profiles.wordpress.org/webcodingplace/)

## Support

Got something to say? Need help?

 [View support forum](https://wordpress.org/support/plugin/clipboard-snippet-copier/)

## Donate

Would you like to support the advancement of this plugin?

 [ Donate to this plugin ](https://www.paypal.me/webcodingplace)