文章面页美化

今天带来的美化是文章列表的美化！先来看看图片展示

美化分为两个部分，一部分是侧栏的颜色线条效果，另一部分就是阅读，评论分类的底色..

第一部分，侧栏颜色

打开sakurairo主题的inc/decorate.php文件第1531行代码

.post-list-thumb:nth-child(2n) .post-content-wrap {
    float: left;
    padding-left: 30px;
    padding-right: 0;
    text-align: right;
    margin: 20px 10px 10px 0
}

修改为

.post-list-thumb:nth-child(2n) .post-content-wrap {
    float: left;
    padding-left: 30px;
    padding-right: 0;
    text-align: right;
    margin: 20px 37px 10px 0;
}

把下面的代码复制到你主题下的style.css最底部

 /*側邊條*/
 .post-list-thumb:hover:after {
    height: 100%;
}
.post-list-thumb:after {
    content: '　';
    width: 4px;
    height: 0;
    position: absolute;
    top: 0;
    background-color: rgb(105, 140, 255);/*颜色自己換*/
    box-shadow: 0 0 6px rgb(105, 165, 255);/*颜色自己換*/
    border-radius: 10px;
    transition: 1s all;
}
.post-list-thumb-left:after{
  right: 0;
 left: auto;
}

第二部分，底色添加

同样把下面代码复制到你主题下的style.css文件最底部

.post-meta span:nth-child(1) {
        background-color: rgb(0, 255, 0);/*颜色自己換*/
    padding: 0px 10px 3px 7px; /*尺寸自己換*/
    border-radius: 7px;/*尺寸自己換*/
    }
.post-meta span:nth-child(2) {
    background-color: rgb(251, 255, 0);/*颜色自己換*/
    padding: 0px 10px 3px 7px;/*尺寸自己換*/
    border-radius: 7px;/*尺寸自己換*/
}
.post-meta span:nth-child(3) {
        background-color: rgb(255, 0, 0);/*颜色自己換*/
    padding: 0px 10px 3px 7px;/*尺寸自己換*/
    border-radius: 7px;/*尺寸自己換*/
    }       /*1,2,3 分別對應 3個 底色*/

发布时间修改

发现sakura，sakurairo的发布时间大于一个月才会显示正确时间，由于个人喜欢准确的日子
所以对文章的面页进行了修改…

打开主题的 tpl/content-thumb.php 文件，大约在第35行，代码如下

<i class="iconfont icon-time"></i><?php echo poi_time_since(strtotime($post->post_date_gmt)); ?>

修改为

<i class="iconfont icon-time"></i>发布于 <?php the_time('Y年n月d日 H:i:s'); ?>

文章封面就会显示年月日时间..或者可以去掉H:i:s

想要加上文章的最后修改时间就将代码取代为下面代码

<i class="iconfont icon-time"></i>
发布于<?php the_time('Y年n月d日'); ?>
<?php if ((get_the_modified_time('Y')*365+get_the_modified_time('z')) >(get_the_time('Y')*365+get_the_time('z'))) { ?>
	<?php echo '，最后修改于' ?><?php the_modified_time('Y年n月d日'); ?>
<?php } ?>

注意，个人不建议写上时分秒，会超出框架界限.