WordPress 主题教程 #15:子模板文件

我爱水煮鱼
我爱水煮鱼
»
专题:WordPress 主题教程
» WordPress 主题教程 http://blog.wpjam.com/m15:子模板文件

WordPress 主题教程 http://blog.wpjam.com/m15:子模板文件

Denis 留言: 17 浏览:28126

文章目录[隐藏]

  • 第1步:archive.php
  • 第2步:search.php
  • 第3步:page.php 和 single.php
  • 第4步:定制 page.php
  • 第5步:定制 single.php
  • 课程回顾

WPJAM TOC

子模板文件是从零开始创建 WordPress 主题系列教程的第十五篇,这篇将和像上一篇创建 header.phpsidebar.phpfooter.php 这些模板文件一样创建更多的子模板文件。

现在 index.php 文件已被拆分,这一切都变得更简单。

第1步:archive.php

在做这步之前,查看你的侧边栏,点击其中的一个存档链接,结果的页面是不是和首页没有什么不同?

  • 创建一个新文件:archive.php
  • index.php 中所有东西复制到 archive.php
  • 保存 archive.php
  • archive.php 文件,把 the_content 改成 the_excerpt
  • 再次保存 archive.php 文件

通过创建一个 archive.php 文件并把它改成和 index.php 不一样,这就是定制化存档页面的外观。

现在如果你刷新你的存档页面,它将只显示摘要而不是全文的日志。

为什么你想这么做呢? &http://blog.wpjam.com/m8212; 防止 Google 以为重复内容惩罚你的博客,如果一个存档页面和首页显示相同的内容,那就是重复的内容。

如果是私人的博客呢?那么就没有必要去区分首页和存档页面。但这并不是说摘要对私人博客没有用。

同样 &http://blog.wpjam.com/m8212; 默认你的类别页面将使用 archive.php 显示内容,如果你没有 archive.php 文件,类别页面将使用 index.php 显示内容。

如果你想类别页面首页存档页面看起来不一样,那么创佳一个 category.php 文件并定制化它。

第2步:search.php

  • 创建一个新文件:search.php
  • archive.php 中所有东西复制到 search.php
  • 保存就完成了。

现在所有的,所有的搜索结果将会返回摘要。如果没有 search.php 这个模板文件,搜索选项将会使用index.php 去显示搜索结果。

(可选)你可以返回到课程1去回顾者层次结构。

第3步:page.phpsingle.php

  • 创建两个新文件:page.phpsingle.php
  • index.php 中所有内容拷贝到 page.phpsingle.php。(从现在开始,页面和单篇日志应该是一样的。)
  • 保存页面和单篇日志文件,关闭它们。

第4步:定制 page.php

还记得静态页面页面之间的不同吗?page.php 模板文件是用来定制化这些特殊静态静态页面。

第一,在 page.php 中的 <?php the_content(); ?> 下输入以下代码:


