博客折腾美化过程全记录及实用技巧

2017年11月18日00:42:40 38 16.9K 10439字阅读34分47秒

博客折腾美化过程全记录及实用技巧

知更鸟Begin主题,从开始建站就在使用 博客折腾美化过程全记录及实用技巧 。不过那时候用的还是破解版。因为一开始建站,作为一名小菜虫,什么都不懂,就从破解版下了手。其实,到现在,也还是一事无成,没整明白 博客折腾美化过程全记录及实用技巧 。随着建站的深入与细化,就换成正版主题,也是对“鸟哥”的一种支持。这个主题一直在更新,很多朋友都在使用这个主题。期间,星光站长也尝试换用了其他版本的各类Wordpress主题。这类主题的突出点就是主题特点鲜明,极具观赏感。相比之下,Begin主题就显得有点平淡了,暗灰色系一撸到底 博客折腾美化过程全记录及实用技巧 。但是,这类主题的功能有点差强人意,体验后感觉不是那么很爽。最后,换来换去,还是又回到了知更鸟主题,毕竟咱是正统之版。站长是一个强迫症与完美主义患者,回到知更鸟后就开始了美化与扒代码的折腾之旅,并始终牢记毛爷爷的“自己动手,丰衣足食”。向被我扒过的各位站长一并表示感谢 博客折腾美化过程全记录及实用技巧 。从他们那里学到了好多细节的美化与修改。在此,分享给像我一样的小白们使用。

博客折腾美化过程全记录及实用技巧

1、网站空间与域名之折腾

展开

昨天,阿里云域名、独享虚拟主机备案成功。我是首次备案用了18天,都说山东备案速度慢,自我感觉是还能接受吧。其实,备案挺简单的,一路下来按照要求填写就可以了。我是从一开始的黑群晖NAS自建服务器,因443端口被封而转战到老薛香港主机,再到后来的阿里云独享虚拟主机,小白一路摸索而来,感慨颇多,网站前前后后重做了好多次,自己都记不清次数了。首先,自建服务器,用着不错,存储空间够大,可惜使用了不足半月,因为“19d”的召开,443被运营商给封锁了。没办法,网站建设正在开始阶段,兴头之上呢,急速之下,转战到了老薛主机。我选择的是“香港2号”主机,因为自己优化不够,总感觉有点“卡”。一怒之下,直接购买了阿里云的“独享虚拟主机”,就开始了漫长的等待中。好在在预期之中完成了备案,剩下的就是欢快的建站路程了。有时间再写点,太困了,睡觉去。。。

其余记录,在“发展历程”中有详细说明。

2、关于本站四个联系图标美化

效果及操作步骤,请查看:知更鸟主题“关于本站–微信、QQ、微博、订阅”四个图标美化

3、关于本站头像居中添加背景美化

效果及操作步骤,请查看:知更鸟主题“关于本站”小工具头像的居中布局美化

4、头部显示日期与问候语

效果及操作步骤,请查看:WordPress顶部显示问候语和日期的完美解决方法

5、为评论框添加背景图片

效果及操作步骤,请查看:让评论框不再单调,为评论框添加背景图片

6、热门标签固定与凌乱显示

效果及操作步骤,请查看:WordPress修改右侧边栏彩色标签为固定显示

7、使用阿里云图标方法

效果及操作步骤,请查看:WordPress知更鸟主题使用阿里云图标方法

8、面包屑导航栏美化

效果及操作步骤,请查看:知更鸟begin主题面包屑导航栏美化

9、自定义鼠标指针样式

效果及操作步骤,请查看:WordPress博客自定义鼠标指针样式

10、评论前三名“沙发 板凳 地板”添加背景色

效果及操作步骤,请查看:美化评论“沙发 板凳 地板”添加背景色

11、文章中插入表情图

效果及操作步骤,请查看:WordPress在文章中插入表情图,实现丰富多彩效果

12、文章中增加彩色边框

效果及操作步骤,请查看:WordPress文章编辑器增加彩色边框代码

13、页脚添加查询耗时自定语

效果及操作步骤,请查看:知更鸟主题页脚添加查询耗时及自定语代码

14、后台登陆失败邮件提醒

效果及操作步骤,请查看:WordPress登陆失败自动发送邮件提醒

15、有新评论微信提醒管理员

效果及操作步骤,请查看:WordPress有新评论微信提醒管理员

16、侧边栏显示自定义滚动问候语

