模板制作

        本文从官方文档开始,通过默认模板和自己在用的大前端theme进行学习修改(DUX不知道为什么我无法进行数学公式输入,所以被迫放弃,改用了一个更简洁的theme,感觉更容易学习更容易魔改),不断魔改自己的theme。想把自己学习的过程不断学习总结,本人非科班计算机出身(本科数学系),因经常混迹于计算机相关活动中,对自己阅读代码水平有一种迷之自信,如果有错误还希望大家多多指教,最后如果大家喜欢这个theme也可以跟着这个教程学习修改。

模板信息

        这是模板信息存放的地方,它将在后台都模板选择页显示。前两行是简短的介绍,每个“*”表示一个段落。@package 表示模板名,@author 表示作者名,@version 是模板的版本号,@link 是作者的网站连接。

/**
 * 这是 Typecho 0.9 系统的一套默认皮肤
 * 
 * @package Typecho Replica Theme 
 * @author Typecho Team
 * @version 1.2
 * @link http://typecho.org
 */

        这几个语句应该是调用header(页首),sidebar(侧栏),footer(页脚)模块,这几个地方的代码是单独成一个文件的。

<?php $this->need('header.php');>
<?php $this->need('sidebar.php'); ?>
<?php $this->need('footer.php'); ?>

        <section>标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。

  其中的class="container"指的应该是在bootstrap中,规定了每一行都被分为了固定的12个栅栏,每一个栅栏都有自己的宽度。如果你的div用了container的样式,那么它的宽度最大也大不过12个栅栏总共的最大宽度。而,当你的div(section)用了container-fluid的样式,它会无视12个栅栏的规定,根据屏幕自动适应自动填充。

<section class="container">
</section>

显示文章

        进入文章循环,输出文章

<?php while($this->next()): ?>
        <article class="post" itemscope itemtype="http://schema.org/BlogPosting">
            <h2 class="post-title" itemprop="name headline"><a itemprop="url" href="<?php $this->permalink() ?>"><?php $this->title() ?></a></h2>
            <ul class="post-meta">
                <li itemprop="author" itemscope itemtype="http://schema.org/Person"><?php _e('作者: '); ?><a itemprop="name" href="<?php $this->author->permalink(); ?>" rel="author"><?php $this->author(); ?></a></li>
                <li><?php _e('时间: '); ?><time datetime="<?php $this->date('c'); ?>" itemprop="datePublished"><?php $this->date(); ?></time></li>
                <li><?php _e('分类: '); ?><?php $this->category(','); ?></li>
                <li itemprop="interactionCount"><a itemprop="discussionUrl" href="<?php $this->permalink() ?>#comments"><?php $this->commentsNum('评论', '1 条评论', '%d 条评论'); ?></a></li>
            </ul>
            <div class="post-content" itemprop="articleBody">
                <?php $this->content('- 阅读剩余部分 -'); ?>
            </div>
        </article>
    <?php endwhile; ?>
  • <?php $this->permalink() ?> 文章所在的连接
  • <?php $this->title() ?> 文章标题
  • <?php $this->author(); ?> 文章作者
  • <?php $this->author->permalink(); ?> 文章作者地址
  • <?php $this->date('F j, Y'); ?> 文章的发布日期,格式可参考PHP日期格式
  • <?php $this->category(','); ?> 文章所在分类
  • <?php $this->commentsNum('%d Comments'); ?> 文章评论数及连接
  • <?php $this->content('Continue Reading...'); ?> 文章内容,其中的“Continue Reading…”是显示摘要时隐藏部分的邀请连接

文章分页

 <?php $this->pageNav(); ?>

文章输出结束后别忘了增加分页

最后

<?php $this->need('sidebar.php'); ?>
<?php $this->need('footer.php'); ?>