子比主题美化 – 复制弹出提示框

效果图

教程开始

复制下面代码 放入zibll文件夹目录中的functions.php或func.php中，路径自行替换即可

function vue_style(){?>
    <script src="vue.min.js文件路径"></script>
    <script src="index.js文件路径"></script>
    <link rel="stylesheet" href="index.css文件路径">
<?php }add_action('wp_head', 'vue_style');

复制下面代码 放入zibll子比主题设置-全局-自定义代码-自定义JavaScript即可

document.addEventListener("copy", function (e) {
    const selection = window.getSelection ? window.getSelection() : document.selection.createRange().text;
    const target = e.target;

    if (target.closest('.article-content') && selection.toString() !== '') {
        new Vue({
            data: function () {
                this.$notify({
                    title: "叮！复制成功",
                    message: "若要转载请务必保留原文链接！谢谢~",
                    position: 'bottom-right',
                    offset: 50,
                    showClose: true,
                    type: "success"
                });
                return { visible: false };
            }
        });
    } else if (selection.toString() === '') {
        new Vue({
            data: function () {
                this.$notify({
                    title: "咦？复制失败",
                    message: "啊噢...你没还没选择内容呢！",
                    position: 'bottom-right',
                    offset: 50,
                    showClose: true,
                    type: "success"
                });
                return { visible: false };
            }
        });
    }
});