效果及操作步骤,请查看:一段自定义滚动显示问候语代码

17、后台登录页面添加运算验证码

效果及操作步骤,请查看:为你的博客用户登录页面添加十以内运算验证码

18、折叠时光轴记录网站发展

效果及操作步骤,请查看:使用折叠功能的时光轴记录网站发展历程

19、网站优化之Robots.txt优化

效果及操作步骤,请查看:利用Robots.txt优化你的WordPress站点

20、虚拟主机无法发送邮件解决办法

效果及操作步骤,请查看:WordPress使用阿里云主机无法发送邮件问题的解决办法

21、顶部导航菜单两种美化方法

效果如图:博客折腾美化过程全记录及实用技巧

展开

第一种,整体渐变背景色:打开Style.css,查找 #top-header(最新版主题是 #header-top),将背景色 background:#e7e7e7; 修改为

background:linear-gradient(-30deg,rgba(255, 213, 60, 0.71) 10%,rgba(161, 230, 243, 0.78)) no-repeat;

第二种,导航菜单背景颜色交替:第一步,先把css样式添加到外观→自定义→额外css里面,样式如下

  1. .mcnmq{background:#b485e2;color:#fff;padding:2px 8px;border-radius:2px}.mcnmw{background:#74d62f;color:#fff;padding:2px 8px;border-radius:2px}

第二步,在把调用代码到你想要添加的地方,如顶部导航菜单→菜单结构→导航标签里面。

  1. <span class="mcnmq"> 导航 </span>
  1. <span class="mcnmw"> 导航 </span>

注意:mcnmq”和“mcnmw”要隔开用,否则出来的菜单效果就是一个颜色了。

22、页脚彩色滚动横条

博客折腾美化过程全记录及实用技巧

将下面的代码添加到style.css或外观→自定义样式里面。

  1. #footer-widget-box {
  2. background: #1d1626 url(https://wx2.sinaimg.cn/large/006VCrUsgy1fjmflwl7rog30ag004dfs.gif) repeat-x scroll 0 100%;
  3. }

23、导航菜单加大字体、间距

加大字体,将下面的代码添加到style.css或外观→自定义样式里面。

  1. #site-nav .down-menu li {
  2. font-size:15px;
  3. }

调整间距

  1. #site-nav .down-menu a {
  2. padding: 0 8px;
  3. }

24、首页布局添加蓝色边框CSS

  1. .post:hover, .tao-box:hover, .picture-box:hover, .picture-h:hover, .tab-site:hover, .cat-box:hover {
  2. border: 1px dashed #39c;
  3. }

25、给缩略图添加圆角及背影效果

  1. .thumbnail {
  2. border-radius: 6px;
  3. box-shadow: rgba(0,0,0,0.5) 3px 3px 3px;
  4. }

26、右下角滚屏按钮美化

效果及操作步骤,请查看:知更鸟Begin主题右下角滚屏快捷方式美化

27、侧边栏添加广告小工具

博客折腾美化过程全记录及实用技巧

小工具→增强文本,添加以下代码:

  1. <div style="position: relative;"><a href="https://www.xgboke.com" rel="nofollow" target="_blank" data-original-title="网吧无盘" title="网吧无盘"><img class=" aligncenter" src="https://www.xgboke.com/wp-content/uploads/2018/06/2018062408582789.jpg" alt="网吧无盘" style=" margin-left: 0px; padding: 1px;margin-bottom: 1px; border-radius: 4px;" width="360" height="120"></a><span style="position: absolute;bottom:-1px;right:-1px;"><img src="/wp-content/uploads/2018/06/2018062409142517.png"></span></div>

右下角“广告”二字,png格式 下载

28、为评论功能增加字数限制

