今天奇它论坛@老白跟大家分享一下“WordPress网站B2主题美化之代码高亮+一键复制”版,其他主题需自行调整使用
1.代码一键复制功能代码-child.js文件
(原文转载自https://www.sdklib.com/5771.html,感谢站长分享)
//文章页面高亮代码复制粘贴-https://www.qitabbs.com/26354.html 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);/**时长**/ }); //文章页面高亮代码复制粘贴-https://www.qitabbs.com/26354.html
2.代码一键复制美化代码-style.css文件
/**代码高亮-https://www.qitabbs.com/26354.html**/ .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; } /**代码高亮-https://www.qitabbs.com/26354.html**/
相关文章请点击文末标签阅读!