首页 » WordPress

WordPress主题制作全过程（九）：制作single.php

日期：2010-05-20 标签：WordPress教程，主题制作

如需帮忙改代码，或者WordPress二次开发、PHP网站建设等需求，可联系我购买付费服务：点此联系我

今天我们来制作单文章页single.php，有了之前制作index.php的经验，制作single.php也不再那么难了，这里将直接略过一些内容，直接给出结果。如果对某些修改不太清楚，可以先参考：WordPress主题制作全过程（八）：制作index.php

1、添加文章标题：

<h3 class="title"><a href="single.html">Loreum ipsium massa cras phasellus</a></h3>

改成：

<h3 class="title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>

2、添加文章标签

<a href="#">News</a>, <a href="#">Products</a>

改成：

<?php the_tags('标签：', ', ', ''); ?>

3、添加日期
找到：31st Sep, 09 改成：

<?php the_time('Y年n月j日') ?>

4、显示评论数

<a href="#">7 Comments</a>

改成：

<?php comments_popup_link('0 条评论', '1 条评论', '% 条评论', '', '评论已关闭'); ?>

5、添加编辑按钮
接上面的评论代码，改成:

<?php comments_popup_link('0 条评论', '1 条评论', '% 条评论', '', '评论已关闭'); ?><?php edit_post_link('编辑', ' • ', ''); ?>

6、添加文章内容
将 和 之间的代码全部删除，替换成：

<?php the_content(); ?>

另外，你可以将文章页那张图片删除了，删除以下代码：

<img class="thumb" src="<?php bloginfo('template_url'); ?>/images/610x150.gif" alt=""/>

7、添加返回博客首页和发表评论按钮
其实就是添加博客首页和评论锚点链接，在制作header.php，我们已经知道可以通过get_option('home');来获取博客地址。

<p class="clearfix"> <a href="blog.html" class="button float" ><< Back to Blog</a> <a href="#commentform" class="button float right" >Discuss this post</a> </p>

改成：

<p class="clearfix"> <a href="<?php echo get_option('home'); ?>" class="button float" ><< 返回首页</a> <a href="#commentform" class="button float right" >发表评论</a> </p>

好了，基本上的修改就这些了，但是你的文章页仍然不能显示文章内容，你得给它加上一个条件语句，这样WordPress才会去数据库读出你的文章内容。搜索代码：

改成：

<!-- Column 1 /Content -->
	<?php if (have_posts()) : the_post(); update_post_caches($posts); ?>

将：

</div>
	<?php get_sidebar(); ?>

改成：

	</div>
	<?php else : ?>
	<div class="errorbox">
		没有文章！
	</div>
	<?php endif; ?>
	<?php get_sidebar(); ?>

现在你的文章内容应该都可以正常显示了，一个文章页基本上也成型了。下节我们将讲解如何制作评论页，本次不提供修改的主题文件下载，下次一起提供。

另外，文章页顶部会有一段文字：

Our blog, keeping you up-to-date on our latest news.

可以替换成你的内容。如果不需要，可以将以下代码删除：

<h2 class="grid_12 caption clearfix">Our <span>blog</span>, keeping you up-to-date on our latest news.</h2>
	<div class="hr grid_12 clearfix"> </div>

好了今天的教程就讲到这。WordPress主题制作全过程完整列表：

-- 完 --

本文采用「CC BY-NC-SA 4.0」创作共享协议，转载请标注以下信息：
原文出处：露兜即刻 https://www.ludou.org/create-wordpress-themes-single.html

作者：露兜 » kaapass@outlook.com

业余编程爱好者。

49 条留言

点此留言

ioXiu
2010年5月21日 13:52

我来膜拜一下哈

回复
ZTMC
2010年6月20日 16:29

在"6、添加文章内容"时咱一边改代码一边预览效果
文章内容就是不显示咱纠结了半天改来改去都没搞定
然后半个小时候焦炙了决定先看下面的内容
然后看到7.里面那个条件的啥的当时就想喊去屎去屎去屎去屎去屎= =