将下面的代码添加到当前主题的 functions.php 文件, 代码只对未登录用户的评论设置了限制。代码来源 龙笑天下

  1. /**
  2.  * 为WordPress评论功能增加字数长度限制 - 龙笑天下
  3.  * https://www.ilxtx.com/limit-wordpress-comment-length.html
  4.  */
  5. function lxtx_set_comments_length($commentdata) {
  6.     $minCommentlength = 5//最少字數限制,建议设置为5-10个字
  7.     $maxCommentlength = 220//最多字數限制,建议设置为150-200个字
  8.     $pointCommentlength = mb_strlen($commentdata['comment_content'],'UTF8'); //mb_strlen 一个中文字符当做一个长度
  9.     if ( ($pointCommentlength < $minCommentlength) && !is_user_logged_in() ){
  10.     err('抱歉,您的评论字数过少,最少输入' . $minCommentlength .'个字(目前字数:'. $pointCommentlength .')【登录后无此限制】');
  11.     exit;
  12.     }
  13.     if ( ($pointCommentlength > $maxCommentlength) && !is_user_logged_in() ){
  14.     err('抱歉,您的评论字数过多,最多输入' . $maxCommentlength .'个字(目前字数:'. $pointCommentlength .')【登录后无此限制】');
  15.     exit;
  16.     }
  17.     return $commentdata;
  18. }
  19. add_filter('preprocess_comment', 'lxtx_set_comments_length');

29、Tab组合分类改三列平分居中显示

效果如图:博客折腾美化过程全记录及实用技巧

在Style.css 中分别查找 .tab-hd-con.tab-hd .current,将 width: 100px 分别修改为 width: 33.3333333%

30、评论回复“@某人”时添加彩色背景边框

在Style.css 中查找 .at, .at a 及其代码,修改为以下:

  1. .at, .at a {
  2.     color: #fff;
  3.     font-size: 13px;
  4.     margin-right: 5px;
  5.     padding: 1px 5px;
  6.     background: #1abc9c;
  7.     border-radius: 3px;
  8. }

31、修复评论自动获取QQ昵称

依次打开主题页面/js/qq-info.php

第二十八行也就是$nameurl = "

全行替换为$nameurl = "http://users.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?uins=".$qq;

32、小工具中 1 2 3 序号修改颜色

博客折腾美化过程全记录及实用技巧

Style.css查找:

  1. /** 序号 **/
  2. .li-icon-1,
  3. .li-icon-2,
  4. .li-icon-3 {
  5.     background: #c40000;
  6. }

修改为:

  1. .li-icon-1 {
  2.     background: #c40000;
  3. }
  4. .li-icon-2 {
  5.     background: #0cf;
  6. }
  7. .li-icon-3 {
  8.     background: #03bf03;
  9. }

33、正文标题加底色修改

Style.css查找:

  1. /** 正文 **/
  2. .entry-header h1 {
  3.     position: relative;
  4.     font-size: 20px;
  5.     font-size: 2.0rem;
  6.     line-height: 30px;
  7.     text-align: center;
  8.     margin: 35px 0 0 0;
  9.     padding: 5px 0;
  10. }

修改为:

  1. .entry-header h1 {
  2.     position: relative;
  3.     font-size: 20px;
  4.     font-size: 1.8rem;
  5.     line-height: 30px;
  6.     text-align: center;
  7.     margin: 35px -20px 0 -20px;
  8.     padding: 5px 20px;
  9.     height: auto;
  10.     color: #fff;
  11.     text-transform: inherit;
  12.     background-color: #1ba1e2;
  13.     border-bottom: 1px solid #ddd;
  14. }

34、H2、H3(二、三级)标题加底色修改

效果如图

二级标题式样

三级标题式样

Style.css查找:

  1. /** 排版样式 **/
  2. .single-content h2 {
  3.     font-size: 17px;
  4.     font-size: 1.7rem;
  5.     line-height: 190%;
  6.     margin: 10px -21px;
  7.     padding: 0 44px;
  8.     border-left: 5px solid #e40000;
  9. }
  10. .single-content h3 {
  11.     font-size: 16px;
  12.     font-size: 1.6rem;
  13.     line-height: 190%;
  14.     margin: 2px -21px 10px -21px;
  15.     padding: 0 44px;
  16.     border-left: 5px solid #3690cf;
  17. }

修改为:

  1. .single-content h2 {
  2.     font-size: 17px;
  3.     font-size: 1.7rem;
  4.     line-height: 190%;
  5.     margin: 10px -20px;
  6.     padding: 0 44px;
  7.     border-left: 5px solid #e40000;
  8.   background-color: #ebebeb;
  9.     border-bottom: 1px solid #e40000;
  10. }
  11. .single-content h3 {
  12.     font-size: 16px;
  13.     font-size: 1.6rem;
  14.     line-height: 190%;
  15.     margin: 2px -20px 10px -20px;
  16.     padding: 0 44px;
  17.     border-left: 5px solid #3690cf;
  18.     background-color: #ebebeb;
  19.     border-bottom: 1px solid #3690cf;
  20. }

