1、 增加鼠标特效
效果见我博客鼠标点击特效,具体的修改方法为:
将下框中的代码放在主题的handsome/component/footer.php中</body>之前即可。
#**字体自行修改**(此行不用,下行开始)
<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
$("body").click(function(e) {
var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善");
var $i = $("<span/>").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
y = e.pageY;
$i.css({
"z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": "#ff6651"
});
$("body").append($i);
$i.animate({
"top": y - 180,
"opacity": 0
},
1500,
function() {
$i.remove();
});
});
});
</script>
2、 首页头像转动并放大
本项修改的是首页头像,将鼠标放至头像后使其转动并放大。效果参考我博客左侧头像。
仍为本主题使用,操作方式为:将以下代码添加至后台主题设置 自定义CSS。
#转动快慢和头像大小自行修改数值
/*首页头像自动旋转*/
.thumb-lg{
width:130px;
}
.avatar{
-webkit-transition: 0.4s;
-webkit-transition: -webkit-transform 0.4s ease-out;
transition: transform 0.4s ease-out;
-moz-transition: -moz-transform 0.4s ease-out;
}
.avatar:hover{
transform: rotateZ(360deg);
-webkit-transform: rotateZ(360deg);
-moz-transform: rotateZ(360deg);
}
#aside-user span.avatar{
animation-timing-function:cubic-bezier(0,0,.07,1)!important;
border:0 solid
}
#aside-user span.avatar:hover{
transform:rotate(360deg) scale(1.2);
border-width:5px;
animation:avatar .5s
}
3、 修改首页标题栏及自定义文字
此处位于首页站点公告下方,文章上方。
首先后台“设置外观” → “主题增强功能” → “增强功能开关” → 勾选“首页的标题栏下启用一言接口”。
接着去除此处的标题显示,修改方法为将下框中的代码在主题的handsome/index.php中删除。
<h1 class="m-n font-thin h3 text-black l-h"><?php $this->options->title(); ?></h1>
4、底部版权处修改
增加建站天数及备案信息、修改原版权样式。
以我的底部样式为例,此项在主题的handsome/component/footer.php替换修改即可。
建站天数代码为<?php echo floor((time()-strtotime('2018-05-20'))/86400);?>,
其中2018-05-20请按此日期格式修改建站时间。
底部右侧的站点地图:1/2是我添加了插件sitemap和baidu_sitemap,此链接可删除或替换。
原模板文件中是这样的↓
<div class="wrapper b-t bg-light">
<span class="pull-right hidden-xs">
<?php $this->options->BottomInfo(); ?>
Powered by <a target="blank" href="http://www.typecho.org">Typecho</a> | Theme by <a target="blank" href="https://www.ihewro.com/archives/489/">handsome</a>
</span>
© <?php echo date("Y");?> Copyright <?php $this->options->BottomleftInfo(); ?>
</div>
修改后的是这样的,请自行替换修改↓
<div class="wrapper b-t bg-light">
<span class="pull-right hidden-xs">
<?php $this->options->BottomInfo(); ?>
[ 驱动:<a href="http://www.typecho.org" target="blank">Typecho</a> | 模板:<a href="https://www.ihewro.com/archives/489/" target="blank">友人C</a> | 站点地图:<a href="/sitemap.xml" target="blank">1</a> \ <a href="/baidu_sitemap.xml" target="blank">2</a> | 备案:<a href="http://www.miibeian.gov.cn" target="blank">闽ICP备14017081号</a> ]
</span>
[ 本站已安全运行<?php echo floor((time()-strtotime('2018-05-20'))/86400);?>天<?php $this->options->BottomleftInfo(); ?> ]
</div>
5、留言墙样式修改
此处修改是在 梁兴健个人博客 整理过来的,我觉得此样式比原版的好看,所以就按照教程修改了。
因我现在使用的主题handsome,内置留言墙,所以只要替换代码就可以了,演示查看点击此处。
修改方法是在主题的handsome/functions.php中查找如下代码,可根据头尾处搜索选取替换。
//获得读者墙
function getFriendWall()
{ $options = Typecho_Widget::widget('Widget_Options');
$db = Typecho_Db::get();
$period = time() - 604800; // 单位: 秒, 时间范围: 7天
$sql_7days = $db->select('COUNT(author) AS cnt', 'author', 'url', 'mail')
->from('table.comments')
->where('status = ?', 'approved')
->where('created > ?', $period )
->where('type = ?', 'comment')
->where('authorId = ?', '0')
->where('mail != ?', $options->socialemail) //排除自己上墙
->group('author')
->order('cnt', Typecho_Db::SORT_DESC)
->limit('51'); //读取几位用户的信息
$result_7days = $db->fetchAll($sql_7days);
$html_7days = "<h4>本周评论排行榜(仅显示前51位)</h4><br>";
if (count($result_7days) > 0) {
$html_7days .= '<div class=\'row\'>';
foreach ($result_7days as $value) {
$html_7days .= '<div class="col-lg-4 col-md-6" style="margin-bottom:5px"><a class="list-group-item" target="_blank" rel="nofollow" href="' . $value['url'] . '">' . $value['author'] . '<span class="badge badge-secondary pull-right">' . $value['cnt'] . '</span></a></div>';
}
$html_7days .= '</div>';
echo $html_7days;
}else{
}
$sql = $db->select('COUNT(author) AS cnt', 'author', 'url', 'mail')
->from('table.comments')
->where('status = ?', 'approved')
->where('type = ?', 'comment')
->where('authorId = ?', '0')
->where('mail != ?', $options->socialemail) //排除自己上墙
->group('author')
->order('cnt', Typecho_Db::SORT_DESC)
->limit('51'); //读取几位用户的信息
$result = $db->fetchAll($sql);
$html_7days = "";
$mostactive = "<br><h4>总评论排行榜(仅显示前51位)</h4><br>";
if (count($result) > 0) {
$mostactive .= '<div class=\'row\'>';
foreach ($result as $value) {
$mostactive .= '<div class="col-lg-4 col-md-6" style="margin-bottom:5px"><a class="list-group-item" target="_blank" rel="nofollow" href="' . $value['url'] . '">' . $value['author'] . '<span class="badge badge-secondary float-right">' . $value['cnt'] . '</span></a></div>';
}
$mostactive .= '</div>';
echo $mostactive;
}
}
这个修改也可以运用到其他模板上,修改方法:
将上面的代码加入模板文件夹的handsome/functions.php文件中,然后在模板文件中的当位置加入如下调用代码,此处需要一定的基础知识。
<?php getFriendWall(); ?>
然后需要引入bootstrap的核心css文件:
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
如果你不想用bootstrapCDN的话,可以自己写样式,只要修改handsome/functions.php里面getFriendWall()的函数输出格式即可。
版权属于:本文为原创文章,版权归 Asdrt 所有
本文链接:https://asdrt666.com/index.php/archives/1/
所有原创文章采用 知识共享署名-非商业性使用 4.0 国际许可协议 进行许可。
您可以自由的转载和修改,但请务必注明文章来源并且不可用于商业目的。
路过支持一下主题
能给个主题吗?26616756@qq.com谢谢
例行互访,背景好花呀,都喜欢动漫嚒?
挺好的主题。。