回复
- Ludou
  2010年6月20日 16:36
  
  @ZTMC 必须添加后面的循环语句才能显示文章。看来是我在编排文章的时候，疏忽了这一点。
  
  回复
  - 青刀刀
    2010年10月22日 22:52
    
    @Ludou caro 博主：
    updata_post_caches的函数能具体讲讲吗，是不是每个调用详细文章内容都是用这个函数的。
    
    回复
    - 青刀刀
      2010年10月22日 22:54
      
      @青刀刀还有，就是填写判断语句if文章存在，调用次文章内容，否则“文章不存在”。
      事实上，我在后台如果把文章放掉回收站里，前台就没有这个文章了。不晓得这个判断是在什么情况下用得到。
      
      不知道我的问题说的清不清楚
      
      回复
      - Ludou
        2010年10月24日 14:54
        
        @青刀刀 <?php if (have_posts()) : the_post(); update_post_caches($posts); ?>
        
        这段代码其实就是从数据库中读取已发布的文章，自然不包括待审、草稿、回收站中的文章，如果你想显示这类文章，你可以使用query post函数，给它传递参数post_status，值可选pending（待审）、publish（已发布）、draft（草稿）, future（定时）, private（私有）, trash（回收站），程序实例：
        <?php
        query_posts( array( 'post_status' => array('publish', 'pending', 'draft', 'future', 'private', 'trash') ) );
        
        if (have_posts()) : the_post(); update_post_caches($posts); ?>
        
        这样将显示所有状态的文章，可根据需要去除相应的值。
    - Ludou
      2010年10月24日 14:45
      
      @青刀刀 update_post_caches不是必须的。
      
      回复
老饕
2010年7月31日 15:54

9贴错内容了吧？怎么是制作comments.php的内容啊？

回复
- Ludou
  2010年7月31日 20:48
  
  @老饕详见下一节，https://www.ludou.org/create-wordpress-themes-comments.html
  
  回复
老衲
2010年9月30日 16:57

好长时间没有来了继续把这个教程给看完…
似乎这个问题很白痴….
<?php comments_template(); ?> 跟这个<?php get_comments(); ?>（<?php get_header(); ?>）既然都是调用有什么区别不知道你懂不懂…

回复
- 老衲
  2010年9月30日 16:58
  
  @老衲 <?php get_comments(); ?>似乎不能用啊
  
  回复
  - Ludou
    2010年9月30日 18:25
    
    @老衲文章我已经改过了，get_comments()不起作用说明你还没有创建comments.php
    
    看来只有你才是认真看完本教程的网友了，唉，只能说明我写的教程很失败啊。
    
    回复
    - 老衲
      2010年10月6日 12:41
      
      @Ludou 我感觉教程不错啊
      
      回复
      - Ludou
        2010年10月6日 20:43
        
        @老衲你的网站已经好久不能访问了
- Ludou
  2010年9月30日 18:31
  
  @老衲 comments_template();用户导入评论模板，也可以自定义评论模板文件，默认是导入comments.php中的所有代码（相当用这个函数替代文件中的所有代码），如果给他传递文件参数，可以自行选择评论模板文件，如comments_template( '/short-comments.php' );
  
  get_comments()用于调用对应文章或页面的所有评论信息，记住这只是评论的信息，如评论作者、日期、内容等，这些只是一些信息，是没有格式的，需要你用HTML代码给他们括起来。
  
  回复
老衲
2010年9月30日 17:28

教程看完了真费脑子

这个9 估计是内容贴错了自己根据教程的理解也修改了下single 只是显示图片不显示里面的文字内容…

文章页面的上下博文的连接代码用前面index说的那个也不行，自己搜索去了

露兜上来看看，这9 跟10 ，弄错了…

回复
- Ludou
  2010年9月30日 18:23
  
  @老衲确实搞混了，之前更换了代码高亮插件，结果复制文章内容的时候搞乱了，幸好还有数据库备份。
  
  回复
西门
2010年11月7日 21:43

搜索代码：<!– Caption Line –>
你上一节提供下载的代码找不到这个。

回复
- Ludou
  2010年11月7日 21:54
  
  @西门那就查找 <!– Column 1 /Content –>
  
  当时编排的时候有点混乱。
  
  回复
fans
2012年1月30日 23:06

我这样做出来了但是所有的single页面都只显示最老的一篇文章

回复
virou
2012年3月1日 00:21

update_post_caches($posts);我怎么看都没看出什么用途,好像去掉也不影响什么!

回复
virou
2012年3月1日 00:27

