Streamline Copy and Share Actions with The CopyShareify Plugin
| File Size: | 38.2 KB |
|---|---|
| Views Total: | 359 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
CopyShareify is a tiny yet useful jQuery plugin that adds customizable copy and share functionality to buttons on your website. With just a few lines of code, you can empower users to instantly copy and distribute your content.
Features:
- Copy any content (text, images, input values) to the clipboard.
- Share any content on the page using the Web Share API.
- Define different copy and share actions per button.
- Configure options via HTML data attributes.
How to use it:
1. To use the plugin, download and include the copyshareify.min.js script after jQuery library.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/dist/copyshareify.min.js"></script>
2. Initialize the plugin on document ready.
$(function(){
$('[data-action]').CopyShareify();
});
3. Enable a button to copy the text defined in the data-string attribute.
<button data-action="copy" data-string="Text To Copy"> Click To Copy </button>
4. Enable a button to copy the text in an HTML element.
<p id="copy"> Text To Copy </p> <button data-action="copy" data-html-element-selector="#copy"> Click To Copy </button>
5. Enable a button to copy an image within the document.
<img id="img" src="copy.png"> <button data-action="copy" data-html-img-selector="#img"> Click To Copy </button>
6. Enable a button to share any content using the Web Share API.
<button data-action="share" data-title="jQueryScript" data-description="A jQuery Website!" data-string="https://www.jqueryscript.net"> Share Link </button>
7. You can also integrate the Copy or Share functionality into buttons using JavaScript as follows:
$('#myButton').CopyShareify({
action: null, // 'copy', or 'share'
string: null,
htmlInputSelector: null,
htmlElementSelector: null,
htmlImgSelector: null,
title: null,
description: null,
onActionDone : function () {},
onActionFailed : function (error) {},
});
Changelog:
2023-07-25
- Bugfixes
2023-07-19
- Bugfix
This awesome jQuery plugin is developed by HichemTab-tech. For more Advanced Usages, please check the demo page or visit the official website.










