复制网站文章内容+弹窗提示+末尾自动添加版权信息

本教程适用于所有博客网站(除非你网站有复制弹窗了,可能会报错!),复制网站文章内容+弹窗提示+末尾自动添加版权信息主要是由jQuery(核心) + Layui.js(弹窗提示) + CSS(样式美化)设计而成,非常的优雅。

使用教程

如果你网站有了复制弹窗提示,请您关掉或者删掉(请备份,在进行删除代码)

文章内容复制弹窗提示

第一步:添加js文件

现在大部分主题都有主题设置,只需在后台的主题设置中“自定义头部HTML代码”或者“自定义底部HTML代码”中把下面的代码复制进去即可。

Layui.js主要是用来复制弹窗提示的,如果您的网站已经导入有这个layui.js的话,无需再次导入,把代码中调用的CDN-js删掉就好啦。

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/layui/2.6.8/layui.min.js"></script>
<script type="text/javascript">
/**复制自动添加版权声明*/
$(document).on("copy", function(e) {
  var selected = window.getSelection();
  var selectedText = selected.toString().replace(/\n/g, "<br>");
  var copyFooter =
      "<br>-----------------------<br>著作权归作者所有。<br>" +
      "商业转载请联系作者获得授权,非商业转载请注明出处。<br>" +
      "作者:长江社长<br> 源地址:" +
      document.location.href +
      "<br>来源:长江博客<br>© 版权声明:本文为博主原创文章,转载请务必保留原文链接!";
  if (document.location.pathname === "/") {
    var copyFooter =
        "<br>-----------------------<br>" +
        "来源:长江博客<br> 源地址:" +
        document.location.href +
        "<br>© 版权声明:商业转载请联系作者获得授权,非商业转载请注明出处。<br>";
  }
  var msgContent =
      '<span style="font-weight: 700;margin: 0 !important;">【长江博客(WWW.73BK.COM)】<br>复制成功,若要转载请务必保留原文链接</span>' + copyFooter;
  layer.msg(msgContent, {
    time: 2000,
    shift: 2,
    shade: 0.3,
    skin: "wiiuii-layer-mode"
  });
  var copyHolder = $("<div>", {
    id: "temp",
    html: selectedText + copyFooter,
    style: {
      position: "absolute",
      left: "-99999px"
    }
  });
  $("body").append(copyHolder);
  selected.selectAllChildren(copyHolder[0]);
  window.setTimeout(function() {
    copyHolder.remove();
  }, 0);
});
</script>

注:自己修改代码中【文字部分】成自己的即可!

第二步:添加CSS代码

CSS代码是弹窗提示样式,在主题设置-自定义CSS样式中复制添加进去就好啦!

本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负!
© 版权声明
THE END
喜欢就支持一下吧
点赞15 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容