博客美化和优化过程记录及实用技巧【持续更新】

博客美化和优化过程记录及实用技巧【持续更新】

小天
2021-12-17 / 1 评论 / 639 阅读 / 搜一下 / 正在检测是否收录...


博客美化优化

安装好系统后,小天能想到的第一个优化的就是速度,“君欲善其事,必先利其器”嘛。

  1. 速度在CDN方面的优化,小天就不多赘述了,可以参考我的另一篇文章 《真正的Typecho非插件实现全站css,js,图片静态资源CDN加速 !阿里、腾讯、七牛、又拍云等通用!》
  2. 除了做好CDN,其次就是缓存了,这里小天是直接安装的Tpcache缓存插件,采用Redis缓存驱动
    PS:小天已经关闭了该插件,启用插件后,会出现评论提交报错等系列问题。
  3. 关于头像的优化,Joe主题采用的头像源是gravatar,小天更换为了 dn-qiniu-avatar.qbox.me 七牛云的加速头像源。
  4. 小方面就是主题设置,关闭一些不必要的功能:鼠标特效、2D人物模型、炫酷的动画等等吧

seo方面小天也是小白,知之甚少。

  1. 开启SiteMap功能
  2. 做好Robots.txt
  3. 维护好站长平台
  4. 给网站博客侧边栏加一个请协助SEO优化

添加文章搜一下功能:Joe主题找到usr/themes/Joe/public下的batten.php 30行左右,插入如下代码,其他主题同理。

<span class="text">
  <a href="https://www.baidu.com/s?wd=<?php $this->title() ?>+site:www.xtboke.com" target="_blank">搜一下</a></span>
<span class="line">/</span>


Joe主题自带的列表缩略图是随机40张图片,感觉不是小天要的风格;所以小天自己找了一些美图,放到了static静态文件夹里,同时也镜像到了七牛云,剩下的就是修改了。
找到 theme/Joe/core/function.php 的232行

$result[] = 'https://cdn.jsdelivr.net/npm/typecho-joe-next@6.0.0/assets/thumb/' . rand(1, 42) . '.jpg';

替换为:

$result[] = __TYPECHO_CDN_DIR__ . 'static/images/thumb/' . rand(1, 201) . '.jpg';

TYPECHO_CDN_DIR 是在Typecho主目录下的config.inc.php里定义的CDN目录,这里可以看我上面提到的那篇文章;
这里为什么我没有直接写CDN域名呢?是因为方便切换回本地域名,切换时,只需要记得更改__TYPECHO_CDN_DIR__的值就可以了。


可以看到小天博客底部页面的一些样式和功能

样式的实现:可以去【 shields.io 】网站去自定义,种类很多,像ICP、版权信息等等。
功能的实现:找到usr/themes/Joe/public目录下的footer.php第47行,加入以下代码

document.getElementById('pagetimes').innerHTML = '<img src="https://img.shields.io/badge/页面加载耗时:-<?php _endCountTime(); ?>-green">';

_endCountTime()是获取页面耗时的函数;
pagetimes是前台标签的ID值,放到前台你想显示的位置即可。

<a href="javascript:(0)" id="pagetimes"></a>


关于Joe主题7.3.6直播列表未找到数据的优化
关于Joe主题7.3.6侧边栏最新回复显示数量失效的优化
非插件typecho给博客加个评论等级-仿虎牙直播贵族
给你网站博客的评论添加一键打卡功能
一行CSS代码给网站博客添加灰色默哀色
一行CSS代码给网站文本文字添加颜色动态变化

未完 待续

14

评论 (1)

打卡
取消
  1. 头像
    ♙LV.1 小鱼
    Windows 10 · QQ Browser

    666

    回复