<?php link_pages(&http://blog.wpjam.com/m039;<p><strong>Pages:</strong>&http://blog.wpjam.com/m039;, &http://blog.wpjam.com/m039;</p>&http://blog.wpjam.com/m039;, &http://blog.wpjam.com/m039;number&http://blog.wpjam.com/m039;); ?>


<?php edit_post_link(&http://blog.wpjam.com/m039;Edit&http://blog.wpjam.com/m039;, &http://blog.wpjam.com/m039;<p>&http://blog.wpjam.com/m039;, &http://blog.wpjam.com/m039;</p>&http://blog.wpjam.com/m039;); ?>

第二,从 page.php 中移除 postmetadata 代码。结果如下:

page-php.gif

第三,在 page.php 中移除 posts_nav_link() 或者导航模块。

remove-navigation.gif

刚才发生了什么

第一行代码是用于显示页面的分页链接。

nextpage.gif

举个例子,编辑 About 页面。根据我的屏幕截图增加代码:

add-nextpage.gif

当你想把一个非常长的页面分成几个页面的时候,这是非常有用的。

第二行代码是用于显示可以用来编辑静态页面的编辑链接。

通常页面是没有分类,并且通常不想给他们显示创建时间,所以需要去移除 postmetadata。同样要移除 posts_nav_link() 代码因为静态页面不会显示后一页前一页的链接。

保存 page.php 文件并关闭它。

第5步:定制 single.php

点击一个日志的标题去阅读日志其余部分就会带你到单篇日志查看模式。single.php 模板就是用于处理查看单篇日志时的外观。

single.php 中的 <?php the_content() ?> 下输入:


<?php link_pages(&http://blog.wpjam.com/m039;<p><strong>Pages:</strong>&http://blog.wpjam.com/m039;, &http://blog.wpjam.com/m039;</p>&http://blog.wpjam.com/m039;, &http://blog.wpjam.com/m039;number&http://blog.wpjam.com/m039;); ?>

是的,这是相同的用于编码页面的分页链接的代码。同样我们也可以把日志分成多篇子日志。

第二,在 postmetadata 区域,移除 <?php comments_popup_link(); ?> 函数和前面的 <br /> 标签。不要移除整个 postmetadata

移除了留言链接函数是因为在单篇日志查看模式下留言链接函数是不起作用,所以要在 singel.php 文件中移除它。只有管理员可见的编辑链接,在 BR 标签的左边。你不想跳过一行才能看到这个本来你可以在右边看到链接?这就是移除 BR 标签的原因。

第三,用以下代码取代 <?php posts_nav_link(); ?>


<?php previous_post_link(&http://blog.wpjam.com/m039;%link&http://blog.wpjam.com/m039;) ?> <?php next_post_link(&http://blog.wpjam.com/m039;%link&http://blog.wpjam.com/m039;) ?>

在前面,存档,分类和搜索页面,我们使用 posts_nav_link() 函数去调用后一页前一页的链接。对于查看单一日志的页面,它是没有后一页和前一页链接的,我们可以使用 previous_post_link()next_post_link() 函数去调用前一篇日志和后一篇日志的链接。

保存 single.php 文件,到某篇日志下查看在导航区域的不同。

课程回顾

  • 创建了四个新的文件或者或者子模板:archive.php(archive-lesson-15.txt),search.php,page.php(page-lesson-15.txt) 和 single.php(single-lesson-15.txt)。
  • archive.phpsearch.php 模板文件是相同的。
  • Pages (和日志不同)是没有分类的,他们同样没有后一页前一页的链接。
  • Single.php 不会显示留言链接(被 comments_popup_link() 函数调用)并且他不用 posts_nav_link() 去调用导航链接。

原文:link

标签:WordPress 主题 WordPress 教程

专题WordPress 主题教程

  • WordPress 主题教程:从零开始制作 WordPress 主题
  • WordPress 主题教程 http://blog.wpjam.com/m1:介绍
  • WordPress 主题教程 http://blog.wpjam.com/m2:模板文件和模板
  • WordPress 主题教程 http://blog.wpjam.com/m3:开始 Index.php
  • WordPress 主题教程 http://blog.wpjam.com/m4a:Header 模板
  • WordPress 主题教程 http://blog.wpjam.com/m4b:Header 模板 2
  • WordPress 主题教程 http://blog.wpjam.com/m5:主循环
  • WordPress 主题教程 http://blog.wpjam.com/m5b:日志内容
  • WordPress 主题教程 http://blog.wpjam.com/m5c:日志元数据
  • WordPress 主题教程 http://blog.wpjam.com/m5d:Else,日志 ID,链接标题
  • WordPress 主题教程 http://blog.wpjam.com/m5e:日志导航链接
  • WordPress 主题教程 http://blog.wpjam.com/m6:侧边栏
  • WordPress 主题教程 http://blog.wpjam.com/m6b:页面链接列表
  • WordPress 主题教程 http://blog.wpjam.com/m6c:存档和链接列表
  • WordPress 主题教程 http://blog.wpjam.com/m6d:搜索框和日历
  • WordPress 主题教程 http://blog.wpjam.com/m6e:窗体化侧边栏
  • WordPress 主题教程 http://blog.wpjam.com/m7:底部
  • WordPress 主题教程 http://blog.wpjam.com/m8:验证 XHTML
  • WordPress 主题教程 http://blog.wpjam.com/m9:Style.css 和 CSS 介绍
  • WordPress 主题教程 http://blog.wpjam.com/m10:十六进制颜色代码和样式化链接
  • WordPress 主题教程 http://blog.wpjam.com/m11:宽度和布局
  • WordPress 主题教程 http://blog.wpjam.com/m12:日志样式化和其他杂项
  • WordPress 主题教程 http://blog.wpjam.com/m13:样式化侧边栏
  • WordPress 主题教程 http://blog.wpjam.com/m14:底部和拆分 Index
  • WordPress 主题教程 http://blog.wpjam.com/m15:子模板文件
  • WordPress 主题教程 http://blog.wpjam.com/m16:留言模板
  • erdaoo 的 WP Theme 教程学习笔记
  • WordPress 主题教程电子书下载
Denis

作者:Denis | 我要投稿

原文链接:WordPress 主题教程 http://blog.wpjam.com/m15:子模板文件

© 我爱水煮鱼,转载请留下原文链接。

本站长期承接 WordPress 项目,详情请 Email:&http://blog.wpjam.com/m100;enis&http://blog.wpjam.com/m64;w&http://blog.wpjam.com/m112;ja&http://blog.wpjam.com/m109;.com。

如有 WordPress 问题,请到 WPJAM 问答提问!

你可能也喜欢

  • WordPress 主题教程电子书下载 WordPress 主题教程电子书下载
  • WordPress 主题教程 http://blog.wpjam.com/m14:底部和拆分 Index WordPress 主题教程 http://blog.wpjam.com/m14:底部和拆分 Index
  • WordPress 主题教程 http://blog.wpjam.com/m13:样式化侧边栏 WordPress 主题教程 http://blog.wpjam.com/m13:样式化侧边栏
  • WordPress 主题教程 http://blog.wpjam.com/m12:日志样式化和其他杂项 WordPress 主题教程 http://blog.wpjam.com/m12:日志样式化和其他杂项
  • WordPress 主题教程 http://blog.wpjam.com/m11:宽度和布局 WordPress 主题教程 http://blog.wpjam.com/m11:宽度和布局
  1. Denis on said:

    这是倒数第二篇,本想今天把最后一篇也翻译,后来发现 small potato的网站在搬家,上不去。反正关注的人也不是很多,不如过几天再翻译,hoho。

    随便说下,这个博客主要是针对 WordPress 和我们喜欢的音乐和电影,可能会扩展下,增加一些网络工具和技巧的介绍,目前主要由我和剑指天下维护,如果有谁有愿意加入和我们说一声。

    • Leko_zhang on said:

      怎么个加入法啊 :smile:

  2. luis on said:

    这一篇看到最头大,而且示例的图片失效了,同时<?php link_pages(’Pages: ‘, ‘’, ‘number’); ?>

    在我本机输入的时候总是报错,中间多了些空格,但删了还是不行,由于没有图片对比,不知道哪里有问题(我对php不熟),请飞猪 更新一下,麻烦了。

    • Denis on said:

      换成英文的单引号

  3. 黑色饼干 on said:

    好多图片看不到呢,我转到http://www.wpdesigner.com/2007/03/16/wp-theme-lesson-15-sub-template-files/去看图片了,呵呵

  4. logkey on said:

    图片的地址写错了吧,应该是fairyfish.net ,却写成了fairyfish.com
    希望改正一下.

  5. digyourlove on said:

    靠!前面都看懂了,到了这篇完全不懂你讲啥子了&http://blog.wpjam.com/m8230;图片一张都出不来,希望有所改进! :twisted:

  6. keeno on said:

    图红叉了啊……

  7. 可可 on said:

    把代码<?php link_pages(&http://blog.wpjam.com/m8216;pages:&http://blog.wpjam.com/m8216;,&http://blog.wpjam.com/m8221;,&http://blog.wpjam.com/m8217;number&http://blog.wpjam.com/m8217;); ?>加入page.php之后,在WP的控制平台上编辑页面时,怎么使用它分页呀,图上说根据截图增加代码,在编辑页面时怎么增加呀,真不明白,赐教了,谢谢 :roll:

    • Denis on said:

      好像是 <&http://blog.wpjam.com/m8211;nextpage&http://blog.wpjam.com/m8211;> 标签吧,具体你搜索下!

  8. frePerl on said:

    到创建archive.php的部分,在IE7中浏览归档或者分类目录时出现边栏掉到底部的现象,firefox中无此问题。仔细检查了所有代码后发现没有问题。
    后来无意中在W3C中校验XHTML文件时出现的警告让我发现了问题所在:我的源文件是以带BOM的UTF-8格式编码,而这样会在一些编辑器与旧浏览器上出现问题,IE7就是这样的问题。
    于是将编码换为UTF-8无BOM的格式,问题立马得到了解决。
    我看原文章的留言有提到遇到这个问题,这里没有,看来多数文件是以ANSI格式编码的。
    这里仅作个提醒。

  9. 漠寒 on said:

    在第四步里
    <?php link_pages(’Pages: ‘, ‘’, ‘number’); ?>
    里的
    应该是

  10. 漠寒 on said:

    我晕,什么都没了,文字里的code应该是strong

  11. HolionY on said:

    第一步最后一行,【创佳】应该是【创建】吧???

  12. flashern on said:

    教程很不错啊 一口气看完了
    只是对这篇里说的归档还不是很理解
    &http://blog.wpjam.com/m8220;存档页面只显示摘要而不是原文&http://blog.wpjam.com/m8221;是什么意思
    &http://blog.wpjam.com/m8220;所有的搜索结果将返回摘要&http://blog.wpjam.com/m8221;又是什么意思呢
    摘要跟原文有什么区别 为什么我照做了 可是存档页面貌似还是显示的日志原文呢?

  13. Amy on said:

    我创建了 archive.php 也按你说的修改了,不过刷新是全文而不是摘要。

  14. 机麻王子 on said:

    第四步里的link_pages函数里strong的应改为code还有在输入!&http://blog.wpjam.com/m8211;nextpage&http://blog.wpjam.com/m8211;标签时应注意在html界面下输入,以免被坑爹,我因为在可视化界面下编辑(蠢!)白忙活了一段时间噗噗!!!

热门文章

七牛云存储 易多云 主机91

快速链接

  • RSS 订阅 / 邮件订阅 / 新浪微博
  • 联系 Denis / 广告投放
  • WordPress 建站专家
  • WPJAM 应用商城

推荐阅读

  • WordPress 主题教程:从零开始制作 WordPress 主题 WordPress 主题教程:从零开始制作 WordPress 主题
  • 使用 WP_Query 而不是 query_posts 自定义 WordPress 主循环 使用 WP_Query 而不是 query_posts 自定义 WordPress 主循环
  • WordPress 主循环和全局变量 WordPress 主循环和全局变量
  • 加速 WordPress 站点的五个基本技巧 加速 WordPress 站点的五个基本技巧
  • 我爱水煮鱼使用的 WordPress 插件 我爱水煮鱼使用的 WordPress 插件

主机推荐

  • 针对 WordPress 的香港主机主机91针对 WordPress 的香港主机
    主机91
  • 最佳美国虚拟主机推荐Bluehost最佳美国虚拟主机推荐
    Bluehost
  • 最专业美国 VPS 主机(mt) Media Temple最专业美国 VPS 主机
    (mt) Media Temple
  • 使用最简洁的美国域名注册商Name.com使用最简洁的美国域名注册商
    Name.com

随意打赏

提交建议
微信扫一扫,分享给好友吧。