typechon美化（主题通用）

2024/1/13 未来与梦未标记字数：1.6k | 阅读时长：6 分钟

前言奶糖一开始其实是想凭借自己的力量去独立写出属于自己的主题，但是嘛… 事与愿违嘛，因为学业以及奶糖的学习能力比较差之类的，自己写主题的目标显得有些遥远（之前所说的开始学习还在继续啦，只不过内容太多，如果写出来就太长了）。所以奶糖决定对于自己所用的主题进行魔改。（本主题取自季悠然大佬的G主题）那么话不多说，开始吧d(￣▽￣)b 正文因为奶…

前言

奶糖一开始其实是想凭借自己的力量去独立写出属于自己的主题，但是嘛…
事与愿违嘛，因为学业以及奶糖的学习能力比较差之类的，自己写主题的目标显得有些遥远（之前所说的开始学习还在继续啦，只不过内容太多，如果写出来就太长了）。所以奶糖决定对于自己所用的主题进行魔改。（本主题取自季悠然大佬的G主题）
那么话不多说，开始吧~d=====(￣▽￣*)b

正文

因为奶糖只添加了自己喜欢的（原意也没要做太多做成教程啦，请见谅！！！）
操作前必看！！！！！！,请备份好所修改的文件！！！！（很重要）
当然，如果忘记备份的话也不是没办法，重新下载原版或主题文件，在文件中找到改错的文件即可
（温馨提示，更改文化时记得规划好格式，适当的文件注释，以及引用文件时的大小写！！！）

[collapse title=”网站运行时间”]
将下方代码加入文件footer.php中的合适位置（推荐在页面底部）
注：1.为原版主题的话文件位置是根目录/wwwroot/admin/footer.php
2.如果是不同主题位置为根目录 /wwwroot/usr/ themes/（主题名）/（自行寻找footer.php文件）

```php

```
具体位置视情况而定，奶糖则是放在了尾部的标签上（字体颜色等会随当前板块的css变化）
时间演示
[/collapse]

[collapse title=”‘调皮’的标题”]
用于修改网站所显示的标题（不同状态下）
理论上加入文章的任意在使用的.php文件就行/wwwroot/admin（有主题则在是主题内的.php文件/wwwroot/usr/ themes/（主题名）/（自行寻找.php文件））

```php

![实例1][3]![实例2][4]

[/collapse]

----------

[collapse title="鼠标美化"]
！！！温馨提示，由于大部分浏览器或电脑默认了鼠标类型，所以d大部分设备其实改不了
找到style.css（原版在/wwwroot/admin/css，有主题的在/wwwroot/usr/ themes/（主题名）/（自行寻找style.css文件））在其中加入以下代码

    ```css
body {
    cursor:url('填入鼠标样式地址通常为.cur'), auto;
}
select, input, textarea, a, button {
    cursor:url('填入鼠标样式地址通常为.cur'), auto;/* 遇到要点击时的 */

[/collapse]

[collapse title=”雾蒙蒙的背景”]
类似于给背景加入白色的膜…?
同样是修改style.css文件（寻找方法见“鼠标美化”），加入以下代码

```css

body::before {
z-index: -1;
content: “”;
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 0.1;
position: fixed;
background: center/cover no-repeat;
background-image: url(这里填入背景图片的链接~);
}


[/collapse]

----------

[collapse title="一言————随机名句"]
演示见文章顶部~
将以下代码放置在 header.php中<head></head>内，
无主题位置/wwwroot/admin/header.php
有主题位置/wwwroot/usr/themes/（主题名)/(自行寻找header.php文件)

    ```php
<link rel="stylesheet" type="text/css" href="https://www.whbblog.cn/css/yiyan.css">

这里是引入了外链，也可以复制进本地，就是..奶糖不知道为什么复制进本地css会丢失qwq
然后再将下方代码加入post.php文件中
无主题/wwwroot/admin/post.php
有主题/wwwroot/usr/themes/（主题名)/(自行寻找post.php文件)

```php

(这里可以修改在等待获取时显示的文字)

``` 一般可以加入在最上边（见奶糖的文章显示）

[/collapse]

[collapse title=”侧边栏天气”]
使得侧边栏有天气显示
将下方代码加入sidebar.php文件
无主题/wwwroot/admin/sidebar.php
有主题/wwwroot/usr/themes/（主题名)/(自行寻找sidebar.php文件)

```php

``` 这里宽度高度不建议更改！ ![天气][5] [/collapse]

[collapse title=”阅读进度条~”]
在header.php文件中加入下方代码
无主题/wwwroot/admin/header.php
有主题/wwwroot/usr/themes/（主题名)/(自行寻找header.php文件)

```php

然后找到style.css（原版在/wwwroot/admin/css，有主题的在/wwwroot/usr/ themes/（主题名）/（自行寻找style.css文件））在其中加入以下代码

    ```css
#content_progress {
      /* Positioning */
      position: fixed;
      left: 0px;
      top: 50px;
      z-index: 188;
      width: 100%;
      height: 2px;/*上下的高度，建议适度调高一点*/
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border: none;
      background-color: transparent;
      color: #BABABA;
}

#content_progress::-webkit-progress-bar {
      background-color: transparent;
}

#content_progress::-webkit-progress-value {
      background-color: #B8B8B8;/*这里修改颜色！！！*/
}

#content_progress::-moz-progress-bar {
      background-color: #BF3EFF;
}

演示见本文章页面顶部

[/collapse]

总结

算是整理了一些奶糖自认为有用的美化
qwq这里赞扬一下G主题，把css和js的添加直接整合到了typecho的外观编辑中，很实用欸！

参考

木木：https://www.whbblog.cn/
氢云：https://www.qybk.cc/archives/68/

LOADING

typechon美化（主题通用）

前言

正文

总结

参考