最近无意中看到读者墙的头像显示有问题，具体表现为鼠标指向头像不显示博主名及评论数目，只显示“读者墙”三个字，刚开始我是不知道头像的下面会有一个Url位置，下移鼠标才知道。

一直就这个问题想办法解决，我看了其他的博客都可以实现啊，第一件事就想到插件的问题，在这里讨论的是修改，美化将在下面提及到。

最终修改美化图

插件修改：

鉴于上面的问题，我这次修改的目的很明确，就是要把默认的描述“读者墙”修改为和下面一样的描述，能正常显示评论数目及博主名称。我反复的修改php代码，那个描述就是不生效，将近2个小时了，还是看不出有什么问题，Chrome的查看源代码也没发现什么问题。

就在想放弃的时候，在一论坛看到Alt标签和Title标签，据作者所说Alt和Title对不同的浏览器是由不同的，任意门 。然后我就翻了翻php代码，终于发现了猫腻。两段代码Url标签那里使用了Title属性，而Img标签那里却使用了Alt属性。据帖子里说，Title在Chrome下有效，Alt在IE下有效，这样问题就大概摸清了。

解决方法：

打开wp-reader-wall.php，在前面缺少Alt属性的地方加入Alt属性，在后面缺少Title属性的地方加入Title属性。如下图；

在前后都补全了相关属性，这样在IE或Chrome上都不会出现不兼容了。

$tmp = "<a href='".$url."' title='".$comment->comment_author." (".$comment->comment_nums.")' alt='".$comment->comment_author." (".$comment->comment_nums.")'><img width='".$imgsize ."' height='".$imgsize ."' src='http://www.gravatar.com/avatar.php?gravatar_id=".md5( strtolower($comment->comment_author_email) )."&size=".$imgsize ."&d=identicon&r=G' title='".$comment->comment_author." (".$comment->comment_nums.")' alt='".$comment->comment_author." (".$comment->comment_nums.")' /></a>"; $output .= $tmp;

 

 

为了让访客浏览得更好于是加上Target标签，使点击头像时从新窗口打开。请加入如下代码；

在 $tmp = "<a href='".$url."' title='".$comment-> 中的  $tmp = "<a后面加入 “target='_blank'” 不含双引号。

 

插件美化：

大家应该都对默认的样式看腻了吧，下面就由我教大家对读者墙的CSS样式进行修改美化。

打开当前主题的Style.css在适当的地方(那里都可以主要方便自己以后的修改)加入下面的代码；

/* 读者墙样式开始 */

#readerswall a {
padding:3px;
}
#readerswall img {
opacity: 0.8;
background:#F4F4F4;
border:1px solid #CCC!important;
padding:1px;
-webkit-box-shadow:2px 2px 6px #999;
-moz-box-shadow:2px 2px 6px #999;
}
#readerswall a:hover img {
opacity: 1.0;
}

/* 读者墙样式结束 */

 

 

CSS源代码取自我是大头(应该说是偷的! 12:) ) ，最后又看了看效果个人觉得横列距离密了点，于是参照了集思博客的CSS样式，对上面的代码进行了修改，使得距离宽一点；

以下为修改内容；

打开Style.css，在刚才添加的代码中找到；

-webkit-box-shadow:2px 2px 6px #999;
-moz-box-shadow:2px 2px 6px #999;

在下面加上；

margin:4.5px;

原创内容，转载请出示版权信息!

Last modification：June 25, 2021
© Allow specification reprint
如果解决了你的困扰, 赏杯咖啡吧!
正文字体： 苍耳字库（屏幕显示字体）·苍耳今楷