35、TAB组合小工具四栏改三栏

Style.css查找:

  1. /** TAB组合 **/
  2. .zm-tabs-nav a {
  3.     background: #f8f8f8;
  4.     float: left;
  5.     color: #999;
  6.     text-align: center;
  7.     width: 25%;
  8.     border-right: 1px solid #ddd;
  9. }

将width: 25% 修改为33.3333%

36、文章底部点赞分享按钮添加颜色

效果及操作步骤,请查看:知更鸟主题修改文章底部点赞分享按钮颜色

37、给评论头像添加旋转变圆特效

效果及操作步骤,请查看:知更鸟主题给评论头像添加旋转变圆特效

38、鼠标悬停位移效果+点击提示

效果及操作步骤,请查看:知更鸟主题鼠标悬停位移效果+点击提示

39、为评论者添加国籍、操作系统、浏览器和IP信息显示

效果及操作步骤,请查看:知更鸟主题为评论者添加国籍、操作系统、浏览器和IP信息显示

40、把站长标志Admin改成博主

效果及操作步骤,请查看:知更鸟主题把站长标志Admin改成博主

41、美化回复邮件显示样式

效果及操作步骤,请查看:美化知更鸟主题回复邮件显示样式

42、鼠标移动到图片外发光

 /*鼠标移动图片外发光*/
.single-content img:hover {
box-shadow:0px 0px 4px 4px #6dae78 ;
}

43、正文摘要样式修改

 /* 正文摘要修改 */
/* 修改 */
.abstract fieldset {
margin: 0 0 10px;
padding: 5px 15px;
border: 4px solid #ddd;
border-radius: 10px;
}
/* 修改 */
.abstract legend {
padding: 0 5px;
color: #999;
font-weight: bold;
font-size: 15px;
}

44、为文章添加获取当前目录分类目录

效果图及方法:

博客折腾美化过程全记录及实用技巧

1、第一处修改后,效果只在 文章 形式 为“标准”模式下才能显示添加的小图标

查找 wp-content/themes/begin/inc 路径找到文件 post-meta.php 文件将  //文章信息

// 文章信息
function begin_entry_meta() {
if ( ! is_single() ) :
echo '<span class="date">';
time_ago( $time_type ='post' );
echo '</span>';
}

替换为

// 文章信息
function begin_entry_meta() {
if ( ! is_single() ) :
echo '<span class="date"><i class="zm zm-rili1"></i> ';
time_ago( $time_type ='post' );
echo '</span>';
echo '<span class="format-cat"><i class="zm zm-fenlei5"></i> ';
zm_category();
echo '</span>';
}

其中:“zm zm-rili1”跟“zm zm-fenlei5”两处图标,根据网站使用的图标库情况自行修改,本站采用阿里云图标库。

2、第二处修改后,文章 形式 在“日志、视频、软件、链接”模式下都可以显示小图标。将 //日志信息

// 日志信息
function begin_format_meta() {
echo '<span class="date">';
time_ago( $time_type ='post' );
echo '</span>';
echo '<span class="format-cat"><i class="be be-folder"></i> ';
zm_category();
echo '</span>';
}

修改为

// 日志信息
function begin_format_meta() {
echo '<span class="date"><i class="zm zm-rili1"></i> ';
time_ago( $time_type ='post' );
echo '</span>';
echo '<span class="format-cat"><i class="zm zm-fenlei5"></i> ';
zm_category();
echo '</span>';
}

45、页脚添加公安备案号和域名备案号

将代码添加到主题选项---SEO最下面的“页脚第二行信息”中,添加时需要将编辑器切换到文本模式。

Copyright © 2017-2019 <a title="星光博客欢迎您的来访,希望您再次光临!" href="https://www.xgboke.com" target="_blank" rel="noopener">星光博客</a> 版权所有 <a rel="external nofollow" target="_blank" href="https://www.xgboke.com/wp-content/themes/begin/go.php?url=aHR0cDovL3d3dy5taWl0YmVpYW4uZ292LmNuLw==" target="_blank" rel="nofollow noopener"><img style="margin-bottom: -4px;" src="https://www.xgboke.com/wp-content/uploads/2017/12/2017122803514939.png" /><span style="height: 20px; line-height: 20px;"> 鲁ICP备17049621号-2</span></a> <a rel="external nofollow" target="_blank" href="https://www.xgboke.com/wp-content/themes/begin/go.php?url=aHR0cDovL3d3dy5iZWlhbi5nb3YuY24vcG9ydGFsL3JlZ2lzdGVyU3lzdGVtSW5mbz9yZWNvcmRjb2RlPTM3MDc4MzAyMDAwMjY4" target="_blank" rel="nofollow noopener"><img style="margin-bottom: -4px;" src="https://www.xgboke.com/wp-content/uploads/2017/12/201712280258307.png" /><span style="height: 20px; line-height: 20px;"> 鲁公网安备37078302000268号</span></a>

 

