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

redmaomail 2024-07-24 21:49 阅读数 70 #wordpress

今天我们来制作单文章页single.php，有了之前制作index.php的经验，制作single.php也不再那么难了，这里将直接略过一些内容，直接给出结果。如果对某些修改不太清楚，可以先参考：wordpress/501083.html" target="_blank">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、添加文章标签

立即学习“PHP免费学习笔记（深入）”；

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

登录后复制

改成：

<?php the_tags(&#39;标签：&#39;, &#39;, &#39;, &#39;&#39;); ?>

登录后复制

3、添加日期

找到：31st Sep, 09 改成：

<?php the_time(&#39;Y年n月j日&#39;) ?>

登录后复制

4、显示评论数

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

登录后复制

改成：

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

登录后复制

5、添加编辑按钮

接上面的评论代码，改成:

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

登录后复制

6、添加文章内容

将和之间的代码全部删除，替换成：

<?php the_content(); ?>

登录后复制

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

@@##@@/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(&#39;home&#39;); ?>" 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教程》

WordPress主题制作全过程（九）：制作single.php的详细内容，更多请关注红帽云邮其它相关文章！

分享到：

上一篇：WordPress主题制作全过程（八）：制作index.php 下一篇：WordPress主题制作全过程（三）：HTML静态模板制作