【网站维护】一些简单满意的调整

闲来无事，在家看着视频逛着博客，看到很多博客分享代码的时候代码高亮的样式都很不错，想起来自己还没弄呢。

代码高亮

就随便找了一个 prism.js ，选了一些常用的语言，css+js一共约34kb。想找个js库的cdn来着，没找到合适的，所以决定就这样用吧。将下载的两个文件放入对应的目录，就可以引用了，下面给新手一个引用的简单指引：

<!DOCTYPE html>
<html>
<head>
    ...
    <link href="css/prism.css" rel="stylesheet" />
</head>
<body>
    ...
    <script src="js/prism.js"></script>
</body>
</html>

以上就是引用的方法和效果展示🙂。

页面上需要下面的代码，才会被高亮。

<pre><code class="language-css">p { color: red }</code></pre>

markdown编辑器Typora只需要在编辑代码的时候选择语言就没有问题。其它编辑器环境没有测试。

VPS内存占用过高

最近VPS出现很多次内存占用高的情况，前次通过修改Nginx的配置得以解决，最近一次直接内存超高服务器卡死了。不得不重启后查看内存占用情况，我使用的内存占用查看方法，Xshell连上VPS：

yum install htop -y && htop

经过观察是MySQL占用比较高导致的，Google了一下配置方法，做了一些调整并观察了一段时间，基本解决问题。不同的环境配置不一定一样所以这里就不分享配置参数了，有需要的可以Google相关。

制作加载评论按钮

代码高亮也做了，反正是折腾，于是顺便给首页添加一个加载评论按钮。

半路出家的选手，玩代码水平差的自己都看不下去，制作过程一波三折总是不完美。最后看到底部的友情链接样式于是就直接拿来修改了😭

css

.anniu li {
  float: left
}

.anniu li a {
  background: SeaGreen;
  border: 1px solid SeaGreen;
  display: block;
  text-align: center;
  margin-left: 15px;
  margin-bottom: 5px;
  padding: 0 4px;
  border-radius: 2px;
  width: 300px;
  color: #fff;
  line-height: 35px;
  white-space: nowrap;
  overflow: hidden;
  text-decoration: none;
  font-size: 14px
}

.anniu li a:hover {
  color: #fff;
  background: LightPink;
  border: 1px solid LightPink;
}

页面引入

<div align="center">
    <table border="0" align="center">
      <tr>
        <td>
          <ul style="padding: 12px 13px 10px 0px;list-style-type:none;" class="anniu">
            <li>
                <b>
                    <a href="{{ .Permalink }}#comment" style="font-family:Microsoft YaHei; serif;">加 载 评 论</a>
                </b>
            </li>
          </ul>
        </td>
      </tr>
    </table>
  </div>

仅供参考，不保证任何环境都能完美实现。

本来width准备设置到700px的，想法是越宽越能方便用户点击，发现手机端不合适，于是设置了300px，有问题欢迎报错和交流😏

调整页脚友情链接样式

以上按钮比较满意，那就再顺手把友情链接表格样式一起调整一下，去掉了超链接的下划线，通过修改表格背景和边框颜色实现了无边框😭，没办法，弱鸡只会这么玩哈哈。欢迎交换首页链接，要求必须首页，必须是页脚位置且醒目😏，网站类型原则上不限制，但看我心情🐶。有专用的内页博客友链，对于首页友链符合要求的可以申请首页友链。最后再说一句，欢迎随便交换友情链接😁