Typecho 模板分析记录

Sualiu 发布于 2022-12-02 最后更新于 2022-12-02


前言

  之前的那个画画的学习暂时中断......以后再说。最近学了一下 php,感觉还挺好玩的,也写了很多没用的脚本。之前写过 Typecho 的模板,不过好像被我刚刚误删了,先打算再写一个模板,全当娱乐。顺便水一篇记录,方便日后查阅使用。

剖析 Typecho 默认主题

  分析一下 Typecho 的官方默认主题(Typecho Replica Theme 1.2),有助于我们理解模板结构。主要分析代码里面的函数的含义,全部函数都有介绍(若 header.php 里没有介绍,去 index.php 看看)。

header.php

<?php if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="<?php $this->options->charset(); ?>">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title><?php $this->archiveTitle([
            'category' => _t('分类 %s 下的文章'),
            'search'   => _t('包含关键字 %s 的文章'),
            'tag'      => _t('标签 %s 下的文章'),
            'author'   => _t('%s 发布的文章')
        ], '', ' - '); ?><?php $this->options->title(); ?></title>

    <!-- 使用url函数转换相关路径 -->
    <link rel="stylesheet" href="<?php $this->options->themeUrl('normalize.css'); ?>">
    <link rel="stylesheet" href="<?php $this->options->themeUrl('grid.css'); ?>">
    <link rel="stylesheet" href="<?php $this->options->themeUrl('style.css'); ?>">

    <!-- 通过自有函数输出HTML头部信息 -->
    <?php $this->header(); ?>
</head>
<body>

<header id="header" class="clearfix">
    <div class="container">
        <div class="row">
            <div class="site-name col-mb-12 col-9">
                <?php if ($this->options->logoUrl): ?>
                    <a id="logo" href="<?php $this->options->siteUrl(); ?>">
                        <img src="<?php $this->options->logoUrl() ?>" alt="<?php $this->options->title() ?>"/>
                    </a>
                <?php else: ?>
                    <a id="logo" href="<?php $this->options->siteUrl(); ?>"><?php $this->options->title() ?></a>
                    <p class="description"><?php $this->options->description() ?></p>
                <?php endif; ?>
            </div>
            <div class="site-search col-3 kit-hidden-tb">
                <form id="search" method="post" action="<?php $this->options->siteUrl(); ?>" role="search">
                    <label for="s" class="sr-only"><?php _e('搜索关键字'); ?></label>
                    <input type="text" id="s" name="s" class="text" placeholder="<?php _e('输入关键字搜索'); ?>"/>
                    <button type="submit" class="submit"><?php _e('搜索'); ?></button>
                </form>
            </div>
            <div class="col-mb-12">
                <nav id="nav-menu" class="clearfix" role="navigation">
                    <a<?php if ($this->is('index')): ?> class="current"<?php endif; ?>
                        href="<?php $this->options->siteUrl(); ?>"><?php _e('首页'); ?></a>
                    <?php \Widget\Contents\Page\Rows::alloc()->to($pages); ?>
                    <?php while ($pages->next()): ?>
                        <a<?php if ($this->is('page', $pages->slug)): ?> class="current"<?php endif; ?>
                            href="<?php $pages->permalink(); ?>"
                            title="<?php $pages->title(); ?>"><?php $pages->title(); ?></a>
                    <?php endwhile; ?>
                </nav>
            </div>
        </div><!-- end .row -->
    </div>
</header><!-- end #header -->
<div id="body">
    <div class="container">
        <div class="row">

if (!defined('__TYPECHO_ROOT_DIR__')) exit; :如果没有这个(__TYPECHO_ROOT_DIR__)常量,则退出脚本(__TYPECHO_ROOT_DIR__ 定义的是 Typecho 所在目录对于系统环境绝对文件路径。在 typecho 根目录的 config.inc.php 中可以看到)。

<?php $this->options->charset(); ?> :调用默认的编码,现在最经常用的大都是 utf-8 吧。所以 typecho 默认是 utf-8,省去php处理时间。

<?php $this->archiveTitle([
            'category' => _t('分类 %s 下的文章'),
            'search'   => _t('包含关键字 %s 的文章'),
            'tag'      => _t('标签 %s 下的文章'),
            'author'   => _t('%s 发布的文章')
        ], '', ' - '); ?>

输出页面的标题,可以根据不同类型的页面输出不同的标题信息,看代码里的汉字就能猜测了。

<?php $this->options->title(); ?> :站点的标题。

<?php $this->options->themeUrl('xxx.js'); ?> :使用url函数转换相关路径(xxx.js为示例资源)。

<?php $this->header(); ?> :通过自有函数输出HTML头部信息。

<?php $this->options->siteUrl(); ?> :站点地址。

<?php $this->options->logoUrl() ?> :站点logo地址,需要 functions.php 的配合。

<?php $this->options->description() ?> :输出站点的介绍信息。

$this->is('index') :判断是否是首页。这里的 ->is() 就是一个判断是否存在的函数,后面的参数是分类、页面的缩略名写法,具体可参考 is-syntax 。举个比较复杂的使用栗子:$this->is('page', $pages->slug) ,意思就是判断 page(页面)是否有 $pages->slug 伪静态,slug 是伪静态的缩写。这里再列举一些常见的缩写:文章(post)、页面(page)、标签(tag)、分类(Category)、伪静态即地址重写(slug)。

<?php \Widget\Contents\Page\Rows::alloc()->to($pages); ?> :获取所有站点页面信息,并将其传递给 $pages 函数。之后只操作 $pages 就行了。这里的 ->to() 就是传递信息的一个函数。

index.php

<?php
/**
 * Default theme for Typecho
 *
 * @package Typecho Replica Theme
 * @author Typecho Team
 * @version 1.2
 * @link http://typecho.org
 */

if (!defined('__TYPECHO_ROOT_DIR__')) exit;
$this->need('header.php');
?>

<div class="col-mb-12 col-8" id="main" role="main">
    <?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->pageNav('&laquo; 前一页', '后一页 &raquo;'); ?>
</div><!-- end #main-->

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

$this->need('header.php'); :引入 header.php 头部信息文件。

  PHP 语言里有一种替代写法,左花括号 { 换成冒号 : ,把右花括号 } 分别换成 endif、endwhile、endfor、endforeach、endswitch。流程控制(包括if、while、for、foreach、switch)中都有这种替代语法。一般就是在 HTML 与 PHP 混用(例如模板)时使用,不过这种方法比较古董了,现在有一种新的标签法,利用的是替换字符。其次就是使流程控制逻辑更清晰,代码更容易阅读。

<?php while ($this->next()): ?>...<?php endwhile; ?> :文章的循环输出。条件 $this->next() 语句的目的是载入下一个循环的时候,循环里输出文章信息的函数输出的内容也会是下一个文章的。

<?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('- 阅读剩余部分 -'); ?> :文章内容,其中的“- 阅读剩余部分 -”是显示摘要时隐藏部分的邀请链接。

<?php $this->pageNav('&laquo; 前一页', '后一页 &raquo;'); ?> :文章输出结束后别忘了增加分页,至此,index.php 的常见内容结束。

<?php $this->need('sidebar.php'); ?> <?php $this->need('footer.php'); ?> :最后引入 footer.php 底部信息文件和 sidebar.php 侧边栏信息文件。

最后

  作者才疏学浅,此文仅是平时娱乐所写,若有不妥之处,还请您批证。本文在不断更新中。谢谢您的阅读,谢谢。

参考信息来源