46、页脚添加网站运行时长显示

打开 footer.php ,将代码添加到  </div><!-- .site-info --> 上面。其中,(Date.UTC(2017, 08, 09, 0, 0, 1)) 为建站日期与时间,根据需要自行修改。

<!--页脚运行时长开始--> 
Theme by <a rel="external nofollow" target="_blank" href="https://www.xgboke.com/wp-content/themes/begin/go.php?url=aHR0cDovL3ptaW5nY3guY29t" target="_blank" rel="nofollow noopener" marked="1">知更鸟</a> · 托管于 <a rel="external nofollow" target="_blank" href="https://www.xgboke.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly93d3cuYWxpeXVuLmNvbQ==" target="_blank" rel="nofollow noopener" marked="1">阿里云</a> · 网站已运行:<span id="htmer_time" style="color: #0196e3;"></span>
<script>
function secondToDate(second) {
if (!second) {
return 0;
}
var time = new Array(0, 0, 0, 0, 0);
if (second >= 365 * 24 * 3600) {
time[0] = parseInt(second / (365 * 24 * 3600));
second %= 365 * 24 * 3600;
}
if (second >= 24 * 3600) {
time[1] = parseInt(second / (24 * 3600));
second %= 24 * 3600;
}
if (second >= 3600) {
time[2] = parseInt(second / 3600);
second %= 3600;
}
if (second >= 60) {
time[3] = parseInt(second / 60);
second %= 60;
}
if (second > 0) {
time[4] = second;
}
return time;
}
</script>
<script type="text/javascript" language="javascript">
function setTime() {
var create_time = Math.round(new Date(Date.UTC(2017, 08, 09, 0, 0, 1)).getTime() / 1000);
var timestamp = Math.round((new Date().getTime() + 8 * 60 * 60 * 1000) / 1000);
currentTime = secondToDate((timestamp - create_time));
currentTimeHtml = currentTime[0] + '年' + currentTime[1] + '天'
+ currentTime[2] + '时' + currentTime[3] + '分' + currentTime[4]
+ '秒';
document.getElementById("htmer_time").innerHTML = currentTimeHtml;
}
setInterval(setTime, 1000);
</script>
<!--结束-->

 

47、Begin主题面包屑导航栏修改

原先的修改方法已不适应新版主题,每次查找替换代码都很费劲,这次升级主题时顺便记录下。

新版主题面包屑导航栏代码

.bread{width:1122px;height:25px;line-height:25px;margin:0 auto;padding-left:10px;white-space:nowrap;word-wrap:normal;text-overflow:ellipsis;overflow:hidden;}

替换为以下代码

