修改之前一定要备份文件 防止改忘记了的时候还有退路可走 或者你也可以使用子主题功能
插件兼容问题
WP Favorite Post
导致无法编辑主题自定义内容
Collapse-O-Matic
如果文章中有加载此插件效果 会导致图片灯箱效果失效
代码修改
文章排序
我的方式是把BLOG模板进行排序 这样不影响CMS布局页面
打开BLOG模板文件
/begin/template-blog.php
1
/begin/template-blog.php
找到如下代码
$args = array(
'category__not_in' => $notcat,
'post__not_in' => $sticky,
'paged' => $paged
);
1
2
3
4
5
$args=array(
'category__not_in'=>$notcat,
'post__not_in'=>$sticky,
'paged'=>$paged
);
添加如下两行代码
'orderby' => 'modified',
'order' => 'DESC',
1
2
'orderby'=>'modified',
'order'=>'DESC',
添加后变成下面这样
$args = array(
'category__not_in' => $notcat,
'post__not_in' => $sticky,
'orderby' => 'modified',
'order' => 'DESC',
'paged' => $paged
);
1
2
3
4
5
6
7
$args=array(
'category__not_in'=>$notcat,
'post__not_in'=>$sticky,
'orderby'=>'modified',
'order'=>'DESC',
'paged'=>$paged
);
然后新建一个页面 模板选择blog 发布该页面 以后访问此页面就是blog布局 并且按最后修改顺序倒序来排序 如果想要其他排序方式 可以修改'orderby'参数
'orderby' => 'date'//按发布日期排序
'orderby' => 'modified'//按修改时间排序
'orderby' => 'ID'//按文章ID排序
'orderby' => 'comment_count'//按评论最多排序
'orderby' => 'title'//按标题排序
'orderby' => 'rand'//随机排序
1
2
3
4
5
6
'orderby'=>'date'//按发布日期排序
'orderby'=>'modified'//按修改时间排序
'orderby'=>'ID'//按文章ID排序
'orderby'=>'comment_count'//按评论最多排序
'orderby'=>'title'//按标题排序
'orderby'=>'rand'//随机排序
'order' => 'DESC'这行代表按倒序排列 如果按顺序排列的话为 'order' => 'ASC'
嵌套留言
嵌套留言如果过多 会一直缩小留言框 直到最后你会看到每一行只能显示一个字 尤其是手机端 继续动刀修改 这次的主题评论函数所在文件位置为
/begin/inc/functions/comment-template.php
1
/begin/inc/functions/comment-template.php
第22行代码如下
<<?php echo $tag ?> <?php comment_class( empty( $args['has_children'] ) ? '' : 'parent' ) ?> id="comment-<?php comment_ID() ?>">
1
<<?phpecho $tag?><?phpcomment_class (empty($args['has_children'])?'':'parent')?>id="comment-<?phpcomment_ID ()?>">
修改为
<<?php echo $tag ?> <?php comment_class( empty( $args['has_children'] ) ? '' : 'parent', 'clearfix' ) ?><?php if( $depth > 3){ echo ' style="margin-left:-21px;margin-right:-21px;"';} ?> id="comment-<?php comment_ID() ?>">
1
<<?phpecho $tag?><?phpcomment_class (empty($args['has_children'])?'':'parent','clearfix')?><?phpif ($depth>3){echo' style="margin-left:-21px;margin-right:-21px;"';}?>id="comment-<?phpcomment_ID ()?>">
其中 $depth > 3 表示从第3层开始缩进两边跟上一层对齐
然而底边也实在是太高 改小一点吧 进入 主题选项 → 定制风格 填入一下CSS样式
.comment-list li {
position: relative;
background: #fff;
margin: 0 0 5px 0;
padding: 0px 20px;
border: 1px solid #ebebeb;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
border-radius: 2px;
word-wrap: break-word;
word-break: break-all;
}
1
2
3
4
5
6
7
8
9
10
11
.comment-listli{
position:relative;
background:#fff;
margin:005px0;
padding:0px20px;
border:1pxsolid#ebebeb;
box-shadow:01px1pxrgba(0,0,0,0.03);
border-radius:2px;
word-wrap:break-word;
word-break:break-all;
}
OK 虽然底边还是会有一点 不过紧凑了很多 看个人喜欢吧
访客信息
关于访客信息的实现看下面这篇文章
找到第35-37行代码如下
1
2
3
把访客信息中需要加入的代码放到第37行下面即可 同时注意修改下show-useragent.php文件中的相关图片路径即可
小工具
这次的小工具都集成在一个文件里面了 位置如下
/begin/inc/functions/widgets.php
1
/begin/inc/functions/widgets.php
比如想让最近评论显示自己的留言 找到第96行代码
$my_email = get_bloginfo ('admin_email');
1
$my_email=get_bloginfo('admin_email');
把其中的 admin_email 改为其他名称即可 比如 admini_email 这样判断不到管理员邮件地址自然就会让判断失效了
侧边最新评论
由于评论分页后原主题所带的最新评论小工具上的评论链接并不带分页函数 所以如果评论不在最后一页就无法准确定位到评论的位置 我们来看看主题是怎么获取这个评论链接的
<?php echo get_permalink($my_comment->comment_post_ID); ?>#comment-<?php echo $my_comment->comment_ID; ?>
1
<?phpechoget_permalink ($my_comment->comment_post_ID);?>#comment-<?phpecho $my_comment->comment_ID;?>
获取方法就是评论所在文章链接 + 评论ID的方式 只要把上面类似的代码修改为下面的代码即可
<?php echo get_comment_link( $my_comment->comment_ID ); ?>
1
<?phpechoget_comment_link ($my_comment->comment_ID);?>
这样评论链接就会带分页链接函数了 不管在评论页的哪一页都可以准确定位
文章列表中文截断
打开下面两个文件
/begin/content-aside.php
1
/begin/content-aside.php
/begin/content.php
1
/begin/content.php
找到下面这段代码
{ echo wp_trim_words( get_the_excerpt(), 90, '...' ); } else { echo wp_trim_words( get_the_content(), 100, '...' ); }
1
{echowp_trim_words(get_the_excerpt(),90,'...');}else{echowp_trim_words(get_the_content(),100,'...');}
其中90是文章中输入了摘要内容的截断长度 100是未输入摘要内容的截断长度 可以根据自己的需要来修改
修改评论框
修改位置
/begin/comments.php
1
/begin/comments.php
评论框提示
118行代码如下
1
修改为
1
如果想在评论框上方添加其他提示 可以用如下代码 把地址替换为你自己的即可
如果您喜欢本站 请至百度口碑评价本站请善用顶部导航栏右侧的搜索以及右栏底部的搜索来查找你需要的内容
1
如果您喜欢本站请至百度口碑评价本站请善用顶部导航栏右侧的搜索以及右栏底部的搜索来查找你需要的内容
多作者博客评论处头像问题
多作者博客评论处头像有时候现实的并不是自己的 处理方法如下
69行如下代码
1
修改为
<?php global $current_user;get_currentuserinfo();echo get_avatar( $current_user->user_email, '64' ); ?>
1
<?phpglobal $current_user;get_currentuserinfo();echoget_avatar($current_user->user_email,'64');?>
文章内容
文章内容模板文件位置为
/begin/content.php
1
/begin/content.php
找到如下代码
1
这里就是正文内容的开始 比如本站的文章顶部分享代码就是放在该行下面的
CSS样式
不得不说这次主题的CSS样式修改很方便 再也不用去动原有的文件了 只需要在 主题选项 → 定制风格 自定义即可
评论图片
如果你的评论图片包括表情变成一行只能有一幅的话 可以试试添加此CSS样式
.comment-list p img {
max-width: 100%;
width: auto;
height: auto;
vertical-align: middle;
display: inline;
}
1
2
3
4
5
6
7
.comment-listpimg{
max-width:100%;
width:auto;
height:auto;
vertical-align:middle;
display:inline;
}
回复按钮
不知道大家在手机上看的时候 是否会被回复按钮挡住楼层数 虽然不影响使用 不过强迫症患者还是希望他不要挡住我的视线
把回复按钮往右上角挪挪 代码如下
.reply a {
top: 3px;
right: 5px;
}
1
2
3
4
.replya{
top:3px;
right:5px;
}
其中 3px为离顶端的距离 5px为离右端的距离 自己可以适当调整
文章列表缩略图
我的缩略图一直用的正方形的 所以我要改成200x200的 CSS如下
.thumbnail {
width: 200px;
height: 200px;
}
.thumbnail a img {
width: 200px;
height: 200px;
}
@media screen and (max-width: 620px) {
.thumbnail {
width: 100px;
height: 100px;
}
.thumbnail a img {
width: 100px;
height: 100px;
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
.thumbnail{
width:200px;
height:200px;
}
.thumbnailaimg{
width:200px;
height:200px;
}
@mediascreenand(max-width:620px){
.thumbnail{
width:100px;
height:100px;
}
.thumbnailaimg{
width:100px;
height:100px;
}
}
文章目录
如果觉得文章目录那块小的话可以用以下CSS解决
#catalog {
width: 200px;
height: 200px;
}
1
2
3
4
#catalog {
width:200px;
height:200px;
}
由于主题已经设置了最大宽度为300 所以大可自行设定需要的宽度和高度 另外height如果想要目录全部显示 可以改成auto
评论编辑器
参考资料
百度网盘
customeditor.txt 密码: s19i [820]
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
