João Carmo Pereira

This plugin will add a new copy to clipboard functionality to Gutenberg Code Block. 
It will add a copy button at the top right corner of the block. After clicked, it will select the text, copy to clipboard, and after copy it will deselect the copied text. No markup here.
This plugin makes use of two javascript libraries: 
Clipboard.js and Prism.js

Carmo Copy to Clipboard

This plugin will add a new copy to clipboard functionality to Gutenberg Code Block.

Freemius

Mahesh Waghmare

Clipboard Agency

Copy Anything to Clipboard is the best WordPress copy to clipboard plugin that adds one-click copy buttons to your website. Perfect for copying code snippets, text, links, coupon codes, deals, contact information, and any content with ease.
This powerful copy to clipboard plugin offers three flexible methods: automatic CSS selector targeting, shortcode integration, and Elementor/Gutenberg widgets. Add copy buttons to code blocks, blockquotes, coupon codes, deals, contact information, and more with just a few clicks.
Key Features:
<ul>
<li>One-click copy to clipboard functionality</li>
<li>Automatic copy button for any CSS selector (pre, blockquote, code, etc.)</li>
<li>Shortcode support: <code>[copy]</code> and <code>[copy_inline]</code></li>
<li>Elementor widgets for 25+ content types</li>
<li>Gutenberg blocks for modern WordPress sites</li>
<li>Mobile-friendly and cross-browser compatible</li>
<li>Lightweight and SEO-friendly</li>
<li>Customizable button styles and positions</li>
<li>Copy as HTML or plain text</li>
<li>Works with all WordPress themes and plugins</li>
</ul>
Perfect for bloggers, developers, e-commerce stores, educational websites, and anyone who wants to make it easy for users to copy content from their WordPress site. 📋
<h3>How to Use</h3>
There are 4 ways to use the “Copy Anything to Clipboard” plugin:
<ol>
<li><a href="https://clipboard.agency/doc/usage/css-selectors/" rel="nofollow ugc">Automatically with “CSS Selector”</a></li>
<li><a href="https://clipboard.agency/doc/usage/shortcode/" rel="nofollow ugc">Manually with “Shortcode”</a></li>
<li>Manually with “Elementor widgets”</li>
<li>Manually with “Gutenberg blocks”</li>
</ol>
<h3>METHOD 1 – Automatically with “CSS Selector”</h3>
This is the quick, most useful way and is mostly used by a lot of users with this plugin.
Use this method, if you want to add the copy button automatically to all the elements with the same selector.
Example 1: If your website post contains code snippets in the <code><pre></code> tag, then by setting the <code>pre</code> tag as selector in “Copy Anything to Clipboard”, it will automatically add the copy button to all the <code>pre</code> tags. Your users can copy the code snippet with just a click.
Example 2: Your blog post has blockquotes and you want to add the copy button to the blockquote. Simply set <code>blockquote</code> as your CSS selector and all blockquotes will have copy buttons automatically.
<h3>How to Use with CSS Selector?</h3>
<ul>
<li>Step 1 – Go to “Copy to Clipboard”</li>
<li>Step 2 – Click on the “Add New” button</li>
<li>Step 3 – Add the selector. E.g. <code>pre</code> or <code>blockquote</code></li>
<li>Step 4 – Click on “Create”</li>
<li>Step 5 – Visit the page and see the copy button</li>
</ul>
For more details read:
<ul>
<li><a href="https://clipboard.agency/blog/add-copy-button-to-blockquote/" rel="nofollow ugc">Add the copy button to Blockquote</a></li>
<li><a href="https://clipboard.agency/blog/add-copy-button-to-code-snippet/" rel="nofollow ugc">Add the copy button to Code Snippet</a></li>
</ul>
<h3>METHOD 2 – Manually with “Shortcode”</h3>
You can use this method if you want to add the copy button to the specific element.
Use the shortcode <code>[copy]</code> or <code>[copy_inline]</code> shortcodes.
E.g.
<pre><code>The zoom meeting is scheduled on data [copy]15 November 2022[/copy] please note down it.
</code></pre>
<h3>How to Use with Shortcode?</h3>
You may use the shortcode <code>[copy_inline]</code> to copy the inline content.
E.g.
<pre><code>Contact us:

