当前位置:首页技术分享WordPress网站B2主题美化之代码高亮+一键复制
!
也想出现在这里? 联系我们
信息

WordPress网站B2主题美化之代码高亮+一键复制

今天跟大家分享一下“WordPress网站7B2主题美化之代码高亮+一键复制”版,其他主题需自行调整使用

WordPress网站B2主题美化之代码高亮+一键复制

1.代码一键复制功能代码-child.js文件

//文章页面高亮代码复制粘贴-
for (var i = 0; i < $(".prettyprint").length; i++) {
    $(".prettyprint").eq(i).append('<span class="copy" data-clipboard-target="#copy'+ i +'">一键复制</span>');
    $(".prettyprint").eq(i).attr('id','copy'+ i);
}
var clipboard = new ClipboardJS('.copy');
clipboard.on('success', function(e) {
    //console.info(e.text); 提示
    e.clearSelection();
    e.trigger.innerHTML = "一键复制成功";
     e.trigger.disabled = true;
        setTimeout(function() {
            e.trigger.innerHTML = "一键复制";
            e.trigger.disabled = false;
        },
        2000);/**时长**/
});
//文章页面高亮代码复制粘贴

2.代码一键复制美化代码-style.css文件

/**代码高亮**/
.entry-content pre:before {
content: '';
position: absolute;
top: 0;
left: 25px;
width: 15px;
height: 15px;
border-radius: 50%;
margin: 15px 25px;
background: #fdbc40;
}
ol.linenums:after {
content: '';
position: absolute;
top: 0;
left: 50px;
width: 15px;
height: 15px;
border-radius: 50%;
margin: 15px 25px;
background: #35cd4b;
}.entry-content pre:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 15px;
height: 15px;
border-radius: 50%;
background: #fc625d;
margin: 15px 25px;
}.entry-content pre {
position: relative;
border-radius: 6px;
/**background: #21252b;**/
padding-top: 50px;
box-shadow: 0px 8px 20px -10px #000;
}.entry-content pre .copy {
position: absolute;
top: 0;
right: 0;
margin: 10px 20px;
cursor: pointer;
color: #8224e3;
}
/**代码高亮**/
温馨提示:

文章标题:WordPress网站B2主题美化之代码高亮+一键复制

文章链接:https://www.douzll.com/143.html

更新时间:2024年08月08日

豆子园(下文简称本站)提供的所有内容仅供学习、交流和分享用途,只供参考。 本站资源禁止并谢绝未经本站许可的使用,如若欲转载,请署名以及注明出处,请务必以文字链接的形式标明或保留文章原始出处和作者的信息。 本站(原创)文章、资源、图片等所有内容,一经转载,即表示您已经接受上述声明!需自行承担一切风险与责任! 关于本站的所有留言评论与转载、引用文纯属文字原作者个人观点,与本站观点及立场无关!

给TA打赏
共{{data.count}}人
人已打赏
技术分享

WordPress自定义全宽首页或页面模板

2024-7-30 18:00:18

技术分享

WordPress 给小工具添加一个动态时钟

2024-8-8 20:41:06

个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索