Typecho实现复制后弹窗提示保留原文链接

当浏览部分博客时，复制内容时会弹窗提示保留原文链接。对于访问量大的博客，这也是一个非常不错的功能，但是对于我这个的小博客，实现这个功能主要是为了装比。

Layer 组件

实现此功能，需要用到Layer web弹层组件

Layer 是一款近年来备受青睐的web弹层组件，她具备全方位的解决方案，致力于服务各水平段的开发人员，您的页面会轻松地拥有丰富友好的操作体验。

首先到Layer 官网下载，或者直接点击下方的下载按钮

uud.me-layer-1

下载后得到的是一个layer-v3.1.1.zip 压缩包，解压后目录结构如下：

uud.me-layer-2

需要用的是layer-v3.1.1/layer里的内容：

uud.me-layer-3

将整个layer文件夹上传到Typecho 主题文件下的 assets/js目录下，上传后的目录结构如下：

uud.me-layer-4

首先，需要在主题目录下的header.php文件里的/head前加入以下代码：

<script src="/usr/themes/handsome/assets/js/layer/layer.js"></script>

不同的主题，具体路径有所不同，需要你将上面代码中的handsome 换为你的主题名称

然后在主题设置 - 开发者设置 - 自定义JavaScript 中插入代码：

document.body.oncopy = function() {layer.msg('复制成功,若要转载请务必保留原文链接！', function(){
   });};

一般主题都会有这个设置，如果没有，你也可以手动到主题目录下的footer.php加入以下代码：

<script type="text/javascript">
document.body.oncopy = function() {layer.msg('复制成功,若要转载请务必保留原文链接！', function(){
   });};
</script>

保存即可。

点击下方按钮：

可以配合上一篇博文，实现点击自动复制，然后弹窗提示

Typecho实现点击文本自动复制到剪贴板

版权属于：余十一
本文链接：https://www.uud.me/site-notes/layer-js.html
转载时须注明出处及本声明