我弄错了,不好意思,继续学习!!

回复
virou
2012年3月1日 00:39

update_post_caches($posts);看了又看，这句好像就是没什么用啊……

回复
- Ludou
  2012年3月1日 21:34
  
  @virou 是的，你可以不用。
  
  回复
感恩的心
2012年6月24日 18:18

教程很精彩,非常认真的花了一整天的时间学习完了.最后的"评论"comment没有讲很遗憾

回复
lugu
2012年7月3日 10:53

wp的文章浏览次数，怎么做？

回复
- Ludou
  2012年7月3日 18:09
  
  @lugu 插件：WP-PostViews
  
  回复
  - lugu
    2012年7月6日 09:15
    
    @Ludou 还有，我的wp后台，为什么没有单独的文章摘要。我首页的文章现在都是文章的正文。
    
    回复
    - Ludou
      2012年7月6日 12:35
      
      @lugu 页面右上角 – 显示选项，勾选：摘要
      
      回复
木子月
2013年5月3日 15:23

<?php the_content(); ?> 没有输出内容…是不是依赖别的标签啊我木有下载你提供的那个,我在自己的html静态页面改的,我还是下载个看看吧…

回复
- 木子月
  2013年5月3日 16:44
  
  @木子月好吧- -没看到下面
  
  回复
- Ludou
  2013年5月5日 21:18
  
  @木子月必须包含在主循环内，见文章第7点：
  if (have_posts()) :
  …
  the_content();
  …
  endif;
  
  回复
kevin
2013年8月10日 15:08

ludou

代码都是按你说的敲的最后也核对过了但是不显示内容不知道什么问题

回复
你的博客要逆天啊
2014年11月13日 11:38

为什么我的文章死活不现实呢？？？？？

回复
Yutorpea
2015年4月24日 16:21

想请教一下，single和page这两个页面究竟有啥区别？WP是怎么定义和区分的？

回复
- 露兜
  2015年4月26日 21:48
  
  @Yutorpea http://t.cn/RAQQhsQ
  
  回复
明
2015年5月12日 23:03

如果文章内容太长，它会伸到sidebar那边去，是要在CSS那里修改吗？

回复
michael503
2015年8月6日 11:14

加了<!– Column 1 /Content –>
<?php if (have_posts()) : the_post(); update_post_caches($posts); ?>

怎么出现错误？Parse error: syntax error, unexpected end of file in F:\xampp\htdocs\wordpress\wp-content\themes\Aurelius\single.php on line 68

回复
wordpress
2015年10月26日 14:57

很好的教程

回复
wordpress初学者
2015年12月24日 18:13

博主，求教一个问题，系统默认的提交评论表单发生错误后会跳转到wp-comments-post.php，我想让它不跳转到这个页面，直接在当前评论页面返回一个错误提示，并且这个提示的内容也是可以修改的，请问要如何实现？谢谢！

回复
- 露兜
  2015年12月24日 21:48
  
  @wordpress初学者上网搜索：WordPress ajax 评论
  
  回复
  - wordpress初学者
    2015年12月30日 15:39
    
    @露兜已解决问题，谢谢！
    
    回复
杰客
2015年12月26日 18:31

标题日期都显示正常就是内容不现实我也不会加循环内容a

回复
Hstb
2016年7月9日 20:39

<!– Column 1 /Content –>
<?php if (have_posts()) : the_post(); update_post_caches($posts); ?>
这段代码里"<?php if (have_posts())"和"the_post()"之前多打了一个冒号导致500

回复
- 露兜
  2016年7月12日 23:32
  
  @Hstb 冒号是必须的。如果冒号和endif的写法报错，请改用 { }
  
  回复
张淡腾
2017年3月31日 17:21

你好，网站出问题了。代码高亮不管用了

回复
- 露兜
  2017年3月31日 17:32
  
  @张淡腾抱歉，网站正在调试，请稍等
  
  回复
  - 张淡腾
    2017年3月31日 17:39
    
    @露兜嗯嗯，没事，我在你这里学到了很多东西。
    
    回复
    - 露兜
      2017年3月31日 17:41
      
      @张淡腾已经好了
      
      回复

WordPress主题制作全过程（九）：制作single.php

49 条留言

发表留言 取消留言

标签

Blogroll

发表留言取消留言