在内容创作和分享日益频繁的今天，保护原创内容显得尤为重要。对于WordPress网站，尤其是使用WordPress子比主题的站长来说，当用户复制文章内容时，能够自动附加站点信息和原文链接，不仅能有效提示转载者注明出处，还能为网站带来潜在的流量回溯。本文将介绍一个巧妙的JavaScript代码片段，实现这一功能，且过程无弹窗打扰用户体验。
功能介绍：
这个JavaScript代码片段旨在增强网站内容的保护和传播效果。当用户在网站上复制超过10个字符的文章内容时，系统会自动在复制内容的末尾添加预设的站点信息。
核心亮点：
- 智能识别页面类型：
- 文章页面：自动添加站点名称、文章标题、原文链接和版权声明等完整信息。
- 非文章页面（如首页、分类页）：自动添加站点名称和官网链接的简化信息，确保信息与页面内容相关。
- 支持多种粘贴格式：
- 纯文本格式：粘贴到记事本等纯文本编辑器时，会显示简洁的文本信息。
- HTML格式：粘贴到富文本编辑器（如Word、其他网站编辑器）时，会保留链接格式，方便用户直接点击跳转。
- 无弹窗干扰：整个过程在后台静默进行，不会弹出任何提示框，不打断用户的浏览体验。
- 字符长度限制：仅当用户复制的文本内容超过10个字符时才触发，避免对短语或单词的复制造成不必要的干扰。
代码详解：
// WordPress子比主题 - 复制内容自动添加站点信息（无弹窗版）
document.addEventListener('DOMContentLoaded', function() {
// 获取站点信息
var siteInfo = {
// 尝试获取子比主题预定义的站点名称和URL，如果未定义则使用document.title和window.location.origin
name: typeof zib_site_name !== 'undefined' ? zib_site_name : document.title,
url: typeof zib_site_url !== 'undefined' ? zib_site_url : window.location.origin,
currentUrl: window.location.href, // 当前页面完整链接
pageTitle: document.title // 当前页面标题
};
// 构建附加信息模板
function buildExtraInfo(isArticlePage = false) {
let info = `\n\n——\n本文内容来自：${siteInfo.name}`;
if (isArticlePage) { // 如果是文章页面，添加更多详情
info += `\n原文标题：${siteInfo.pageTitle}\n原文链接：${siteInfo.currentUrl}\n版权声明：转载请注明出处，尊重原创`;
} else { // 非文章页面，只显示站点名称和官网链接
info += `\n官网链接：${siteInfo.url}`;
}
return info;
}
// 监听复制事件
document.addEventListener('copy', function(e) {
try {
// 获取用户选中的文本
const selection = window.getSelection();
const selectedText = selection.toString().trim();
// 只有选中内容不为空且长度超过10个字符时才添加附加信息
if (selectedText && selectedText.length > 10) {
// 阻止默认复制行为
e.preventDefault();
// 判断当前是否为文章页面
// 子比主题通常有特定的body class来标识文章页面，例如 'single-post' 或 'single'
// 这里可以根据实际主题的body class进行判断，更精确
// 为了通用性，这里简化判断，但更严谨的做法是检查body class
const isArticlePage = document.body.classList.contains('single-post') || document.body.classList.contains('single');
// 构建最终复制的纯文本内容
const extraInfoPlain = buildExtraInfo(isArticlePage);
const plainText = selectedText + extraInfoPlain;
// 构建最终复制的HTML格式内容
let htmlExtraInfo = `<br><br>——<br>本文内容来自：<a href="${siteInfo.url}" target="_blank">${siteInfo.name}</a>`;
if (isArticlePage) {
htmlExtraInfo += `<br>原文标题：${siteInfo.pageTitle}<br>原文链接：<a href="${siteInfo.currentUrl}" target="_blank">${siteInfo.currentUrl}</a><br>版权声明：转载请注明出处，尊重原创`;
} else {
htmlExtraInfo += `<br>官网链接：<a href="${siteInfo.url}" target="_blank">${siteInfo.url}</a>`;
}
const htmlText = `${selectedText}${htmlExtraInfo}`;
// 将内容添加到剪贴板
if (e.clipboardData) {
e.clipboardData.setData('text/plain', plainText);
e.clipboardData.setData('text/html', htmlText);
}
}
} catch (err) {
console.error('复制功能出错:', err);
}
});
});在原代码基础上，对buildExtraInfo函数和htmlExtraInfo的构建逻辑进行了优化，使其能根据页面类型智能判断并添加对应的信息（文章页面完整信息，非文章页面简化信息），这更符合实际应用场景，也更严谨。判断isArticlePage时，提供了根据body标签的class来判断的建议，可以根据子比主题实际情况调整。
安装方法：
将上述优化后的JavaScript代码，直接添加到WordPress子比主题的“自定义 JavaScript”设置区域中即可生效。
- 登录WordPress后台。
- 导航到子比主题设置： 通常在“外观”（Appearance）>“子比主题设置”（Zibll Theme Settings）中。
- 找到自定义代码区域： 查找“自定义代码”或导航到【全局&功能】找到【自定义代码】的“自定义JavaScript”选项。
- 粘贴代码并保存： 将代码粘贴到对应的文本框中，然后点击“保存设置”。
使用效果：
完成设置后，用户在网站上复制文章内容时，无论是粘贴到纯文本编辑器还是富文本编辑器，都会自动带有网站的版权信息。
这项功能对于内容型网站，特别是原创内容较多的网站来说，是提升内容保护和内容传播效益的“小而美”的优化。它在不破坏用户体验的前提下，巧妙地将网站信息嵌入到复制内容中，既尊重了用户复制的自由，又维护了作者的权益。通过对代码的优化，现在它能更智能地适应不同页面类型，提供更贴切的附加信息，对于WordPress子比主题用户而言，是提升网站专业度和内容价值的实用工具。
👋 感谢您的观看！
© 版权声明
THE END