typecho允许用户自定义模板，模板主要用于首页或其他页面，这里的其他页面可以是一个归档页，也可以是一个友情链接页面。如果需要自定义一个首页模板，需要在php文件的头部添加如下代码，用来告诉typecho程序该页面的用途：
<?php
/**
* 自定义首页模板
*
* @package index
*/
?>如果是其他的功能页面则统一添加下面的代码：
<?php
/**
* 自定义页面模板
*
* @package custom
*/
?>上面这两段代码中，“自定义xx模板”是这一排文字是页面模板的标题，可以任意修改为自己喜欢的描述。将包含上述代码的php文件保存到主题根目录后，我们可以在后台“独立页面”选项中选择任意一个页面打开，在页面右边的自定义模板中可以看到我们刚刚定义的模板，当然，目前还仅仅是一个空白模板。
定义一个sitemap的模板
将以下代码在主题根目录下保存为php文件，然后新建一个页面，选择模板为“HTML版网站地图Sitemap”，确认保存后可以为站点生成一个html版本的sitemap页面。以下代码来自知乎：
<?php
/**
*HTML版网站地图Sitemap
*
* @package custom
*/
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=<?php $this->options->charset(); ?>" />
<title>站点地图 - <?php $this->options->title() ?></title>
<meta name="keywords" content="站点地图,<?php $this->options->title() ?>" />
<meta name="copyright" content="<?php $this->options->title() ?>" />
<link rel="canonical" href="<?php $this->permalink() ?>" />
<style type="text/css">
body {font-family: Microsoft Yahei,Verdana;font-size:13px;margin:0 auto;color: #000000;background: #ffffff;width: 990px;margin: 0 auto}
a:link,a:visited {color:#000;text-decoration:none;}
a:hover {color:#08d;text-decoration:none;}
h1,h2,h3,h4,h5,h6 {font-weight:normal;}
img {border:0;}
li {margin-top: 8px;}
.page {padding: 4px; border-top: 1px #EEEEEE solid}
.author {background-color:#EEEEFF; padding: 6px; border-top: 1px #ddddee solid}
#nav, #content, #footer {padding: 8px; border: 1px solid #EEEEEE; clear: both; width: 95%; margin: auto; margin-top: 10px;}
</style>
</head>
<body vlink="#333333" link="#333333">
<h2 style="text-align: center; margin-top: 20px"><?php $this->options->title() ?>'s SiteMap </h2>
<center></center>
<div id="nav"><a href="<?php $this->options ->siteUrl(); ?>"><strong><?php $this->options->title() ?></strong></a> » <a href="<?php $this->permalink() ?>">站点地图</a></div>
<div id="content">
<h3>最新文章</h3>
<ul>
<?php
$stat = Typecho_Widget::widget('Widget_Stat');
$this->widget('Widget_Contents_Post_Recent', 'pageSize='.$stat->publishedPostsNum)->to($archives);
$year=0; $mon=0; $i=0; $j=0;
while($archives->next()){
$year_tmp = date('Y',$archives->created);
$mon_tmp = date('m',$archives->created);
$y=$year; $m=$mon;
if ($year > $year_tmp || $mon > $mon_tmp) {
$output .= '</ul>';
}
$output .= '<li><a href="'.$archives->permalink .'">'. $archives->title .'</a></li>';
}
$output .= '</ul>';
echo $output;
?>
</ul>
</div>
<div id="content">
<li class="categories">分类目录
<ul><?php $this->widget('Widget_Metas_Category_List')
->parse('<li><a href="{permalink}">{name}</a> ({count})</li>'); ?>
</ul>
</li>
</div>
<div id="content">
<li class="categories">独立页面</li>
<ul class="clearfix" id="nav_menu">
<li><a href="<?php $this->options->siteUrl(); ?>">首页</a></li>
<?php $this->widget('Widget_Contents_Page_List')
->parse('<li><a href="{permalink}">{title}</a></li>'); ?>
</ul>
</div>
<div id="footer">查看博客首页: <strong><a href="<?php $this->options ->siteUrl(); ?>"><?php $this->options->title() ?></a></strong></div><br />
<center>
<div style="text-algin: center; font-size: 11px"><br /> © <?php echo date('Y'); ?> <strong><a href="<?php $this->options ->siteUrl(); ?>" target="_blank"><?php $this->options->title() ?></a></strong> 版权所有<br /><br /><br />
</div>
</center>
</body>
</html>部署一个jsMind实例
修改主题的时候想找一个类似思维导图的软件理一下页面元素的关系，发现了这个jsMind库，部署也相对简单，在主题文件夹内新建了一个project文件夹，把jsMind所需要引用的js以及css文件放在project文件夹下的jsmind文件夹中，然后生成以下模板。
<?php
/**
*思维导图
*
* @package custom
*/
?>
<?php if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
<!DOCTYPE HTML>
<html>
<head>
<?php $this->need('_include.php'); ?>
<link type="text/css" rel="stylesheet" href="<?php $this->options->themeUrl('/project/jsmind/style/jsmind.css'); ?>" />
<style type="text/css">
#jsmind_container {
width:100%;
height: 500px;
border: solid 1px #ccc;
background: #f4f4f4;
margin-bottom: var(--marginN);
border-radius:var(--radiusL);
}
</style>
</head>
<body>
<?php $this->need('_header.php'); ?>
<?php $this->need('_bread.php'); ?>
<div id="aug-main" class="aug-container">
<div id="jsmind_container"></div>
<script type="text/javascript" src="<?php $this->options->themeUrl('/project/jsmind/js/jsmind.js'); ?>"></script>
<script type="text/javascript" src="<?php $this->options->themeUrl('/project/jsmind/js/jsmind.draggable-node.js'); ?>"></script>
<script type="text/javascript">
function load_jsmind() {
var mind = {
meta: {
name: 'demo',
author: 'hizzgdev@163.com',
version: '0.2',
},
format: 'node_array',
data: [
{ id: 'root', isroot: true, topic: 'jsMind' },
{ id: 'sub1', parentid: 'root', topic: '双击编辑节点' },
{ id: 'sub2', parentid: 'root', topic: '节点允许拖拽' },
{ id: 'sub3', parentid: 'root', topic: '按"enter"键添加同级节点' },
{ id: 'sub4', parentid: 'root', topic: '按"insert"键添加同级节点' },
{ id: 'sub5', parentid: 'root', topic: '按"delete"键以删除节点' },
{ id: 'sub6', parentid: 'root', topic: '自动生成的节点反向时可以拖拽至合适位置' },
],
};
var options = {
container: 'jsmind_container',
editable: true,
theme: 'primary',
};
var jm = jsMind.show(options, mind);
}
load_jsmind();
</script>
</div>
<?php $this->need('_footer.php'); ?>
</body>
</html>