hexo笔记十四：next主题添加代码块一键复制功能

在next6.3的版本中，直接在主题配置文件的相应位置设置为true即可。

本文在next5.1.4的版本上进行操作。

1 在themes/next/layout/_third-party/下新建文件copy-code.swig，写入下面的内容：

{
   % if theme.codeblock.copy_button.enable %}
  <style>
    .copy-btn {
   
      display: inline-block;
      padding: 6px 12px;
      font-size: 13px;
      font-weight: 700;
      line-height: 20px;
      color: #333;
      white-space: nowrap;
      vertical-align: middle;
      cursor: pointer;
      background-color: #eee;
      background-image: linear-gradient(#fcfcfc, #eee);
      border: 1px solid #d5d5d5;
      border-radius: 3px;
      user-select: none;
      outline: 0;
    }

    .highlight-wrap .copy-btn {
   
      transition: opacity .3s ease-in-out;
      opacity: 0;
      padding: 2px 6px;
      position: absolute;
      right: 4px;
      top: 8px;
    }

    .highlight-wrap:hover .copy-btn,
    .highlight-wrap .copy-btn:focus {
   
      opacity: 1
    }<