.bread{margin: 10px auto;border: 1px solid #ddd;border-radius: 2px;background-color: #fff;padding-top: 4px;padding-bottom: 4px;padding-left: 10px;}

 

未完,待续!

 

 

 

目录
继续阅读
weinxin
星光博客 站长语录
星光博客,欢迎各位来访!这是我的QQ,扫一扫,加好友。大家一起交流博客建站技术,分享前沿资讯!
关于网站主页下方标明备案编号的通知 网站建设

关于网站主页下方标明备案编号的通知

关于网站主页下方标明备案编号的通知 根据《非经营性互联网信息服务备案管理办法》(原信息产业部令第33号令)规定,非经营性互联网信息服务提供者应当在其网站开通时在主页底部的中央位置标明其备案编号,并在备...
宝塔Linux面板命令大全 网站建设

宝塔Linux面板命令大全

宝塔Linux面板命令大全 前言星光,从建站之初使用的就是宝塔面板。这种可视化的操作界面给我这样的“小白”带来了极大的方便,让不懂代码的我也可以拥有自己的一个小站。网上偶然闲逛,发现了这些代码命令合集...
WordPress博客都应该拥有的11个重要页面 网站建设

WordPress博客都应该拥有的11个重要页面

WordPress 有两种默认的内容类型,分别为 post 文章类型和 page 页面类型。平时我们发布的绝大部分文章都是文章类型,页面类型比较少,不过创建一些页面还是很有必要的。今天我们就跟大家分享...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

评论:38   其中:访客  24   博主  14
    • 小熊资源网  小熊资源网  0 来自天朝的朋友 QQ浏览器  OPPO R11 Plus Build/OPM1.171019.011 北京市 移动

      不错,非常赞!

      • 王小大博客 王小大博客 2 来自天朝的朋友 谷歌浏览器  Redmi K20 Pro Build/QKQ1.190825.002 中国 移动

        博主你底部版权声明下面这个怎么弄的感觉不错啊。

          • 星光 星光  站长 来自天朝的朋友 谷歌浏览器  YAL-AL10 Build/HUAWEIYAL-AL10 山东省潍坊市 联通

            @ 王小大博客 后台小工具—页脚菜单

          • C. C. 2 来自天朝的朋友 谷歌浏览器  Redmi K20 Pro Build/QKQ1.190825.002 广东省中山市 移动

            博主你的文章页面的最后更新是最新主题自带的吗,还是你自己添加的。

              • 星光 星光  站长 来自天朝的朋友 谷歌浏览器  YAL-AL10 Build/HUAWEIYAL-AL10 山东省青岛市 联通

                @ C. 你说的这个是什么意思?我没看懂呢

                  • C. C. 2 来自天朝的朋友 谷歌浏览器  Redmi K20 Pro Build/QKQ1.190825.002 广东省中山市 移动

                    @ 星光 就是这个 最后更新:29/1/2020

                      • 星光 星光  站长 来自天朝的朋友 谷歌浏览器  YAL-AL10 Build/HUAWEIYAL-AL10 山东省青岛市 联通

                        @ C. 这个是最新主题自带的。经你这么一说我才发现这个显示的是一篇文章的最后更新日期。

                          • C. C. 2 来自天朝的朋友 QQ浏览器  Redmi K20 Pro Build/QKQ1.190825.002 广东省中山市 移动

                            @ 星光 我也是最新版,怎么没显示。

                            • 星光 星光  站长 来自天朝的朋友 谷歌浏览器  YAL-AL10 Build/HUAWEIYAL-AL10 山东省青岛市 联通

                              @ C. 后台-主题选项-基本设置-最后更新日期

                              • C. C. 2 来自天朝的朋友 QQ浏览器  Redmi K20 Pro Build/QKQ1.190825.002 广东省中山市 移动

                                @ 星光 一直就是打开着的

                                • 星光 星光  站长 来自天朝的朋友 谷歌浏览器  YAL-AL10 Build/HUAWEIYAL-AL10 山东省青岛市 联通

                                  @ C. 这个只有文章内容做了修改后才会显示,你看看我的,有的显示有的没有。

                          • 全能水杯 全能水杯 0 来自天朝的朋友 QQ浏览器 Windows 7 河南省南阳市 移动

                            帮你点点广告~!

                            • wordpress建站吧 wordpress建站吧 1 来自天朝的朋友 谷歌浏览器 Windows 10 四川省 移动

                              感觉挺好看的。

                              • 博主好 博主好 0 来自天朝的朋友 谷歌浏览器 Windows 7 湖北省 电信

                                博主你好,想请教一下手机移动端的文章列表显示异常,换了几个浏览器都是异常的。但是用同一个浏览器查看博主你的移动端,文章列表显示是正常的,这个要怎么解决啊?我是小白,麻烦说详细一点,谢谢!对比截图:https://share.weiyun.com/50NnIB7
                                https://share.weiyun.com/5cTQaAe

                                  • 星光 星光  站长 来自天朝的朋友 火狐浏览器 Windows 10 中国 移动

                                    @ 博主好 你的博客百度权重4,好高啊!不是很懂,以我的理解,可能是你文章头图(文章列表缩略图)大小不一致造成的。你可以修改试试

                                  • 企鹅博客 企鹅博客 0 谷歌浏览器 Windows 10 日本

                                    qq快速评论没用,你的缓存压缩的原因

                                      • 星光 星光  站长 来自天朝的朋友 火狐浏览器 Windows 10 山东省潍坊市 联通

                                        @ 企鹅博客 这个这么解决下?

                                          • 星光 星光  站长 来自天朝的朋友 火狐浏览器 Windows 10 中国 移动

                                            @ 星光 已经解决了