QQ截图20180309005435.png

创建一个新分类名称为“说说”,然后把文章添加到该分类中即可,模板会自动识别赋予类似微博的样式

index.php

<div class="article-list">
    <?php 
    $LastIsShuoshuo=false;
    while($this->next()): 
    global $isShuoshuo;
    $isShuoshuo=false;
    array_map(function($v){global $isShuoshuo;if($v['name']=="说说"){$isShuoshuo=true;};},$this->categories);
    if($isShuoshuo===true){ 
    $LastIsShuoshuo=true;
    ?>
    <div class="shuoshuo">
        <div class="shuoshuo-meta shuoshuo-meta-<?php echo $this->cid ?>">
        <style>
        .shuoshuo-meta-<?php echo $this->cid ?>:before {
            content: '<?php $this->date('F jS , Y'); ?>';
        }
        </style>

        </div>
        <div class="shuoshuo-container">
            <div class="author-info">
                <?php $this->author->gravatar(50); ?>
            </div>
            <div class="content-container">
                <div class="content">
                    <a pjax href="<?php $this->author->permalink(); ?>">@<?php $this->author(); ?></a>:<?php echo $this->excerpt; ?>
                </div>
                <div class="comments"></div>
            </div>
        </div>
    </div>

css

.article-list .shuoshuo .content p{
    display: inline;
}
.article-list .shuoshuo .author-info img{
    box-shadow: 0 0 5px rgba(0,0,0,0.2);
    border-radius:50%;
}
.article-list .shuoshuo .shuoshuo-meta{
    border-top:1px solid #eaeaea;
    text-align:center;
}
.article-list .shuoshuo .shuoshuo-meta:before {
    position: absolute;
    margin: -13px -73px;
    transition:color 0.5s;
    color: #a2a2a2;
    background-color: white;
    padding: 0 10px;
}
.article-list .shuoshuo .shuoshuo-meta:hover::before {
    color:black;
}
.article-list .shuoshuo-container{
    padding:20px 10px 15px;
    display:flex;
}
.article-list .shuoshuo .content-container{
    margin-left:15px;
}
.article-list .shuoshuo a{
    color: #8a2be2;
}

js

function checkElementFade(){
    var articleElements=document.querySelectorAll('.article,.page-navigator,.footer,.shuoshuo');
    [].forEach.call(articleElements, function(e){
        if(e.getBoundingClientRect().top < window.innerHeight){
            e.style.opacity="1";
            e.classList.add("animated");
            e.classList.add("fadeInUp");
        };
    });
}

[post cid="2451" cover="https:\/\/true-me.com\/usr\/uploads\/2018\/01\/1280396067.png"/]
作者:https://qwq.moe/