学海无涯,回头是岸。接下来西顾酱放出两大博客主题文件构成出来,让满怀IT热情的小伙伴“一鼓作气,再而衰,三而竭”!去里妈的IT梦!

WordPressEmlog占博客业的其中两大头,都是十分出名和有代表性的博客系统。

简单起,先看看Emlog主题的文件构成。

Emlog主题文件构成:

  1. header.php篇
  2. <?php /*
  3. Template Name:默认模板
  4.    模板名称
  5. Description:默认模板,简洁优雅 ……
  6.    模板简介
  7. Version:1.2
  8.    模板版本号
  9. Author:emlog
  10.    模板作者名称
  11. Author Url:http://www.emlog.net
  12.    模板作者链接地址
  13. Sidebar Amount:1
  14.    边栏数目(一般是0,1或者20代表是没有边栏即单栏模板,1代表1个边栏即二栏模板,2代表2个边栏即三栏模板)
  15. ForEmlog:5.0.0
  16.    emlog程序版本号
  17. */
  18. if(!defined('em_ROOT')) {exit('error!');}
  19.    模板文件开头的判断语句检查是否是函数em_ROOT的绝对地址,否就显示error
  20. require_once View::getView('module');
  21.    公共模块加载项,加载module,这里面包含了模板必须要的函数
  22. ?>
  23. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  24.    声明文件,声明了文档的根元素是 html,它在公共标识符被定义为 "-//W3C//DTD XHTML 1.0 Strict//EN" 的 DTD 中进行了定义浏览器将明白如何寻找匹配此公共标识符的 DTD如果找不到,浏览器将使用公共标识符后面的 URL 作为寻找 DTD 的位置
  25. <html xmlns="http://www.w3.org/1999/xhtml">
  26. <head>
  27. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  28.    meta原标记,这里标记了为UTF-8格式
  29. <title><?php echo $site_title; ?></title>
  30.    页面的title标记,这里输出的是博客名称
  31. <meta name="keywords" content="<?php echo $site_key; ?>" />
  32.    meta原标记,这里标记的是关键词输出博客后台设置的关键词
  33. <meta name="description" content="<?php echo $site_description; ?>" />
  34.    meta原标记,这里标记的是网站简介信息这里输出的是博客后台设置的站点描述在日志内容页面的时候输出的是日志的摘要
  35. <meta name="generator" content="emlog" />
  36.    meta原标记,这里标记的是系统名称,这里输出的是emlog
  37. <link rel="EditURI" type="application/rsd+xml" title="RSD" href="<?php echo BLOG_URL; ?>xmlrpc.php?rsd" />
  38. <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="<?php echo BLOG_URL; ?>wlwmanifest.xml" />
  39.       这两个元素主要供远程发布使用,比如你使用Windows Live Write等桌面博客编辑器来发布文章
  40. <link rel="alternate" type="application/rss+xml" title="RSS"  href="<?php echo BLOG_URL; ?>rss.php" />
  41.    这里是emlog博客的RSS发布地址
  42. <link href="<?php echo TEMPLATE_URL; ?>main.css" rel="stylesheet" type="text/css" />
  43.    CSS加载链接,这里加载的是main.css样式文件该文件存放在模板文件夹的根目录下
  44. <script src="<?php echo BLOG_URL; ?>include/lib/js/common_tpl.js" type="text/javascript"></script>
  45.    JS文件加载链接,这里加载的是common_tpl.js文件该文件存放于程序include/lib/js/目录下,这个JS文件主要用于镶套评论
  46. <?php doAction('index_head'); ?>
  47. 页面头部插件挂载钩子(主要用于插件挂载一些CSS或者JS文件)
  48. </head>
  49. heder头部文件到此结束,上面部分一般是不用修改在移植模板或者制作模板的时候,样式文件是必须要修改加载的如果有特效的话,也要在这里加载一些JS文件的当然也可以在底部加载
  50. <body>
  51. <p id="wrap">
  52.   <p id="header">
  53.     <h1><a href="<?php echo BLOG_URL; ?>"><?php echo $blogname; ?></a></h1>
  54. 站点名称 站点链接
  55.     <h3><?php echo $bloginfo; ?></h3>
  56. 输出博客描述,输出的是后台设置的博客描述信息
  57.   </p>
  58.   <p id="banner"><a href="<?php echo BLOG_URL; ?>"><img src="<?php echo BLOG_URL.Option::get('topimg'); ?>" height="134" width="960" /></a></p>
  59. 这里是页面头部的banner图片,这个只有在默认模板才有不用理会,直接删除就行
  60.   <p id="nav"><?php blog_navi();?></p>
  61.         页面头部导航菜单加函数该函数位于module.php文件,这个是emlog5.0新增加的与以往版本的区别
  62.         log_list.php篇       <?php
  63. /*
  64. * 首页日志列表部分
  65. */
  66. if(!defined('em_ROOT')) {exit('error!');}
  67. ?>
  68. 注释文件头,表明是日志列表页面
  69. 模板文件开头的判断语句检查是否是函数em_ROOT的绝对地址,否就显示error
  70. <p id="content">
  71. <p id="contentleft">
  72. <?php doAction('index_loglist_top'); ?>
  73. 日志列表页的插件钩子,加载插件所需要的文件如:em_ad插件,RSS订阅插件等
  74. <?php foreach($logs as $value): ?>
  75. 日志列表页面列表循环开始大体意思是设置变量$logs$value
  76.     <h2><?php topflg($value['top']); ?>
  77. 置顶日志输出函数,该函数位于module.php文件主要用于置顶日志的显示图标,或者可以更改module.php文件显示【推荐】之类的效果
  78. <a href="<?php echo $value['log_url']; ?>"><?php echo $value['log_title']; ?></a>
  79. 带超链接的日志标题
  80. </h2>
  81.     <p class="date">作者:<?php blog_author($value['author']); ?>
  82. 作者名称的输出函数,该函数位于module.php文件
  83.  发布于:<?php echo gmdate('Y-n-j G:i l', $value['date']); ?>
  84. 日志日期的输出函数,该函数位于系统核心一般不需要改动,如果想显示不同样式的日期格式,可以百度下PHP日期代码
  85.     <?php blog_sort($value['logid']); ?>
  86. 日志分类的输出函数,该函数位于module.php文件
  87.     <?php editflg($value['logid'],$value['author']); ?>
  88. 日志编辑函数,该函数位于module.php文件
  89.     </p>
  90.     <?php echo $value['log_description']; ?>
  91. 日志摘要输出变量,该变量位于系统核心
  92.     <p class="tag"><?php blog_tag($value['logid']); ?>
  93. 日志标签输出函数,该函数位于module.php文件
  94. </p>
  95.     <p class="count">
  96.     <a href="<?php echo $value['log_url']; ?>#comments">评论(<?php echo $value['comnum']; ?>)</a>
  97. 带评论地址超链接的评论数量点击该地址可以到该日志的评论列表
  98.     <a href="<?php echo $value['log_url']; ?>#tb">引用(<?php echo $value['tbcount']; ?>)</a>
  99. 带引用超链接地址的引用数量点击该地址可以到引用通告地址显示页面
  100.     <a href="<?php echo $value['log_url']; ?>">浏览(<?php echo $value['views']; ?>)</a>
  101. 带日志超链接的浏览数量点击该地址可以到该日志页面
  102.     </p>
  103.     <p style="clear:both;"></p>
  104. <?php endforeach; ?>
  105. 日志列表页面的日志列表循环结束
  106. <p id="pagenavi">
  107.     <?php echo $page_url;?>
  108. 日志列表分页函数,该函数位于系统核心
  109. </p>
  110. </p><!-- end #contentleft-->
  111. <?php
  112.  include View::getView('side');
  113. 加载side.php文件,即加载边栏(如果是单栏模板不用加载该文件)
  114.  include View::getView('footer');
  115. 加载footer.php文件,即加载页面底部(一般显示的是版权,统计代码之类,放在通用底部的代码)
  116. ?>
  117. echo_log.php篇
  118. <?php
  119. /*
  120. * 阅读日志页面
  121. */
  122. if(!defined('em_ROOT')) {exit('error!');}
  123. ?>
  124. 注释文件头,表明是阅读日志页面
  125. 模板文件开头的判断语句检查是否是函数em_ROOT的绝对地址,否就显示error
  126. <p id="content">
  127. <p id="contentleft">
  128.     <h2><?php topflg($top); ?>
  129. 置顶日志输出函数,该函数位于module.php文件主要用于置顶日志的显示图标,或者可以更改module.php文件显示【推荐】之类的效果(和list_log.php的函数为同一个函数)
  130. <?php echo $log_title; ?>
  131. 日志标题的输出变量该变量位于系统核心
  132. </h2>
  133.     <p class="date">作者:
  134. <?php blog_author($author); ?>
  135. 作者名称的输出函数,该函数位于module.php文件
  136.  发布于:<?php echo gmdate('Y-n-j G:i l', $date); ?>
  137. 日志日期的输出函数,该函数位于系统核心一般不需要改动,如果想显示不同样式的日期格式,可以百度下PHP日期代码
  138.     <?php blog_sort($logid); ?>
  139. 日志分类的输出函数,该函数位于module.php文件
  140.  <?php editflg($logid,$author); ?>
  141. 日志编辑函数,该函数位于module.php文件
  142.     </p>
  143.     <?php echo $log_content; ?>
  144. 日志文章内容的输出变量该变量位于系统核心
  145.     <p class="tag">
  146. <?php blog_tag($logid); ?>
  147. 日志标签的输出函数该函数位于module.php文件
  148. </p>
  149.     <?php doAction('log_related', $logData); ?>
  150. 日志阅读内容页面的插件钩子主要加载插件文件如:相关日志插件,心情顶踩插件,日志顶踩插件之类
  151.     <p class="nextlog">
  152. <?php neighbor_log($neighborLog); ?>
  153. 上一篇 下一篇列表输出函数,该函数位于module.php文件
  154. </p>
  155.     <?php blog_trackback($tb$tb_url$allow_tb); ?>
  156. 引用通告地址显示函数,该函数位于module.php文件(注意:请百度下引用通告的意思这里只要显示引用通告的地址就可以了,不用做超链接的)
  157.     <?php blog_comments($comments); ?>
  158. 评论列表输出函数,该函数位于module.php文件,后期舞城会详细介绍
  159.     <?php blog_comments_post($logid,$ckname,$ckmail,$ckurl,$verifyCode,$allow_remark); ?>
  160. 评论表单输出函数,该函数位于module.php文件,后期舞城会详细介绍
  161.     <p style="clear:both;"></p>
  162. </p><!--end #contentleft-->
  163. <?php
  164.  include View::getView('side');
  165. 加载side.php文件,即加载边栏(如果是单栏模板不用加载该文件)
  166.  include View::getView('footer');
  167. 加载footer.php文件,即加载页面底部(一般显示的是版权,统计代码之类,放在通用底部的代码)
  168. ?>
  169. page.php篇
  170. <?php
  171. /*
  172. * 自建页面模板
  173. */
  174. if(!defined('em_ROOT')) {exit('error!');}
  175. ?>
  176. <p id="content">
  177. <p id="contentleft">
  178.     <h2><?php echo $log_title; ?>
  179. 自建页面的标题输出,该变量位于系统核心
  180. </h2>
  181.     <?php echo $log_content; ?>
  182. 自建页面的内容输出,该变量位于系统核心
  183.     <?php blog_comments($comments); ?>
  184. 评论列表
  185.     <?php blog_comments_post($logid,$ckname,$ckmail,$ckurl,$verifyCode,$allow_remark); ?>
  186. 评论表单
  187.     <p style="clear:both;"></p>
  188. </p><!--end #contentleft-->
  189. <?php
  190.  include View::getView('side');
  191. side.php文件加载即加载边栏
  192.  include View::getView('footer');
  193. footer.php文件加载,即加载通用底部
  194. ?>
  195. side.php&footer.php 篇
  196. <?php
  197. /*
  198. * 侧边栏
  199. */
  200. if(!defined('em_ROOT')) {exit('error!');}
  201. ?>
  202. <ul id="sidebar">
  203. 从这里开始
  204. <?php
  205. $widgets = !emptyempty(
  206. $options_cache['widgets1']) ? unserialize(
  207. $options_cache['widgets1']) : array();
  208. doAction('diff_side');
  209. 边栏的插件钩子,主要用于加载插件的文件
  210. foreach ($widgets as $val)
  211. {
  212.     $widget_title = @unserialize($options_cache['widget_title']);
  213.     $custom_widget = @unserialize($options_cache['custom_widget']);
  214.     if(strpos($val, 'custom_wg_') === 0)
  215.     {
  216.         $callback = 'widget_custom_text';
  217.         if(function_exists($callback))
  218.         {
  219.             call_user_func(
  220. $callback, htmlspecialchars(
  221. $custom_widget[$val]['title']),
  222. $custom_widget[$val]['content']);
  223.         }
  224.     }else{
  225.         $callback = 'widget_'.$val;
  226.         if(function_exists($callback))
  227.         {
  228.             preg_match("/^.*\s\((.*)\)/"$widget_title[$val], $matchs);
  229.             $wgTitle = isset($matchs[1]) ? $matchs[1] : $widget_title[$val];
  230.             call_user_func($callback, htmlspecialchars($wgTitle));
  231.         }
  232.     }
  233. }
  234. ?>
  235. 到这里以上的所有代码都不用修改,这些主要是用于加载边栏组件其函数位于module.php文件
  236. <p class="rss">
  237. <a href="<?php echo BLOG_URL; ?>rss.php" title="RSS订阅"><img src="<?php echo TEMPLATE_URL; ?>images/rss.gif" alt="订阅Rss"/></a>
  238. 含有RSS订阅链接的图片超链接
  239. </p>
  240. </ul><!--end #siderbar-->
  241. side.php文件基本上是不用动的,如果是单栏模板的话,这个页面就可以删除掉
  242. 下面是footer.php文件
  243. <?php
  244. /*
  245. * 底部信息
  246. */
  247. if(!defined('em_ROOT')) {exit('error!');}
  248. ?>
  249. </p><!--end #content-->
  250. <p style="clear:both;"></p>
  251. <p id="footerbar">
  252. Powered by <a href="http://www.emlog.net" title="emlog <?php echo Option::em_VERSION;?>">emlog</a>
  253. emlog程序官网超链接,title显示的是emlog版本号请支持国产开源的emlog程序,保留他们的版权
  254. <a href="http://www.miibeian.gov.cn" target="_blank"><?php echo $icp; ?></a>
  255. 带有超链接的备案号备案号是在后台设置的
  256.  <?php echo $footer_info; ?>
  257. 页面底部信息输出变量,可以在后台设置可以添加统计代码等信息
  258. <?php doAction('index_footer'); ?>
  259. </p><!--end #footerbar-->
  260. </p><!--end #wrap-->
  261. </body>
  262. </html>
  263.     module.php篇
  264.     <?php
  265. /*
  266. * 侧边栏组件、页面模块
  267. */
  268. if(!defined('em_ROOT')) {exit('error!');}
  269. ?>
  270. <?php
  271. //widget:blogger
  272. 边栏blogger组件
  273. function widget_blogger($title){
  274.     global $CACHE;
  275.     $user_cache = $CACHE->readCache('user');
  276.     $name = $user_cache[1]['mail'] != '' ? "<a href=\"mailto:".$user_cache[1]['mail']."\">"
  277. .$user_cache[1]['name']."</a>" : $user_cache[1]['name'];?>
  278. 读取blogger缓存
  279.     <li>
  280.     <h3><span><?php echo $title; ?></span></h3>
  281.     <ul id="bloggerinfo">
  282.     <p id="bloggerinfoimg">
  283.     <?php if (!emptyempty($user_cache[1]['photo']['src'])): ?>
  284. 如果有用户图片,就显示用户图片
  285.     <img src="<?php echo BLOG_URL.$user_cache[1]['photo']['src']; ?>"
  286. width="<?php echo $user_cache[1]['photo']['width']; ?>"
  287. height="<?php echo $user_cache[1]['photo']['height']; ?>" alt="blogger" />
  288. 显示用户图片
  289.     <?php endif;?>
  290.     </p>
  291.     <p><b>
  292. <?php echo $name; ?>
  293. 输出用户名称
  294. </b>
  295.     <?php echo $user_cache[1]['des']; ?>
  296. 输出用户的个人描述
  297. </p>
  298.     </ul>
  299.     </li>
  300. <?php }?>
  301. <?php
  302. //widget:日历
  303. 边栏日历组件
  304. function widget_calendar($title){ ?>
  305.     <li>
  306.     <h3><span><?php echo $title; ?></span></h3>
  307.     <p id="calendar">
  308.     </p>
  309. 这个id="calendar"千万别删除哦是日历的显示样式
  310.     <script>sendinfo('<?php echo Calendar::url(); ?>','calendar');</script>
  311. 有文章的日历项链接
  312.     </li>
  313. <?php }?>
  314. <?php
  315. //widget:标签
  316. 边栏标签组件
  317. function widget_tag($title){
  318.     global $CACHE;
  319.     $tag_cache = $CACHE->readCache('tags');?>
  320. 读取标签缓存
  321.     <li>
  322.     <h3><span><?php echo $title; ?></span></h3>
  323.     <ul id="blogtags">
  324.     <?php foreach($tag_cache as $value): ?>
  325. 标签循环开始
  326.         <span style="font-size:<?php echo $value['fontsize']; ?>pt; line-height:30px;">
  327. 标签字体大小样式,根据该标签文章数量来决定大小
  328.         <a href="<?php echo Url::tag($value['tagurl']); ?>"
  329. title="<?php echo $value['usenum']; ?> 篇日志"><?php echo $value['tagname']; ?></a>
  330. 带超链接的标签
  331. </span>
  332.     <?php endforeach; ?>
  333. 标签循环结束
  334.     </ul>
  335.     </li>
  336. <?php }?>
  337. <?php
  338. //widget:分类
  339. 边栏 分类 组件
  340. function widget_sort($title){
  341.     global $CACHE;
  342.     $sort_cache = $CACHE->readCache('sort'); ?>
  343. 读取分类缓存
  344.     <li>
  345.     <h3><span><?php echo $title; ?></span></h3>
  346.     <ul id="blogsort">
  347.     <?php foreach($sort_cache as $value): ?>
  348. 分类循环开始
  349.     <li>
  350.     <a href="<?php echo Url::sort($value['sid']); ?>">
  351. <?php echo $value['sortname']; ?>(<?php echo $value['lognum'] ?>)
  352. </a>
  353. 带分类超链接的分类名称+该分类日志数量
  354.     <a href="<?php echo BLOG_URL; ?>rss.php?sort=<?php echo $value['sid']; ?>">
  355. <img src="<?php echo TEMPLATE_URL; ?>images/rss.png" alt="订阅该分类"/>
  356. </a>
  357. 带分类订阅链接的RSS图片(位于该分类的名称后面)
  358.     </li>
  359.     <?php endforeach; ?>
  360. 分类循环结束
  361.     </ul>
  362.     </li>
  363. <?php }?>
  364. <?php
  365. //widget:最新碎语
  366. 边栏 最新碎语 组件
  367. function widget_twitter($title){
  368.     global $CACHE;
  369.     $newtws_cache = $CACHE->readCache('newtw');
  370.     $istwitter = Option::get('istwitter');
  371.     ?>
  372. 读取最新碎语缓存
  373.     <li>
  374.     <h3><span><?php echo $title; ?></span></h3>
  375.     <ul id="twitter">
  376.     <?php foreach($newtws_cache as $value): ?>
  377. 最新碎语循环开始
  378.     <?php $img = emptyempty($value['img']) ? "" :
  379. '<a title="查看图片" class="t_img" href="'.BLOG_URL.str_replace('thum-', '', $value['img']).'" target="_blank">&nbsp;</a>';?>
  380. 这个是emlog5.0新增加的功能,碎语图片功能设置变量$img的图片地址
  381.     <li><?php echo $value['t']; ?><?php echo $img;?><p><?php echo smartDate($value['date']); ?></p>
  382. 输出碎语(文字+图片) 发布碎语的时间
  383. </li>
  384.     <?php endforeach; ?>
  385. 最新碎语循环结束
  386.     <?php if ($istwitter == 'y') :?>
  387.     <p><a href="<?php echo BLOG_URL . 't/'; ?>">更多&raquo;</a></p>
  388.     <?php endif;?>
  389. 判断是否开启碎语,开启的话显示带碎语页面超链接的更多字样
  390.     </ul>
  391.     </li>
  392. <?php }?>
  393. <?php
  394. //widget:最新评论
  395. 边栏 最新评论 组件
  396. function widget_newcomm($title){
  397.     global $CACHE;
  398.     $com_cache = $CACHE->readCache('comment');
  399.     ?>
  400. 读取最新评论缓存
  401.     <li>
  402.     <h3><span><?php echo $title; ?></span></h3>
  403.     <ul id="newcomment">
  404.     <?php
  405.     foreach($com_cache as $value):
  406. 最新评论循环开始
  407.     $url = Url::comment($value['gid'], $value['page'], $value['cid']);
  408. 设置变量$url为评论的链接地址
  409.     ?>
  410.     <li id="comment"><?php echo $value['name']; ?>
  411. 输出评论者的名称
  412.     <br />
  413. <a href="<?php echo $url; ?>"><?php echo $value['content']; ?></a>
  414. 带评论超链接的评论内容
  415. </li>
  416.     <?php endforeach; ?>
  417. 最新评论循环结束
  418.     </ul>
  419.     </li>
  420. <?php }?>
  421. <?php
  422. //widget:最新日志
  423. 边栏 最新日志 组件
  424. function widget_newlog($title){
  425.     global $CACHE;
  426.     $newLogs_cache = $CACHE->readCache('newlog');
  427.     ?>
  428. 读取最新日志缓存
  429.     <li>
  430.     <h3><span><?php echo $title; ?></span></h3>
  431.     <ul id="newlog">
  432.     <?php foreach($newLogs_cache as $value): ?>
  433. 最新日志循环开始
  434.     <li>
  435. <a href="<?php echo Url::log($value['gid']); ?>"><?php echo $value['title']; ?></a>
  436. 带日志超链接的日志标题
  437. </li>
  438.     <?php endforeach; ?>
  439. 最新日志循环结束
  440.     </ul>
  441.     </li>
  442. <?php }?>
  443. <?php
  444. //widget:热门日志
  445. 边栏 热门日志 组件
  446. function widget_hotlog($title){
  447.     $index_hotlognum = Option::get('index_hotlognum');
  448.     $Log_Model = new Log_Model();
  449.     $randLogs = $Log_Model->getHotLog($index_hotlognum);?>
  450. 读取热门日志设置
  451.     <li>
  452.     <h3><span><?php echo $title; ?></span></h3>
  453.     <ul id="hotlog">
  454.     <?php foreach($randLogs as $value): ?>
  455. 热门日志循环开始
  456.     <li>
  457. <a href="<?php echo Url::log($value['gid']); ?>"><?php echo $value['title']; ?></a>
  458. 带日志超链接的日志标题
  459. </li>
  460.     <?php endforeach; ?>
  461. 热门日志循环结束
  462.     </ul>
  463.     </li>
  464. <?php }?>
  465. <?php
  466. //widget:随机日志
  467. 边栏 随机日志 组件
  468. function widget_random_log($title){
  469.     $index_randlognum = Option::get('index_randlognum');
  470.     $Log_Model = new Log_Model();
  471.     $randLogs = $Log_Model->getRandLog($index_randlognum);?>
  472. 读取随机日志设置
  473.     <li>
  474.     <h3><span><?php echo $title; ?></span></h3>
  475.     <ul id="randlog">
  476.     <?php foreach($randLogs as $value): ?>
  477. 随机日志循环开始
  478.     <li>
  479. <a href="<?php echo Url::log($value['gid']); ?>"><?php echo $value['title']; ?></a>
  480. 带日志超链接的日志标题
  481. </li>
  482.     <?php endforeach; ?>
  483. 随机日志循环结束
  484.     </ul>
  485.     </li>
  486. <?php }?>
  487. <?php
  488. //widget:搜索
  489. 边栏 搜索 组件
  490. function widget_search($title){ ?>
  491.     <li>
  492.     <h3><span><?php echo $title; ?></span></h3>
  493.     <ul id="logserch">
  494.     <form name="keyform" method="get" action="<?php echo BLOG_URL; ?>index.php">
  495.     <input name="keyword" class="search" type="text" />
  496.     </form>
  497. from内的name method和action不要更改,搜索功能就不会出错
  498.     </ul>
  499.     </li>
  500. <?php } ?>
  501. <?php
  502. //widget:归档
  503. 边栏 归档 组件
  504. function widget_archive($title){
  505.     global $CACHE;
  506.     $record_cache = $CACHE->readCache('record');
  507.     ?>
  508. 读取归档缓存
  509.     <li>
  510.     <h3><span><?php echo $title; ?></span></h3>
  511.     <ul id="record">
  512.     <?php foreach($record_cache as $value): ?>
  513. 归档循环开始
  514.     <li>
  515. <a href="<?php echo Url::record($value['date']); ?>">
  516. <?php echo $value['record']; ?>(<?php echo $value['lognum']; ?>)
  517. </a>
  518. 带归档时间超链接的归档时间
  519. </li>
  520.     <?php endforeach; ?>
  521. 归档循环结束
  522.     </ul>
  523.     </li>
  524. <?php } ?>
  525. <?php
  526. //widget:自定义组件
  527. 边栏 自定义 组件
  528. function widget_custom_text($title$content){ ?>
  529.     <li>
  530.     <h3><span><?php echo $title; ?></span></h3>
  531.     <ul>
  532.     <?php echo $content; ?>
  533. 输出用户设置的自定义代码
  534.     </ul>
  535.     </li>
  536. <?php } ?>
  537. <?php
  538. //widget:链接
  539. 边栏 链接 组件
  540. function widget_link($title){
  541.     global $CACHE;
  542.     $link_cache = $CACHE->readCache('link');
  543.     ?>
  544. 读取链接缓存
  545.     <li>
  546.     <h3><span><?php echo $title; ?></span></h3>
  547.     <ul id="link">
  548.     <?php foreach($link_cache as $value): ?>
  549. 链接循环开始
  550.     <li>
  551. <a href="<?php echo $value['url']; ?>" title="<?php echo $value['des']; ?>" target="_blank">
  552. <?php echo $value['link']; ?>
  553. </a>
  554. 带链接站点超链接的链接名称
  555. </li>
  556.     <?php endforeach; ?>
  557. 链接循环结束
  558.     </ul>
  559.     </li>
  560. <?php }?>
  561. 中篇
  562. <?php
  563. //blog:导航
  564. 页面顶部的导航函数
  565. function blog_navi(){
  566.    global $CACHE;
  567.    $navi_cache = $CACHE->readCache('navi');
  568.    ?>
  569. 读取导航缓存
  570.    <ul>
  571.    <?php
  572.    foreach($navi_cache as $value):
  573. 导航循环开始
  574.        if($value['url'] == 'admin' && (ROLE == 'admin' || ROLE == 'writer')):
  575.            ?>
  576.            <li class="common"><a href="<?php echo BLOG_URL; ?>admin/write_log.php">写日志</a></li>
  577.            <li class="common"><a href="<?php echo BLOG_URL; ?>admin/">管理站点</a></li>
  578.            <li class="common"><a href="<?php echo BLOG_URL; ?>admin/?action=logout">退出</a></li>
  579.            <?php
  580.            continue;
  581.        endif;
  582. 判断是否是管理员登陆,是就显示管理员相关功能链接
  583.        $newtab = $value['newtab'] == 'y' ? 'target="_blank"' : '';
  584.        $value['url'] = $value['isdefault'] == 'y' ? BLOG_URL . $value['url'] : trim($value['url'], '/');
  585.        $current_tab = (BLOG_URL . trim(Dispatcher::setPath(), '/') == $value['url']) ? 'current' : 'common';
  586.        ?>
  587. 设置相关变量,不需要改动$newtab (是否是新窗口打开,后台设置) $value['url'] (导航链接) $current_tab(导航的class类,当前页面的类为current,非当前页的类为common)
  588.        <li class="<?php echo $current_tab;?>"><a href="<?php echo $value['url']; ?>" <?php echo $newtab;?>><?php echo $value['naviname']; ?></a></li>
  589. 输出带导航地址超链接的导航名称
  590.    <?php endforeach; ?>
  591. 导航循环结束
  592.    </ul>
  593. <?php }?>
  594. <?php
  595. //blog:置顶
  596. function topflg($istop){
  597.    $topflg = $istop == 'y' ? "<img src=\"".TEMPLATE_URL."/images/import.gif\" title=\"置顶日志\" /> " : '';
  598.    echo $topflg;
  599. }
  600. ?>
  601. 置顶日志函数,主要用于log_list.php echo_log.php文件
  602. <?php
  603. //blog:编辑
  604. function editflg($logid,$author){
  605.    $editflg = ROLE == 'admin' || $author == UID ? '<a href="'.BLOG_URL.'admin/write_log.php?action=edit&gid='.$logid.'">编辑</a>' : '';
  606.    echo $editflg;
  607. }
  608. ?>
  609. 日志编辑函数,主要用于echo_log.php page.php文件,也可以用在log_list.php文件
  610. <?php
  611. //blog:分类
  612. function blog_sort($blogid){
  613.    global $CACHE;
  614.    $log_cache_sort = $CACHE->readCache('logsort');
  615.    ?>
  616.    <?php if(!emptyempty($log_cache_sort[$blogid])): ?>
  617.    分类:<a href="<?php echo Url::sort($log_cache_sort[$blogid]['id']); ?>"><?php echo $log_cache_sort[$blogid]['name'];?></a>
  618.    <?php endif;?>
  619. <?php }?>
  620. 日志分类函数,主要用于echo_log.php文件,也可以用在log_list.php文件
  621. <?php
  622. //blog:日志标签
  623. function blog_tag($blogid){
  624.    global $CACHE;
  625.    $log_cache_tags = $CACHE->readCache('logtags');
  626.    if (!emptyempty($log_cache_tags[$blogid])){
  627.        $tag = '标签:';
  628.        foreach ($log_cache_tags[$blogidas $value){
  629.            $tag .= "    <a href=\"".Url::tag($value['tagurl'])."\">".$value['tagname'].'</a>';
  630.        }
  631.        echo $tag;
  632.    }
  633. }
  634. ?>
  635. 日志标签函数,主要用于echo_log.php文件
  636. <?php
  637. //blog:日志作者
  638. function blog_author($uid){
  639.    global $CACHE;
  640.    $user_cache = $CACHE->readCache('user');
  641.    $author = $user_cache[$uid]['name'];
  642.    $mail = $user_cache[$uid]['mail'];
  643.    $des = $user_cache[$uid]['des'];
  644.    $title = !emptyempty($mail) || !emptyempty($des) ? "title=\"$des $mail\"" : '';
  645.    echo '<a href="'.Url::author($uid)."\" $title>$author</a>";
  646. }
  647. ?>
  648. 日志作者函数,主要用于echo_log.php文件
  649. <?php
  650. //blog:相邻日志
  651. function neighbor_log($neighborLog){
  652.    extract($neighborLog);?>
  653.    <?php if($prevLog):?>
  654.    &laquo; <a href="<?php echo Url::log($prevLog['gid']) ?>"><?php echo $prevLog['title'];?></a>
  655.    <?php endif;?>
  656.    <?php if($nextLog && $prevLog):?>
  657.        |
  658.    <?php endif;?>
  659.    <?php if($nextLog):?>
  660.         <a href="<?php echo Url::log($nextLog['gid']) ?>"><?php echo $nextLog['title'];?></a>&raquo;
  661.    <?php endif;?>
  662. <?php }?>
  663. 相邻日志函数(即上一篇 下一篇),主要用于echo_log.php文件
  664. <?php
  665. //blog:引用通告
  666. function blog_trackback($tb$tb_url$allow_tb){
  667.    if($allow_tb == 'y' && Option::get('istrackback') == 'y'):?>
  668.    <p id="trackback_address">
  669.    <p>引用地址: <input type="text" style="width:350px" class="input" value="<?php echo $tb_url; ?>">
  670.    <a name="tb"></a></p>
  671.    </p>
  672.    <?php endif; ?>
  673.    <?php foreach($tb as $key=>$value):?>
  674.        <ul id="trackback">
  675.        <li><a href="<?php echo $value['url'];?>" target="_blank"><?php echo $value['title'];?></a></li>
  676.        <li>BLOG: <?php echo $value['blog_name'];?></li><li><?php echo $value['date'];?></li>
  677.        </ul>
  678.    <?php endforeach; ?>
  679. <?php }?>
  680. 引用通告地址函数,主要用于echo_log.php文件
  681.     下篇
  682.     module.php文件中比较重要的评论列表与表单的函数因为在4.0版本开始emlog引入了镶套评论的效果,所以评论列表比以前的也稍微复杂了点如果这里更改了相关的class类与ID的话,也要在common_tpl.js文件更改相关ID(一般建议不要更改ID,不给ID设置相关CSS属性就没问题,不会产生页面变形问题)
  683. <?php
  684. //blog:评论列表
  685. function blog_comments($comments){
  686.    extract($comments);
  687.    if($commentStacks): ?>
  688.    <a name="comments"></a>
  689.    <p class="comment-header"><b>评论:</b></p>
  690.    <?php endif; ?>
  691.    <?php
  692.    $isGravatar = Option::get('isgravatar');
  693.    foreach($commentStacks as $cid):
  694. 评论列表循环开始(注意!)
  695.    $comment = $comments[$cid];
  696.    $comment['poster'] = $comment['url'] ? '<a href="'.$comment['url'].'" target="_blank">'.$comment['poster'].'</a>' :$comment['poster'];
  697.    ?>
  698. 以上为Gravatar头像,地址,内容的相关变量设置,一般无需更改,除了红色字体部分
  699.    <p class="comment" id="comment-<?php echo $comment['cid']; ?>">
  700. 该ID为评论列表的编号ID
  701.        <a name="<?php echo $comment['cid']; ?>"></a>
  702. name为评论列表的编号
  703.        <?php if($isGravatar == 'y'): ?><p class="avatar"><img src="<?php echo getGravatar($comment['mail']); ?>" /></p><?php endif; ?>
  704. 判断Gravatar头像是否开启,开启就显示Gravatar头像
  705.        <p class="comment-info">
  706.            <b>
  707. <?php echo $comment['poster']; ?>
  708. 评论人名称
  709. </b><br /><span class="comment-time">
  710. <?php echo $comment['date']; ?>
  711. 评论时间
  712. </span>
  713.            <p class="comment-content">
  714. <?php echo $comment['content']; ?>
  715. 评论内容
  716. </p>
  717.            <p class="comment-reply">
  718. <a href="#comment-<?php echo $comment['cid']; ?>" onclick="commentReply(<?phpecho $comment['cid']; ?>,this)">回复</a>
  719. 回复该评论的链接
  720. </p>
  721.        </p>
  722.        <?php blog_comments_children($comments$comment['children']); ?>
  723. 子评论列表函数
  724.    </p>
  725.    <?php endforeach; ?>
  726. 评论列表循环结束(注意)
  727.    <p id="pagenavi">
  728.        <?php echo $commentPageUrl;?>
  729. 评论分页输出变量
  730.    </p>
  731. <?php }?>
  732. <?php
  733. //blog:子评论列表
  734. function blog_comments_children($comments$children){
  735.    $isGravatar = Option::get('isgravatar');
  736.    foreach($children as $child):
  737. 子评论列表循环开始
  738.    $comment = $comments[$child];
  739.    $comment['poster'] = $comment['url'] ? '<a href="'.$comment['url'].'" target="_blank">'.$comment['poster'].'</a>' :$comment['poster'];
  740.    ?>
  741. 以上为Gravatar头像,地址,内容的相关变量设置,一般无需更改
  742.    <p class="comment comment-children" id="comment-<?php echo $comment['cid']; ?>">
  743. 该ID为评论列表的编号ID
  744.        <a name="<?php echo $comment['cid']; ?>"></a>
  745. name为评论列表的编号
  746.        <?php if($isGravatar == 'y'): ?><p class="avatar"><img src="<?php echo getGravatar($comment['mail']); ?>" /></p><?php endif; ?>
  747. 判断Gravatar头像是否开启,开启就显示Gravatar头像
  748.        <p class="comment-info">
  749.            <b>
  750. <?php echo $comment['poster']; ?>
  751. 评论人名称
  752.  </b><br /><span class="comment-time">
  753. <?php echo $comment['date']; ?>
  754. 评论时间
  755. </span>
  756.            <p class="comment-content">
  757. <?php echo $comment['content']; ?>
  758. 评论内容
  759. </p>
  760.            <?php if($comment['level'] < 4): ?>
  761. 镶套级数,这里为4级镶套
  762. <p class="comment-reply">
  763. <a href="#comment-<?php echo $comment['cid'];?>" onclick="commentReply(<?php echo $comment['cid']; ?>,this)">回复</a>
  764. 回复该评论的链接
  765. </p><?php endif; ?>
  766. 镶套级数判断结束
  767.        </p>
  768.        <?php blog_comments_children($comments$comment['children']);?>
  769. 子评论列表函数
  770.    </p>
  771.    <?php endforeach; ?>
  772. 子评论列表循环结束
  773. <?php }?>
  774. <?php
  775. //blog:发表评论表单
  776. function blog_comments_post($logid,$ckname,$ckmail,$ckurl,$verifyCode,$allow_remark){
  777.    if($allow_remark == 'y'): ?>
  778.    <p id="comment-place">
  779.    <p class="comment-post" id="comment-post">
  780.        <p class="cancel-reply" id="cancel-reply" style="display:none"><a href="javascript:void(0);" onclick="cancelReply()">取消回复</a></p>
  781.        <p class="comment-header"><b>发表评论:</b><a name="respond"></a></p>
  782.        <form method="post" name="commentform" action="<?php echo BLOG_URL; ?>index.php?action=addcom" id="commentform">
  783.            <input type="hidden" name="gid" value="<?php echo $logid; ?>" />
  784.            <?php if(ROLE == 'visitor'): ?>
  785.            <p>
  786.                <input type="text" name="comname" maxlength="49" value="<?php echo $ckname; ?>" size="22" tabindex="1">
  787.                <label for="author"><small>昵称</small></label>
  788.            </p>
  789.            <p>
  790.                <input type="text" name="commail"  maxlength="128"  value="<?php echo $ckmail; ?>" size="22" tabindex="2">
  791.                <label for="email"><small>邮件地址 (选填)</small></label>
  792.            </p>
  793.            <p>
  794.                <input type="text" name="comurl" maxlength="128"  value="<?php echo $ckurl; ?>" size="22" tabindex="3">
  795.                <label for="url"><small>个人主页 (选填)</small></label>
  796.            </p>
  797.            <?php endif; ?>
  798.            <p><textarea name="comment" id="comment" rows="10" tabindex="4"></textarea></p>
  799.            <p><?php echo $verifyCode; ?> <input type="submit" id="comment_submit" value="发表评论" tabindex="6" /></p>
  800.            <input type="hidden" name="pid" id="comment-pid" value="0" size="22" tabindex="1"/>
  801.        </form>
  802.    </p>
  803.    </p>
  804.    <?php endif; ?>
  805. <?php }?>
  806. 评论表单里面其实没什么好介绍,主要是红色标出的name id之类的别弄错,基本上是没问题的还有就是镶套评论所使用到的ID,要保留如果非要更改也要在common_tpl.js文件更改不懂就留言吧

接下来,是WordPress的主题构成了。

WordPress主题构成:

  1. 主题文件构成
  2. 在开始制作WordPress主题之前,首先得了解WordPress主题到底由哪些文件构成,你得清楚WordPress程序是怎样与主题文件连接的。以下是WordPress默认主题default文件夹下的所有模板文件:看了上图,可能你还摸不着头脑,到底这些文件是干什么的。WordPress的主题是用PHP编写的,而不是纯HTML + CSS,所以模板文件的后缀名是.php,如果你想精通WordPress的主题制作,完美控制你的博客,最好要熟悉PHP编程。要是不会PHP编程怎么办?就做不了WordPress主题了吗?那也不是,至少看完本系列教程,你也能够掌握基本的WordPress主题制作方法。下面是WordPress主题文件层次结构,它会告诉你:当WordPress显示特定的页面类型时,会使用哪个模板文件呢?只有了解了以下主题层次结构,你才能知道你的WordPress主题到底需要写哪些文件。
  3. 主题文件构成|WordPress主题制作全过程
  4. 3
  5. 怎么看下面的文件层次结构?
  6. 以主页为例,下面有2个文件home.php和index.php,WordPress程序会从你的主题文件夹中依
  7. 4
  8. 主页:
  9. 1.home.php
  10. 2.index.php
  11. 5
  12. 文章页:
  13. 1.single-{post_type}.php – 如果文章类型是videos(即视频),WordPress就会去查找single-videos.php(WordPress 3.0及以上版本支持)
  14. 2.single.php
  15. 3.index.php
  16. 6
  17. 页面:
  18. 1.自定义模板 – 在WordPress后台创建页面的地方,右侧边栏可以选择页面的自定义模板
  19. 2.page-{slug}.php – 如果页面的缩略名是news,WordPress将会查找 page-news.php(WordPress 2.9及以上版本支持)
  20. 3.page-{id}.php – 如果页面ID是6,WordPress将会查找page-6.php
  21. 4.page.php
  22. 5.index.php
  23. 7
  24. 分类:
  25. 1.category-{slug}.php – 如果分类的缩略名为news,WordPress将会查找category-news.php(WordPress 2.9及以上版本支持)
  26. 2.category-{id}.php -如果分类ID为6,WordPress将会查找category-6.php
  27. 3.category.php
  28. 4.archive.php
  29. 5.index.php
  30. 8
  31. 标签
  32. 1.tag-{slug}.php – 如果标签缩略名为sometag,WordPress将会查找tag-sometag.php
  33. 2.tag-{id}.php – 如果标签ID为6,WordPress将会查找tag-6.php(WordPress 2.9及以上版本支持)
  34. 3.tag.php
  35. 4.archive.php
  36. 5.index.php
  37. 9
  38. 作者:
  39. 1.author-{nicename}.php – 如果作者的昵称为rami,WordPress将会查找author-rami.php(WordPress 3.0及以上版本支持)
  40. 2.author-{id}.php – 如果作者ID为6,WordPress将会查找author-6.php(WordPress 3.0及以上版本支持)
  41. 3.author.php
  42. 4.archive.php
  43. 5.index.php
  44. 10
  45. 日期页面:
  46. 1.date.php
  47. 2.archive.php
  48. 3.index.php
  49. 11
  50. 搜索结果
  51. 1.search.php
  52. 2.index.php
  53. 12
  54. (未找到)页面
  55. 1.404.php
  56. 2.index.php
  57. 13
  58. 附件页面
  59. 1.MIME_type.php – 可以是任何MIME类型 (image.php, video.php, audio.php, application.php 或者其他).
  60. 2.attachment.php
  61. 3.single.php
  62. 4.index.php
  63. 14
  64. HTML静态模板制作
  65. 制作WordPress需要了解PHP,但是不管怎样,你的博客页面都是一张网页,网页之所以能够在浏览器中显示出来,是因为最终传送给浏览器的是HTML、CSS和JS等终端代码,最终由这些代码控制浏览器的显示结果。制作WordPress主题也不例外,它们都是网页,网页最基本的是HTML。要想制作WordPress主题,首先得设计主题界面,含蓄、简约、厚重、奔放……,风格完全随你,接着再将你的设计理念转化为.html,并能在浏览器中正常显示出来。
  66. 本系列教程不会教你如何去设计博客的界面,也不会教你HTML和CSS基础知识,而是假定你已经有HTML和CSS基础了,如果你不会HTML,也不会CSS,后面的东西恐怕对你来说就像天书了。
  67. 本系列教程将使用由tutsplus无偿提供的html模板Aurelius为例,来讲解WordPress主题的制作过程,其他模板的制作也类似。下面提供该HTML模板文件下载,我们将以此来练习如何将HTML静态页面与PHP代码结合,制作WordPress主题。下载后,里面的html文件都是可以直接双击打开的。
  68. 可能这个模板并不适合每个人的口味,但这个用于我们的主题制作练习已经足够了。另外你可能会诧异,怎么是英文版的?放心,到了后面你就会知道,是否英文版都没多大关系。下面说说下载到的这些文件的用途:
  69. 15
  70. 首页:index.html
  71. 16
  72. 存档页:archive.html
  73. 17
  74. 页面:page.html
  75. 18
  76. 文章页:single.html
  77. 19
  78. 联系页:contact.html
  79. 20
  80. 无边栏页:full_width.html
  81. 21
  82. 图片:/images/
  83. 22
  84. 样式表:style.css
  85. 23
  86. 缩略图:screenshot.png
  87. 大多数博客所能看到的页面类型也基本就这些。你可能已经注意到,不管你用哪个WordPress主题,不同的文章页面除了标题和内容不同以外,其他东西基本都是一样,这就是所谓的模板。
  88. 24
  89. 小试牛刀
  90. 一个WordPress主题至少包含以下两个文件:
  91. 25
  92. style.css
  93. 26
  94. index.php
  95. 好,现在就开始我们的WordPress主题制作。在你的WordPress目录 wp-content\themes\下新建一个文件夹,命名为Aurelius,将WordPress主题制作全过程(三):HTML静态模板制作下载到的style.css和index.html放到该目录下,再将index.html重命名为index.php,这样wp-content\themes\Aurelius目录下就有下面两个文件:
  96. 登陆你的WordPress博客管理后台 – 外观,里面是不是多了一个主题”Aurelius”呢?
  97. 启用该主题,打开你的博客主页,OH,页面一片混乱?怎么搞的?先继续看下文。你可能会很好奇,这个主题的名称可不以改成我要的名字呢、主题作者能不能改成我的名字呢、为什么主题没有小图片预览,下面就教你怎样更改这些”主题信息”。用文本编辑器打开Aurelius目录下的style.css,你可以按照下面的说明尝试在style.css文件最前面添加以下信息,再到WordPress管理后台”外观”栏目下,刷新一下看看有什么变化:
  98. 将WordPress主题制作全过程(三):HTML静态模板制作下载到的screenshot.png放到Aurelius目录下,再到WordPress管理后台”外观”栏目下,看看有什么变化,是不是多了个预览图呢?主题制作完毕后,你可以给你的主题界面截个图,命名为screenshot.png,大小300 * 225,放置到主题目录下作为主题缩略图
  99. 27
  100. /*
  101. Theme Name: 这里填主题名称
  102. Theme URI: 这里填主题介绍的网址,没有就填你的博客网址吧
  103. Description: 这里填主题的简短介绍
  104. Version: 版本号
  105. Author: 作者名
  106. Author URI: 作者的网址
  107. Tags: 标签,多个用半角逗号隔开
  108. */
  109. 28
  110. 制作header.php
  111. 29
  112. 你可以尝试用文本编辑器打开从WordPress主题制作全过程(三):HTML静态模板制作下载到的 .html文件,不知道你有没有发现他们头部的代码都非常的相似呢?其实我们可以提取这部分相似的代码,放到一个单独的文件header.php中,各个页面想用这部分代码的时候再用php的include包含进去,省的每个页面里面都要写这部分代码,更改起来也可以达到一改全改的目的。
  113. 再次提醒:如果你不打算动手编写代码,这个系列教程就别看了,对你无益!
  114. 30
  115. 接着我们上次创建的主题目录wp-content\themes\Aurelius,在该目录下新建一个php文件header.php,我们提取出index.php中的头部代码复制粘贴到header.php中,下面是的代码就是目前header.php中的所有代码了(当然不同主题的头部代码都是不一样,在你实际的项目中可以自定决定):
  116. 31
  117. <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
  118. <html xmlns=”http://www.w3.org/1999/xhtml”>
  119. <head profile=”http://gmpg.org/xfn/11″>
  120. <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
  121. <title>Aurelius | Blog</title>
  122. <!– Stylesheets –>
  123. <link rel=”stylesheet” href=”./style.css” type=”text/css” media=”screen” />
  124. </head>
  125. <body>
  126. <div id=”wrapper” class=”container_12 clearfix”>
  127. <!– Text Logo –>
  128. <h1 id=”logo” class=”grid_4″>Aurelius</h1>
  129. <!– Navigation Menu –>
  130. <ul id=”navigation” class=”grid_8″>
  131. <li><a href=”contact.html”><span class=”meta”>Get in touch</span><br />
  132. Contact Us</a></li>
  133. <li><a href=”blog.html” class=”current”><span class=”meta”>Latest news</span><br />
  134. Blog</a></li>
  135. <li><a href=”index.html”><span class=”meta”>Homepage</span><br />
  136. Home</a></li>
  137. </ul>
  138. <div class=”hr grid_12 clearfix”>&nbsp;</div>
  139. <!– Caption Line –>
  140. <h2 class=”grid_12 caption clearfix”>Our <span>blog</span>, keeping you up-to-date on our latest news.</h2>
  141. <div class=”hr grid_12 clearfix”>&nbsp;</div>
  142. 32
  143. 再用文本编辑器打开index.php、archive.php、contact.php、full_width.php、page.php和single.php,删掉以上类似代码,改成:
  144. 33
  145. <?php get_header(); ?>
  146. 34
  147. 好,现在打开你的测试博客主页,看看我们制作的主题是否还可以正常工作,答案是可以的,跟原来几乎没什么两样,但还是一片混乱。get_header()就相当于将header.php中的代码拷贝到当前的php文件。接下来,我们将仔细探讨header.php中的动态内容。header.php将会被所有的模板页面(主页、分类页、页面、标签页等)所包含,所以header.php中代码应该是动态,适合不同页面的,所以这里面需要用到PHP代码,而不是单纯的HTML。
  148. 35
  149. 下面让我们一起来修改header.php
  150. 1、更改<title>
  151. 我们都知道不同页面的title都是不一样,而且title的设置还会直接影响到SEO的效果,所以这里应该谨慎设置。下面提供一种SEO优化的title写法,将<title>Aurelius | Blog</title>改成:
  152. 以上添加的php代码运用了条件判断,针对不同的页面采用不同title,这里解释一下这几个条件标签。
  153. 36
  154. <title><?php if ( is_home() ) {
  155. bloginfo(‘name’); echo ” – “; bloginfo(‘description’);
  156. elseif ( is_category() ) {
  157. single_cat_title(); echo ” – “; bloginfo(‘name’);
  158. elseif (is_single() || is_page() ) {
  159. single_post_title();
  160. elseif (is_search() ) {
  161. echo “搜索结果”; echo ” – “; bloginfo(‘name’);
  162. elseif (is_404() ) {
  163. echo ‘页面未找到!’;
  164. else {
  165. wp_title(”,true);
  166. } ?></title>
  167. 37
  168. is_home() :当前页面为主页时返回true
  169. 38
  170. is_category():当前页面为分类页时返回true
  171. 39
  172. is_single():当前页面为单文章页时返回true
  173. 40
  174. is_page():当前页面为单页面时返回true
  175. 41
  176. 更详细的内容参阅WordPress文档:条件标签
  177. 到目前为止,可能你对这些条件判断标签还没有深入的认识,也搞不懂到底是用了这些标签会对主题造成怎样的影响的,随着我们教程的进一步深入,你会慢慢理解的。
  178. 2、更改样式表style.css路径
  179. 在此之前你看到的首页都是混乱的,原因是还没加载css样式。现在我们一起把样式加上。你可以在header.php中找到这一段代码:
  180. 聪明的你可能问:wp-content\themes\Aurelius目录下不是已经有一个 style.css吗?那为什么 header.php没有加载css呢?结果你是可以看到的,页面一篇混乱,可以确定确实没有加载到css。因为这是WordPress的主题,是要被WordPress的主程序调用,经过层层解析才能把你的博客显示出来,而不是简简单单的html静态网页文件。正确的改法:
  181. bloginfo('stylesheet_url')输出的是你的主题css文件绝对网址,如http://localhost/wp/wp-content/themes/Aurelius/style.css,WordPress程序会自动识别你的WordPress安装地址,当前启用的主题,自动输出这个style.css链接。现在你可以试着更改一下,然后刷新一下你的博客首页,查看网页源代码,style.css的链接是不是变成你的了?页面是否可以正常显示了呢?
  182. 不过,还有几张图片的路径不对,还不能显示出来,现在我们一起用文本编辑器打开index.php、archive.php、contact.php、full_width.php、page.php和single.php,给这些图片加上正确的URL,搜索代码,将所有的:src="images/,批量替换成src="<?php bloginfo('template_url'); ?>/images/。现在再刷新你的主页,看文章的缩略图610×150是否可以正常显示。<?php bloginfo('template_url'); ?>用于输出主题目录的URL。
  183. 3、添加pingback
  184. 至于什么是pingback,你可以在搜索引擎中输入关键字WordPresspingback,就可以得到你想要的答案了。如果你需要这个功能,可以将在<head>里面添加代码:
  185. 在header.php,下面两行代码用于显示博客名称和描述:
  186. 上面是静态代码,现在做如下修改:
  187. 现在你的博客首页看到的就是你博客名称和描述了,并且logo也是一个链接指向你的博客首页。我们这里说说这些php代码的作用。
  188. 42
  189. <link rel=”stylesheet” href=”./style.css” type=”text/css” media=”screen” />
  190. 43
  191. <link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” media=”screen” />
  192. 44
  193. <link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>” />4、更改博客名称和描述
  194. 45
  195. <h1 id=”logo” class=”grid_4″>Aurelius</h1>
  196. <h2 class=”grid_12 caption clearfix”>Our <span>blog</span>, keeping you up-to-date on our latest news.</h2>
  197. 46
  198. <h1 id=”logo”><a href=”<?php echo get_option(‘home’); ?>/”><?php bloginfo(‘name’); ?></a></h1>
  199. <h2><?php bloginfo(‘description’); ?></h2>
  200. 47
  201. <?php echo get_option('home'); ?>输出你的博客首页网址
  202. 48
  203. <?php bloginfo('name'); ?>输出你的博客名称
  204. 49
  205. <?php bloginfo('description'); ?>输出博客描述
  206. 博客名称和描述可以在WordPress管理后台 – 设置 – 常规那里更改。以后制作你自己的WordPress主题的时候,你可参照上面的说明对你的主题进行修改。
  207. 5、添加订阅feed链接
  208. 相信每个已发布的WordPress博客主题都会提供feed订阅,当然我们的主题也应该提供这样的功能。在</head>之前添加以下代码:
  209. 有些插件需要在网页头部添加一些js或css,要让这些插件能够正常的工作,也让你的主题有更好的兼容性,你应该添加wp_head()函数。打开header.php,在</head>前面添加以下代码即可:
  210. 现在打开你的博客主页,查看源代码,</head>前面是不是多了以下类似代码(这些都是wp_head()的功劳):
  211. 关于添加网页描述和关键字,可以查看我之前写过的文章:WordPress使用经验(一)独立的Description 和 Keywords
  212. 8、显示菜单栏
  213. 目前菜单栏有Home、Blog和Contact Us几个菜单,不过这些都是静态的内容,并不是你博客上的页面。现在我们将菜单栏换成你的菜单,这里只在菜单栏中列出页面page,当然你也可以再放置分类,根据你的喜好来吧,将header.php中:
  214. 改成:
  215. 具体如何在菜单栏显示分类,你可以看这篇文章,有什么问题再给我留言:WordPress 分类做导航栏,并高亮显示
  216. 另外,可以参考这两个函数的说明(英文):
  217. 50
  218. <link rel=”alternate” type=”application/rss+xml” title=”RSS 2.0 – 所有文章” href=”<?php echo get_bloginfo(‘rss2_url’); ?>” />
  219. <link rel=”alternate” type=”application/rss+xml” title=”RSS 2.0 – 所有评论” href=”<?php bloginfo(‘comments_rss2_url’); ?>” />6、添加wp_head
  220. 51
  221. <?php wp_head(); ?>
  222. 52
  223. <link rel=”EditURI” type=”application/rsd+xml” title=”RSD” href=”http://ludou.co.tv/blog/xmlrpc.php?rsd” />
  224. <link rel=”wlwmanifest” type=”application/wlwmanifest+xml” href=”http://ludou.co.tv/blog/wp-includes/wlwmanifest.xml” />
  225. <link rel=’index’ title=’露兜实验室’ href=’http://ludou.co.tv’ />
  226. <meta name=”generator” content=”WordPress 2.9.2″ />7、添加Description 和 Keywords
  227. 53
  228. <ul id=”navigation” class=”grid_8″>
  229. <li><a href=”contact.html”><span class=”meta”>Get in touch</span><br />
  230. Contact Us</a></li>
  231. <li><a href=”blog.html” class=”current”><span class=”meta”>Latest news</span><br />
  232. Blog</a></li>
  233. <li><a href=”index.html”><span class=”meta”>Homepage</span><br />
  234. Home</a></li>
  235. </ul>
  236. 54
  237. <ul id=”navigation”>
  238. <?php wp_list_pages(‘depth=1&title_li=0&sort_column=menu_order’); ?>
  239. <li <?php if (is_home()) { echo ‘class=”current”‘;} ?>><a title=”<?php bloginfo(‘name’); ?>” href=”<?php echo get_option(‘home’); ?>/”>主页</a></li>
  240. </ul>
  241. 55
  242. Template Tags/wp list pages
  243. 56
  244. Template Tags/wp list categories
  245. 9、刷新缓存
  246. 在<body>前面,</head>后面添加PHP代码,用于提高程序运行效率:<?php flush(); ?>
  247. 总结
  248. 好了,本次练习到此结束!现在总结一些今天讲到的比较重要的知识点:
  249. 57
  250. <?php get_header(); ?>从当前主题文件夹中包含header.php文件
  251. 58
  252. is_home(),is_single(),is_category()等几个条件判断标签
  253. <?php bloginfo('stylesheet_url'); ?>输出主题文件夹中style.css文件的路径
  254. <?php bloginfo('pingback_url'); ?>输出博客pingback网址
  255. <?php bloginfo('template_url'); ?>输出博客主题目录URL
  256. <?php echo get_option('home'); ?>输出你的博客首页网址
  257. <?php bloginfo('name'); ?>输出你的博客名称
  258. <?php bloginfo('description'); ?>输出博客描述
  259. <?php wp_head(); ?>用于包含WordPress程序输出头部信息
  260. <?php wp_list_categories(); ?>用于列出博客分类页
  261. <?php wp_list_pages(); ?>用于列出博客页面

 

WordPress基本模板文件
一套完整的WordPress模板应至少具有如下文件:

style.css : CSS(样式表)文件

index.php : 主页模板

archive.php : Archive/Category模板

404.php : Not Found 错误页模板

comments.php : 留言/回复模板

footer.php : Footer模板

header.php : Header模板

sidebar.php : 侧栏模板

page.php : 内容页(Page)模板

single.php : 内容页(Post)模板

searchform.php : 搜索表单模板

search.php : 搜索结果模板

当然,具体到特定的某款模板,可能不止这些文件,但一般而言,这些文件是每套模板所必备的。

基本条件判断Tag

is_home() : 是否为主页

is_single() : 是否为内容页(Post)

is_page() : 是否为内容页(Page)

is_category() : 是否为Category/Archive页

is_tag() : 是否为Tag存档页

is_date() : 是否为指定日期存档页

is_year() : 是否为指定年份存档页

is_month() : 是否为指定月份存档页

is_day() : 是否为指定日存档页

is_time() : 是否为指定时间存档页

is_archive() : 是否为存档页

is_search() : 是否为搜索结果页

is_404() : 是否为 “HTTP 404: Not Found” 错误页

is_paged() : 主页/Category/Archive页是否以多页显示

Header部分常用到的PHP函数

<?php bloginfo(’name’); ?> : 博客名称(Title)

<?php bloginfo(’stylesheet_url’); ?> : CSS文件路径

<?php bloginfo(’pingback_url’); ?> : PingBack Url

<?php bloginfo(’template_url’); ?> : 模板文件路径

<?php bloginfo(’version’); ?> : WordPress版本

<?php bloginfo(’atom_url’); ?> : Atom Url

<?php bloginfo(’rss2_url’); ?> : RSS 2.o Url

<?php bloginfo(’url’); ?> : 博客 Url

<?php bloginfo(’html_type’); ?> : 博客网页Html类型

<?php bloginfo(’charset’); ?> : 博客网页编码

<?php bloginfo(’description’); ?> : 博客描述

<?php wp_title(); ?> : 特定内容页(Post/Page)的标题

模板常用的PHP函数及命令

<?php get_header(); ?> : 调用Header模板

<?php get_sidebar(); ?> : 调用Sidebar模板

<?php get_footer(); ?> : 调用Footer模板

<?php the_content(); ?> : 显示内容(Post/Page)

<?php if(have_posts()) : ?> : 检查是否存在Post/Page

<?php while(have_posts()) : the_post(); ?> : 如果存在Post/Page则予以显示

<?php endwhile; ?> : While 结束

<?php endif; ?> : If 结束

<?php the_time(’字符串’) ?> : 显示时间,时间格式由“字符串”参数决定,具体参考PHP手册

<?php comments_popup_link(); ?> : 正文中的留言链接。如果使用 comments_popup_script() ,则留言会在新窗口中打开,反之,则在当前窗口打开

<?php the_title(); ?> : 内容页(Post/Page)标题

<?php the_permalink() ?> : 内容页(Post/Page) Url

<?php the_category(’, ‘) ?> : 特定内容页(Post/Page)所属Category

<?php the_author(); ?> : 作者

<?php the_ID(); ?> : 特定内容页(Post/Page) ID

<?php edit_post_link(); ?> : 如果用户已登录并具有权限,显示编辑链接

<?php get_links_list(); ?> : 显示Blogroll中的链接

<?php comments_template(); ?> : 调用留言/回复模板

<?php wp_list_pages(); ?> : 显示Page列表

<?php wp_list_categories(); ?> : 显示Categories列表

<?php next_post_link(’ %link ‘); ?> : 下一篇文章链接

<?php previous_post_link(’%link’); ?> : 上一篇文章链接

<?php get_calendar(); ?> : 日历

<?php wp_get_archives() ?> : 显示内容存档

<?php posts_nav_link(); ?> : 导航,显示上一篇/下一篇文章链接

<?php include(TEMPLATEPATH . ‘/文件名’); ?> : 嵌入其他文件,可为定制的模板或其他类型文件
与模板相关的其他函数

<?php _e(’Message’); ?> : 输出相应信息

<?php wp_register(); ?> : 显示注册链接

<?php wp_loginout(); ?> : 显示登录/注销链接

<!–next page–> : 将当前内容分页

<!–more–> : 将当前内容截断,以不在主页/目录页显示全部内容

<?php timer_stop(1); ?> : 网页加载时间(秒)

<?php echo get_num_queries(); ?> : 网页加载查询量

Skill丨WordPress及Emlog主题文件构成分析-V站

好了纯笔记,玩主题的博主必看就是了!