Automatic Source Attribution for Copied Article on Blogger

Posted by Yanuar Zhaldy Gemilang Addson at February 28, 2025

0

"Auto add source attribution script when user trying to copy paste your article content."

Details

This script automatically adds a source attribution when users copy text from your webpage. It limits the copied text to 200 characters (customizable) for brevity and appends a thank-you message with the page's URL. Using the modern Clipboard API, it ensures the modified content is added to the clipboard seamlessly. This encourages ethical content sharing while keeping the copied text concise and user-friendly.

Code

JavaScript

document.addEventListener("copy", async (event) => {
  const selection = window.getSelection();
  if (!selection || selection.rangeCount === 0) return;
  let selectedText = selection.toString().trim();
  if (!selectedText) return;
  const maxText = 200;
  if (selectedText.length > maxText) {
    selectedText = selectedText.substring(0, maxText) + "...";
  }
  const pageUrl = window.location.href;
  const attrSrc = `\n\nSource: ${pageUrl}\nThank you for including the source citation.`;
  const modifiedContent = selectedText + attrSrc;
  try {
    await navigator.clipboard.writeText(modifiedContent);
  } catch (error) {
    console.error("cant copy attribution:", error);
  }
});