为prower V4添加aside/status文章形式

哇,突然发现此图有亮点,(^o^)/~看来,这楼又要歪了……

prower主题用了快1年了,非常喜欢,在此基础上做了很多个性化的修改调整,更适合自己的胃口。现在冬天了,慵懒了很多,有时候其实只想说几句话,没有长篇大论,用这种standard文章形式貌似太浪费了,于是决心添加aside/status文章形式。

在网上搜了几个教程,第一个是Wopus站上的一篇《WordPress的Tumblr化:Post format功能小试》,原作者是:lucifr。本文是以添加asides文章形式为例的,并不是status文章形式,两则是有区别的,但是都能实现我想要的功能,所以无所谓。起初是照搬lucifr方法,但是发现并不能实现,PHP报错。经过几次折腾,总算基本成型。现在分享一下:

第一步:添加主题支持
需要在主题的 function.php 中添加 add_theme_support() 来告诉 WordPress 主题中需要激活的 Post format 类型。如:

add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );

这样就开启了对 aside 和 gallery 这两种 Post format 的支持。这时在 WordPress 后台的编辑文章页面就可以看到相应的 Post format 选项,并为文章指定相应的 Post format 了。

第二步:在主题中整合aside/status文章形式
以我现在用的为例,直接在主题首页index.php文章列表函数

<?php while ( have_posts() ) : the_post(); ?>

下面添加:

<?php if ( has_post_format( 'aside' )) { ?>
    <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
        <div class="entry-header">
            <header>
                <div class="statusavatar">
<table width="100%" border="0">
               <tr>
               <td width="6%" rowspan="2" align="left" valign="middle"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php echo get_avatar( get_the_author_email(), 42 ); ?></a></td>
               <td width="83%" align="left" valign="middle"><h3>Xinsenz</h3></td>
               <td width="11%" rowspan="2" align="center" valign="middle"><div class="comments-link">
<div class="comments_popup_link" align="center">
                   <?php comments_popup_link( '<span class="leave-reply">' . __( 'Leave a reply' ) . '</span>', __( '1 Reply' ), __( '% Replies' ) ); ?>
                      </div>
               </div>
                 <div align="right">
                   <!-- .comments-link -->
</div></td>
               </tr>
               <tr>
                 <td align="left" valign="middle">@
                   <?php the_time('Y-m-d  H:m:s'); ?>
                 吐槽道:</td>
               </tr>
               </table>
                </div>
            </header>
        </div><!-- .entry-header -->
<div class="entry-content">
            <?php the_content( __( 'Continue reading <span class="meta-nav">&rarr;</span>' ) ); ?>
        </div><!-- .entry-content -->
    </article><!-- #post -->
<?php }else { ?>

添加以上代码后,可能会报错说是endwhile出错,只需找到

<?php endwhile; ?>

改成:

<?php  } endwhile; ?>

原因我不明白,但是的确有效!prowerV4主题直接就可以拿去用,其他主题慎用,需要修改的自己再去折腾摸索哈!因为我对DIV、CSS实在是不懂,所有为求简单,部分布局直接用表格代替了,嘿嘿,也省去了CSS。因为添加了评论链接comments-link,所以只需在CSS里添加相关代码就可以:

.comments_popup_link {right:0; font-size:12px; background:#188CC8; border-top-left-radius:3px; border-top-right-radius:3px; padding:3px 5px;}
.comments_popup_link a{color:#FFF;}
.comments_popup_link a:hover{color:#FFF;}

以上就是自己折腾出的结果。对于达人来讲这都是小菜一碟,而且也有错误的部分,但是对我这个菜鸟来讲,还是很有成就感滴!希望对prower V4主题的朋友有帮助!

共有 33 条评论

发表评论

电子邮件地址不会被公开。 必填项已用*标注