- Email: [copy_inline text="contact@clipboard.agency"]
- Phone: [copy_inline text="+91 1234567890"]
- Address: [copy_inline text="123, Street, City, State, Country"]
- Website: [copy_inline text="https://clipboard.agency/"]
- Facebook: [copy_inline text="https://www.facebook.com/clipboard.agency/"]
</code></pre>
Or, Use it as coupon code:
<pre><code>Use coupon code [copy_inline text="COUPONCODE"] to get 10% discount.
</code></pre>
Or, Use it as deal:
<pre><code>Get the deal [copy_inline text="https://clipboard.agency/deal/"] to get 10% discount.
</code></pre>
Or, Use for username and password:
<pre><code>Username: [copy_inline text="username"]
Password: [copy_inline text="password" display="*********"]
</code></pre>
<h3>METHOD 3 – Manually with “Elementor Widgets”</h3>
We build a couple of different widgets for Elementor page builder.
You can use the following widgets to add the copy button to the specific element.
<ul>
<li><a href="https://clipboard.agency/demos/#email-samples" rel="nofollow ugc">Email Samples</a> 📧 Elevate your email communication by referring to our collection of samples. Dive into the intricacies of crafting impactful emails.</li>
<li><a href="https://clipboard.agency/demos/#chatgpt-prompts-ai" rel="nofollow ugc">ChatGPT Prompt’s (AI)</a> 🤖 Harness the power of AI with ChatGPT prompts. Learn how to create effective prompts for dynamic interactions.</li>
<li><a href="https://clipboard.agency/demos/#coupon-codes" rel="nofollow ugc">Coupon Codes</a> 💸 Optimize your savings with our guide on utilizing coupon codes effectively.</li>
<li><a href="https://clipboard.agency/demos/#deals" rel="nofollow ugc">Deals</a> 🛍️ Explore exclusive deals and promotions to make the most of your shopping experience.</li>
<li><a href="https://clipboard.agency/demos/#inspirational-quotes" rel="nofollow ugc">Inspirational Quotes</a> 🌟 Find inspiration in our curated collection of quotes that uplift and motivate.</li>
<li><a href="https://clipboard.agency/demos/#contact-information" rel="nofollow ugc">Contact Information</a> 📞 Organize and manage your contacts with our intuitive contact information templates.</li>
<li><a href="https://clipboard.agency/demos/#addresses" rel="nofollow ugc">Addresses</a> 🏡 Simplify address management and ensure accuracy with our address template.</li>
<li><a href="https://clipboard.agency/demos/#blog-posts" rel="nofollow ugc">Blog Posts</a> 📰 Dive into the world of blogging with tips and templates for creating engaging blog posts.</li>
<li><a href="https://clipboard.agency/demos/#business-information" rel="nofollow ugc">Business Information</a> 🏢 Streamline your business details and maintain a professional image with our business information templates.</li>
<li><a href="https://clipboard.agency/demos/#social-media-posts" rel="nofollow ugc">Social Media Posts</a> 📱 Enhance your social media presence with our templates for creating captivating posts.</li>
<li><a href="https://clipboard.agency/demos/#notes-and-reminders" rel="nofollow ugc">Notes and Reminders</a> 📝 Stay organized and on top of tasks with our note-taking and reminder templates.</li>
<li><a href="https://clipboard.agency/demos/#bookmarks" rel="nofollow ugc">Bookmarks</a> 📚 Keep track of important web pages and resources with our bookmark templates.</li>
<li><a href="https://clipboard.agency/demos/#event-details" rel="nofollow ugc">Event Details</a> 🎉 Plan and organize events seamlessly with our event details templates.</li>
<li><a href="https://clipboard.agency/demos/#travel-information" rel="nofollow ugc">Travel Information</a> ✈️ Make your travels stress-free with templates for organizing essential travel information.</li>
<li><a href="https://clipboard.agency/demos/#lyrics" rel="nofollow ugc">Lyrics</a> 🎵 Dive into the world of music with our templates for organizing song lyrics.</li>
<li><a href="https://clipboard.agency/demos/#meeting-notes" rel="nofollow ugc">Meeting Notes</a> 📅 Optimize your meetings with organized and effective meeting note templates.</li>
<li><a href="https://clipboard.agency/demos/#technical-code" rel="nofollow ugc">Technical Code</a> 💻 Manage and document code efficiently with our technical code templates.</li>
<li><a href="https://clipboard.agency/demos/#commands" rel="nofollow ugc">Commands</a> 💻 Streamline your workflow with templates for commonly used commands.</li>
<li><a href="https://clipboard.agency/demos/#legal-documents" rel="nofollow ugc">Legal Documents</a> 📜 Ensure legal compliance and clarity with our templates for various legal documents.</li>
<li><a href="https://clipboard.agency/demos/#quotes-from-books" rel="nofollow ugc">Quotes from Books</a> 📖 Discover and share impactful quotes from literature with our curated collection.</li>
<li><a href="https://clipboard.agency/demos/#to-do-lists" rel="nofollow ugc">To-Do Lists</a> 📋 Stay organized and focused on your tasks with our effective to-do list templates.</li>
<li><a href="https://clipboard.agency/demos/#personal-notes" rel="nofollow ugc">Personal Notes</a> 📖 Capture your thoughts and reflections with our templates for personal notes.</li>
<li><a href="https://clipboard.agency/demos/#educational-content" rel="nofollow ugc">Educational Content</a> 🎓 Enhance your learning experience with our templates for educational content.</li>
<li><a href="https://clipboard.agency/demos/#passwords-and-codes" rel="nofollow ugc">Passwords and Codes</a> 🔒 Ensure security and manage your passwords and codes effectively with our templates.</li>
<li><a href="https://clipboard.agency/demos/#social-media-hashtags-" rel="nofollow ugc">Social Media Hashtags </a> ️⃣ Boost your social media visibility with effective hashtag usage using our templates.</li>
<li><a href="https://clipboard.agency/demos/#research-findings" rel="nofollow ugc">Research Findings</a> 📊 Organize and present your research findings professionally with our templates.</li>
<li><a href="https://clipboard.agency/demos/#travel-packing-list" rel="nofollow ugc">Travel Packing List</a> 🧳 Prepare for your travels efficiently with our comprehensive packing list templates.</li>
<li><a href="https://clipboard.agency/demos/#love-messages" rel="nofollow ugc">Love Messages</a> 💖 Express your feelings with heartfelt love messages using our templates.</li>
</ul>
<h3>How to Use with Elementor Widgets?</h3>
<ul>
<li>Step 1 – “Install and activate the “Elementor” plugin</li>
<li>Step 2 – Go to “Add/Edit with Elementor”</li>
<li>Step 3 – Search for widget. E.g. “Copy”</li>
<li>Step 4 – Drag and drop the widget to the page</li>
<li>Step 5 – Set the content</li>
<li>Step 6 – Publish the page and see the copy button</li>
</ul>
For more details read:
<ul>
<li><a href="https://clipboard.agency/#demos" rel="nofollow ugc">See All Live Demos</a></li>
</ul>
<h3>Key Benefits</h3>
<ul>
<li>Copy with Ease: Say goodbye to highlighting, right-clicking, and copying. Our plugin simplifies the process. 🎉</li>
<li>Versatile Solutions: Copy text, links, codes, and more with just a click. 🌐</li>
<li>Seamless Integration: Works with your existing WordPress site, no hassle. 💼</li>
<li>Efficient and User-Friendly: Save time and frustration when sharing content. ⏱️</li>
<li>Cross-Browser Compatibility: Enjoy consistent performance across all major browsers. 🌐</li>
<li>Mobile-Friendly: Works on all mobile devices, including tablets and smartphones. 📱</li>
<li>Lightweight: Our plugin won’t slow down your site. 🚀</li>
<li>Easy to Customize (PRO): Customize the look and feel of your copy button. 🎨</li>
<li>Developer-Friendly: Our plugin is easy to integrate with your existing code. 👨‍💻</li>
<li>SEO-Friendly: Our plugin won’t affect your SEO. 📈</li>
</ul>
Get up to 20% to 30% discount by <a href="https://clipboard.agency/#pricing" rel="nofollow ugc">upgrading to pro</a>, make this shopping extravaganza unforgettable! 🎁
<h3>Popular Copy to Clipboard Plugin</h3>
Over 10,000+ active installations are empowering their websites with “Copy Anything to Clipboard” – 100% compatible with all WordPress themes and plugins.
Feature Requests Welcome
If you have any suggestions or feature requests, please don’t hesitate to <a href="https://clipboard.agency/contact/" rel="nofollow ugc">contact us</a>.
<h3>Bug Reports</h3>
Bug reports for “Copy Anything to Clipboard” are welcomed in the WordPress <a href="https://wordpress.org/support/plugin/copy-the-code/" rel="ugc">support forum</a>.
<h3>Google Chrome Extension 🚀</h3>
We have also developed the Google Chrome extension for the Copy Anything to Clipboard plugin. You can download it from the Chrome Web Store.
<ul>
<li><a href="https://chromewebstore.google.com/detail/copy-anything-to-clipboar/mdljigkhfeiobmhanibkgjkldnabeahl?hl=en" rel="nofollow ugc">Copy Anything to Clipboard – Google Chrome Extension</a></li>
</ul>
<h3>Further reading 📚</h3>
For more info check out the following:
<ul>
<li>The <a href="https://clipboard.agency/" rel="nofollow ugc">clipboard.agency</a> official website 📌</li>
<li>The <a href="https://clipboard.agency/contact/" rel="nofollow ugc">Contact us</a> 👋</li>
<li>The <a href="https://clipboard.agency/doc/" rel="nofollow ugc">Getting started guide</a> 📃</li>
<li>All other my <a href="https://wordpress.org/plugins/search/clipboardagency/" rel="ugc">WordPress plugins</a> 💎</li>
<li>Contribute with plugin <a href="https://clipboard.agency/contact/" rel="nofollow ugc">contact us</a> ✨</li>
<li>Make a <a href="https://www.paypal.me/mwaghmare7/" rel="nofollow ugc">small donation</a> for continue FREE support 💪</li>
</ul>

Copy Anything to Clipboard

It is recommended to change the function shortcode_markup() in class-copy-the-code-shortcode.php

text & copied-text becomes a localized string to allow users to customize the default translation in the [copy] shortcode

'text' => __('Copy','copy-the-code'),
'copied-text' => __('Copied!','copy-the-code'),

In addition, it is also recommended to provide an interface for users to customize the style of [copy] (do not let for users to CSS to process)

My advice

Simple plugin, I use it on a couple of my blogs

thank you and keep up the great work Mahesh 🙌

Simple and works out of the box!

Error, incompatibility with elementor. This plugin will automatically convert characters

https://imgur.com/ZGdN2de

Error, incompatibility with elementor.

Copy Anything to Clipboard is the #1 WordPress plugin with 292,694+ downloads 🚀

Carmo Copy to Clipboard vs Copy Anything to Clipboard