Title: MD Click Copyboard
Author: Mustapha Samios
Published: <strong>October 29, 2025</strong>
Last modified: October 29, 2025

---

Search plugins

![](https://ps.w.org/md-click-copyboard/assets/banner-772x250.png?rev=3386170)

![](https://ps.w.org/md-click-copyboard/assets/icon-256x256.png?rev=3386170)

# MD Click Copyboard

 By [Mustapha Samios](https://profiles.wordpress.org/motiondigital/)

[Download](https://downloads.wordpress.org/plugin/md-click-copyboard.1.0.0.zip)

 * [Details](https://test.wordpress.org/plugins/md-click-copyboard/#description)
 * [Reviews](https://test.wordpress.org/plugins/md-click-copyboard/#reviews)
 *  [Installation](https://test.wordpress.org/plugins/md-click-copyboard/#installation)
 * [Development](https://test.wordpress.org/plugins/md-click-copyboard/#developers)

 [Support](https://wordpress.org/support/plugin/md-click-copyboard/)

## Description

MD Click Copyboard is a powerful WordPress plugin that allows you to create beautiful,
customizable click-to-copy input boxes for sharing information on your website. 
Whether you need to share API keys, passwords, code snippets, email addresses, or
any other content, this plugin makes it easy and elegant.

Perfect for:
 * Documentation sites * Client portals * API documentation * Support
sites * Developer resources * Sharing sensitive information securely

### Features

#### Core Functionality

 * **Custom Post Type Management** – Dedicated admin interface for managing copy
   elements
 * **Shortcode Support** – Simple `[mdcc id="123"]` shortcode syntax
 * **Visual Feedback** – Clear visual indicators when content is copied
 * **Fallback Support** – Works with modern Clipboard API and older browsers
 * **Non-Intrusive** – Doesn’t interfere with existing WordPress functionality

#### Customization Options

 * **Button Location**: Choose between “Inside Input Box” or “Outside Input Box”
 * **Button Styles**: Three options – Icon Only, Text Only, or Icon and Text
 * **Input Styles**: Label above the content or label inside (left aligned)
 * **Label Control**: Show or hide labels completely for a clean look
 * **Auto-sizing**: Automatic height calculation for single-line and multi-line 
   content

#### User Experience

 * **Modern Design** – Clean, professional appearance that blends with any theme
 * **Responsive** – Works perfectly on desktop, tablet, and mobile devices
 * **Accessible** – Keyboard navigation and screen reader support
 * **Fast Performance** – Optimized database queries for lightning-fast load times
 * **WordPress Native** – Follows WordPress coding standards and best practices

#### Security

 * **Sanitized Output** – All user input is properly sanitized and escaped
 * **Nonce Verification** – All form submissions are verified with nonces
 * **Permission Checks** – Only users with appropriate permissions can manage elements

### Usage

#### Creating Your First Copy Element

 1. Navigate to **Copy Elements** in your WordPress admin menu
 2. Click **New Element** button (opens in a new tab for your convenience)
 3. Fill in the configuration options:

**Basic Settings:**
 * **Element Title** (top field) – Internal name for your own
reference, not shown to visitors * **Content** – The actual text that will be copied
when users click the button

**Appearance Options:**
 * **Show Label** – Toggle this checkbox to show or hide
the label * ✅ **Checked** – Shows a label with your content (professional look)*
☐ **Unchecked** – Clean, browser address bar style (no label)

 * **Button Location** – Where the copy button appears
    - **Inside Input Box** – Button appears inside the right side of the input box
    - **Outside Input Box** – Button appears as a separate button below the input
      box
 * **Button Style** – How the button looks
    - **Icon Only** – Just the clipboard icon (most common)
    - **Text Only** – Just the word “Copy”
    - **Icon and Text** – Both icon and “Copy” text
 * **Input Style** (only when label is shown) – How the label appears with content
    - **Label Above** – Label appears as a separate line above the content
    - **Label Inside** – Label appears inside the left side of the input box (like“
      Email: content”)

 1. Click **Update** to save your copy element

#### Managing Copy Elements

From the Copy Elements list page, you can:
 * **View All Elements** – See a table
of all your copy elements with their IDs * **Edit** – Opens the element in a new
tab for editing * **Delete** – Permanently delete an element * **Copy Shortcode**–
Click to copy the shortcode to your clipboard

#### Using Shortcodes

The plugin generates shortcodes automatically. After creating a copy element, you’ll
see its shortcode displayed in the Copy Elements list.

**Basic Shortcode:**
 `[mdcc id="123"]`

Simply replace `123` with the ID of your copy element. You can find the ID in the
Copy Elements list table.

**Where to Use Shortcodes:**

 * **Posts and Pages** – Insert shortcode directly in the WordPress editor
 * **Page Builders** – Works with Gutenberg, Elementor, Divi, Beaver Builder, etc.
 * **Widget Areas** – Use in Text Widgets or Custom HTML widgets
 * **Templates** – Place directly in PHP template files:
    `<?php echo do_shortcode('[
   mdcc id="123"]'); ?>`

**Finding Element IDs:**
 The element ID appears in the Copy Elements list table
in the first column. You can also see it in the shortcode column next to each element.

### Examples

Here are common use cases for the plugin:

#### Example 1: Email Address with Label

**Use Case**: Sharing email addresses in documentation

**Configuration:**
 * Show Label: ✅ Yes * Label: “Email” * Content: “user@example.
com” * Button Location: Inside Input Box * Button Style: Icon Only * Input Style:
Label Above

**Result**: Professional email display with clear label

#### Example 2: URL Without Label (Browser Bar Style)

**Use Case**: Sharing URLs in a minimal, clean format

**Configuration:**
 * Show Label: ☐ No * Content: “https://www.youtube.com/” * Button
Location: Inside Input Box * Button Style: Icon Only

**Result**: Clean address bar style without any label

#### Example 3: API Key with Bold Display

**Use Case**: Sharing API keys or authentication tokens

**Configuration:**
 * Show Label: ✅ Yes * Label: “API Key” * Content: “sk_live_1234567890abcdef”*
Button Location: Outside Input Box * Button Style: Icon and Text * Input Style: 
Label Above

**Result**: Prominent display perfect for sharing sensitive codes

#### Example 4: Phone Number

**Use Case**: Contact information display

**Configuration:**
 * Show Label: ✅ Yes * Label: “Phone” * Content: “+61 2 1234
5678” * Button Location: Inside Input Box * Button Style: Text Only

**Result**: Clear label with professional appearance

#### Example 5: Code Snippet (Multi-line)

**Use Case**: Sharing multi-line code or commands

**Configuration:**
 * Show Label: ✅ Yes * Label: “Command” * Content: `git clone
https://github.com/user/repo.git` * Button Location: Outside Input Box * Button 
Style: Icon Only

**Result**: Auto-sized box that expands for longer content

### Customization

The plugin is highly customizable through CSS. All styles are contained in `css/
mdcc-global.css` and can be modified to match your theme.

#### CSS Customization

**Main CSS Variables** (in `:root`):
 `css --mdcc-accent: #6400f0; /* Primary accent
color */ --mdcc-accent-transparent: color-mix(...); /* Transparent accent */ --mdcc-
error-bg: #cd5c5c; /* Error/destructive actions */ --mdcc-success-bg: #28a745; /*
Success notifications */

**Key CSS Classes:**
 * `.mdcc_wrapper` – Main container wrapper * `.mdcc_copy-input`–
The textarea/input field * `.mdcc_copy-button` – The copy button * `.mdcc_copy-label`–
Label text styling * `.inside-button` / `.outside-button` – Button location modifiers*`.
logo_only-style` / `.text_only-style` / `.logo_and_text-style` – Button style classes*`.
mdcc_single-line` – Single-line content modifier * `.label_inside-style` – Label
inside input styling

**Admin Interface Classes:**
 * `.mdcc_admin_form` – Admin form container * `.mdcc_btn-
save` / `.mdcc_btn-delete` / `.mdcc_btn-copy` – Admin button styles * `.mdcc_custom_actions_table`–
List page custom actions

#### Advanced Customization

**Modifying Colors:**
 Change the CSS variables in `css/mdcc-global.css` to match
your brand colors. The plugin uses a modern color-mix() approach that automatically
generates transparent variations.

**Hiding Labels:**
 You can either use the “Show Label” checkbox or add this CSS:`
css .mdcc_copy-label { display: none !important; }

**Custom Button Styling:**
 Target specific button styles using the provided classes:`
css .mdcc_copy-button.logo_only-style { /* Custom styling for icon-only buttons */}

### Browser Support

**Modern Browsers (Recommended):**
 * Chrome 60+ (uses modern Clipboard API) * Firefox
55+ (uses modern Clipboard API) * Safari 10+ (uses modern Clipboard API) * Edge 
79+ (uses modern Clipboard API)

**Legacy Browser Support:**
 * Internet Explorer 11+ (fallback to document.execCommand)*
Older versions of Chrome/Firefox/Safari (fallback support)

**Mobile Browsers:**
 * iOS Safari 10+ * Chrome Mobile * Samsung Internet * Firefox
Mobile

**Important:** For secure contexts (HTTPS), the plugin uses the modern Clipboard
API. For non-secure contexts, it falls back to `document.execCommand()` with full
browser compatibility.

### Developer Information

**GitHub Repository**: [Available on request]
 **Author**: Motion Digital IT **Author
URI**: https://motiondigital.com.au **Plugin Homepage**: https://motiondigital.com.
au/plugins

**File Structure:**
 `md-click-copyboard/ ├── assets/ │ ├── banner-*.png # WordPress.
org banner images │ ├── icon-*.png # Plugin icons │ └── screenshot-*.jpg # Screenshots
for WordPress.org ├── css/ │ └── mdcc-global.css # All styling (frontend & admin)
├── js/ │ ├── mdcc-admin.js # Admin JavaScript functionality │ └── mdcc-copy.js #
Frontend copy functionality ├── languages/ │ └── md-click-copyboard.pot # Translation
template ├── md-click-copyboard.php # Main plugin file ├── readme.txt # This file
└── uninstall.php # Cleanup on deletion

**Hooks and Filters:**
 * `save_post` – Handles saving of copy element meta data*`
admin_enqueue_scripts` – Enqueues admin scripts and styles * `wp_enqueue_scripts`–
Enqueues frontend scripts and styles * `post_row_actions` – Modifies edit links 
to open in new tab * Custom hooks for meta box rendering and column display

**Functions for Developers:**
 * `render_meta_box()` – Renders the copy element 
configuration form * `save_meta_boxes()` – Saves copy element configuration * `render_shortcode()`–
Renders the shortcode output * `get_meta_data()` – Retrieves element meta data (
optimized single query) * `render_custom_columns()` – Adds custom columns to admin
list

### Requirements

**Minimum Requirements:**
 * WordPress: 5.0 or higher * PHP: 7.4 or higher * MySQL:
5.6 or higher

**Recommended:**
 * WordPress: 6.8 or higher * PHP: 8.0 or higher * Modern browser
for optimal Clipboard API support

**Server Requirements:**
 * HTTPS recommended (for modern Clipboard API) * JavaScript
enabled in browser * Cookies enabled for admin functionality

### License

This plugin is licensed under the GPL v2 or later.

    ```
    `
    ```

Copyright (C) 2024 Motion Digital IT

This program is free software; you can redistribute it and/or modify
 it under the
terms of the GNU General Public License as published by the Free Software Foundation;
either version 2 of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
 but WITHOUT ANY
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A 
PARTICULAR PURPOSE. See the GNU General Public License for more details. `

### Support

**Getting Help:**
 * **Documentation**: Full documentation available at https://
motiondigital.com.au/docs * **Support Forum**: Available through WordPress.org plugin
directory * **Email**: support@motiondigital.com.au * **Website**: https://motiondigital.
com.au

**Before Requesting Support:**
 1. Check this FAQ section for common solutions 2.
Ensure you’re using the latest version of the plugin 3. Test with default WordPress
theme to rule out theme conflicts 4. Deactivate other plugins to check for conflicts
5. Clear your browser cache and WordPress cache

**Reporting Issues:**
 When reporting issues, please include: * WordPress version*
PHP version * Browser and version * Description of the issue * Steps to reproduce*
Any error messages * Screenshots if applicable

**Feature Requests:**
 We welcome feature requests! Contact us with your ideas for
improving the plugin.

### Credits

**Development:**
 * Built with WordPress best practices * Follows WordPress coding
standards * Uses modern CSS and JavaScript * Optimized for performance

**Thanks To:**
 * WordPress Community for the amazing CMS platform * All beta testers
who provided valuable feedback * Users who support open-source software

## Screenshots

 * [[
 * **Copy Elements Admin List** – View and manage all your copy elements
 * [[
 * **Creating a New Element** – Intuitive form with all customization options
 * [[
 * **Example Output – Email with Label** – Professional look with label

## Installation

#### Using WordPress Admin

 1. Log in to your WordPress admin panel
 2. Navigate to **Plugins**  **Add New**
 3. Click **Upload Plugin**
 4. Choose the `md-click-copyboard.zip` file
 5. Click **Install Now**
 6. After installation, click **Activate Plugin**

#### Manual Installation

 1. Download and extract the plugin files
 2. Upload the `md-click-copyboard` folder to `/wp-content/plugins/`
 3. Go to **Plugins** in your WordPress admin
 4. Locate “MD Click Copyboard” in the list
 5. Click **Activate**

#### First Use

After activation, you’ll find a new menu item called “Copy Elements” in your WordPress
admin sidebar. Click it to start creating your first copy element.

## FAQ

### Installation & Setup

**Q: How do I install the plugin?**
 A: Upload via WordPress admin (Plugins  Add
New  Upload Plugin) or manually extract to `/wp-content/plugins/md-click-copyboard/`
and activate.

**Q: Where do I find the plugin after activation?**
 A: Look for “Copy Elements”
in your WordPress admin sidebar menu.

**Q: Do I need any special skills to use this plugin?**
 A: No coding knowledge 
required! The plugin provides an intuitive interface with checkboxes and dropdowns
for all settings.

### Using the Plugin

**Q: How do I insert a copy element on my page?**
 A: Create a copy element in the
admin, note its ID, then use the shortcode `[mdcc id="ID"]` on your page.

**Q: Can I use multiple copy elements on the same page?**
 A: Yes! You can add as
many shortcodes as you need on any page or post.

**Q: Does the copy button work on mobile devices?**
 A: Yes, the plugin is fully
responsive and works on all devices. It uses modern Clipboard API with fallback 
support for older browsers.

**Q: Can I change the appearance of the copy elements?**
 A: Yes, you can customize
the CSS in `css/mdcc-global.css`. The plugin uses CSS variables for easy color customization.

### Troubleshooting

**Q: The copy button isn’t working on my site**
 A: Ensure your site is using HTTPS.
Modern browsers require HTTPS for the Clipboard API. The plugin includes a fallback
for non-HTTPS sites.

**Q: The button is not visible when placed “inside” the input box**
 A: Make sure
your content isn’t too long. The button requires 50px of space on the right side
when placed inside.

**Q: My changes aren’t saving**
 A: Make sure you click the “Update” button on the
admin form after making changes. The form tracks changes and disables the button
when there are no unsaved changes.

**Q: Can I edit an element after creating it?**
 A: Yes! Navigate to Copy Elements
in your admin menu, find your element, and click “Edit” to modify it.

### Technical Questions

**Q: What permissions are required?**
 A: Users need `edit_posts` capability to 
create and edit copy elements. Editors and administrators have full access by default.

**Q: Does this plugin create database tables?**
 A: No, the plugin uses WordPress’s
native post meta system. No custom tables are created.

**Q: Will my data be deleted when I deactivate the plugin?**
 A: No, your copy elements
are preserved as custom post types. They will be available again when you reactivate.
Use “Deactivate and Delete” to permanently remove all data.

**Q: Can I import/export copy elements?**
 A: Copy elements are standard WordPress
posts, so any WordPress backup/restore solution will include your elements.

## Reviews

There are no reviews for this plugin.

## Contributors & Developers

“MD Click Copyboard” is open source software. The following people have contributed
to this plugin.

Contributors

 *   [ Mustapha Samios ](https://profiles.wordpress.org/motiondigital/)

[Translate “MD Click Copyboard” into your language.](https://translate.wordpress.org/projects/wp-plugins/md-click-copyboard)

### Interested in development?

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

## Changelog

#### 1.0.0

 * Initial release
 * Custom post type for managing copy elements
 * Inside/outside button location options
 * Three button style options (icon only, text only, icon and text)
 * Two input style options (label above, label inside)
 * Show/hide label toggle
 * Shortcode support with ID attribute
 * Custom admin interface with action buttons
 * Optimized database queries for fast page loads
 * Responsive design for all devices
 * Modern Clipboard API with fallback support
 * Accessible keyboard navigation
 * Visual feedback on successful copy
 * Automatic height calculation for content
 * Open in new tab functionality for better UX
 * Security: nonce verification and input sanitization

## Meta

 *  Version **1.0.0**
 *  Last updated **7 months ago**
 *  Active installations **Fewer than 10**
 *  WordPress version ** 5.0 or higher **
 *  Tested up to **6.8.5**
 *  PHP version ** 7.4 or higher **
 *  Language
 * [English (US)](https://wordpress.org/plugins/md-click-copyboard/)
 * Tags
 * [button](https://test.wordpress.org/plugins/tags/button/)[clipboard](https://test.wordpress.org/plugins/tags/clipboard/)
   [copy](https://test.wordpress.org/plugins/tags/copy/)[copy to clipboard](https://test.wordpress.org/plugins/tags/copy-to-clipboard/)
   [shortcode](https://test.wordpress.org/plugins/tags/shortcode/)
 *  [Advanced View](https://test.wordpress.org/plugins/md-click-copyboard/advanced/)

## Ratings

No reviews have been submitted yet.

[Your review](https://wordpress.org/support/plugin/md-click-copyboard/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/md-click-copyboard/reviews/)

## Contributors

 *   [ Mustapha Samios ](https://profiles.wordpress.org/motiondigital/)

## Support

Got something to say? Need help?

 [View support forum](https://wordpress.org/support/plugin/md-click-copyboard/)