WordPress主题制作全过程(十一):制作page.php
page.php也就是页面,可能大家不太理解页面是什么意思,博客上的所有网页不都是页面吗?我们这里指的页面一个单独的页面,如"关于"、"联系方式"等,可以在WordPress后台 – 页面,进行页面的添加修改等。
这个page.php有很多东西跟single.php也都是相通的,或者基本都一样,这里我们对部分内容也不做太多的解析,直接上结果,如果有不懂的可以翻翻WordPress主题制作全过程(八):制作index.php。
1、添加标题
搜索代码:
1 | <!-- Column 1 / Content --> |
改成:
1 2 | <!-- Column 1 / Content --> <h2 class="grid_12 caption clearfix"><?php the_title(); ?></h2> |
2、添加页面内容
1 | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vel porta erat. Quisque sit amet risus at odio pellentesque sollicitudin. Proin suscipit molestie facilisis. Aenean vel massa magna. Proin nec lacinia augue. Mauris venenatis libero nec odio viverra consequat. In hac habitasse platea dictumst.</p> |
改成:
1 | <?php the_content(); ?> |
3、添加评论框
将<!-- Contact Form --> 与 </form>之间的所有代码删除(包括</form>)
替换成:
1 | <?php comments_template(); ?> |
4、添加查询语句
搜索代码:<!-- Column 1 / Content -->
改成:
1 2 | <!-- Column 1 / Content --> <?php if (have_posts()) : the_post(); update_post_caches($posts); ?> |
查找:
1 2 |
改成:
1 2 3 4 5 6 7 | </div> <?php else : ?> <div class="grid_8"> 没有找到你想要的页面! </div> <?php endif; ?> <?php get_sidebar(); ?> |
我们的page.php就制作完毕了。另外还有两个页面,无边栏页面full_width.php,联系页contact.php,制作方法完全一样,这里就不再详述了,我已经直接写好了,下载即可。你可能会问,那这两个页面怎么用呢?我分别在这两个页面的前面写了两个注释:
1 2 3 4 5 | <?php /* Template Name: Page without sidebar */ ?> |
1 2 3 4 5 | <?php /* Template Name: contract */ ?> |
以后在WordPress后台新建页面的时候,可以在右边栏选择页面模板,你可以选择Page without sidebar 或 contract,不选默认使用page.php模板!contact.php边栏的联系方式你自己改一下内容就可以了。
到目前为止,我们的WordPress主题制作系列教程就结束,说实话你也应该没学到啥东西,我讲的实在太差劲了,就当是WordPress主题制作的一个感性认识过程吧。最后提供我们制作完成的主题下载,估计不会有人愿意用这样的主题的,太丑了!还有就是评论还没有分页功能。
WordPress主题制作全过程完整列表:
- WordPress主题制作全过程(一):基础准备
- WordPress主题制作全过程(二):主题文件构成
- WordPress主题制作全过程(三):HTML静态模板制作
- WordPress主题制作全过程(四):小试牛刀
- WordPress主题制作全过程(五):制作header.php
- WordPress主题制作全过程(六):制作footer.php
- WordPress主题制作全过程(七):制作sidebar.php
- WordPress主题制作全过程(八):制作index.php
- WordPress主题制作全过程(九):制作single.php
- WordPress主题制作全过程(十):制作comments.php
- WordPress主题制作全过程(十一):制作page.php
本文版权归露兜博客所有,转载引用请完整注明以下信息:
本文作者:Ludou
本文标题:WordPress主题制作全过程(十一):制作page.php
本文地址:http://www.ludou.org/create-wordpress-themes-page.html

最近正在学制作和修改主题,有时候很喜欢一个主题,但对seo不友好,搞的很矛盾,呵呵。我用的那个主题模板的seo超垃圾,自己又不会修改,努力学啊!
要想让自己满意,还是要自己改主题。好好学吧
都比较有技术含量的文章,博主厉害哦。
不知道可否加个友链?
链接已加
说得很完整,也比较详细,做份PDF出来吧,有助于分享~~
太晚了睡觉.明天在来慢慢看!
终于看下来了 露兜那怎么样在主题的边框添加颜色,比如灰色。你的这个博客是头部那里添加了一个灰色的背景
在style.css中添加:
body {
background-color: #F2F2F2;
背景即为灰色;
在style.css中,对应元素添加以下语句,即有边框
.对应元素 {
border:1px solid #CACACA;
}
添加后无变化 body {
background-color: #F2F2F2;
试过很多位置 囧。。。
还有个情况是 原本模板启用后 页面背景是接近于白色的淡灰色
发布一篇文章后 老文章(就hello word)那篇背景是纯白色的
先去学学CSS再说吧.
#wrapper {
border:1px solid #CACACA;
margin-top:7px;
}
网址是 http://www.592xs.com 我很喜欢这模板 比较大气 简洁
呵呵
头部灰色背景HTML
<div class="sorting">
<p>内容</p>
<div class="fixed"></div>
</div>
css代码
.sorting {
background:none repeat scroll 0 0 #F9F9F9;
border:1px solid #DFDFDF;
margin:15px auto 39px;
padding:20px 10px;
}
很谢谢你,的确让我有了感性认识!!
收获颇多,非常感谢。
以后在WordPress后台新建页面的时候,可以在右边栏选择页面模板,你可以选择Page without sidebar 或 contract,不选默认使用page.php模板!contact.php边栏的联系方式你自己改一下内容就可以了。
这个我在292还真没发现,是用的你最下面提供下载的主题。可以否详细的指点一下在哪个地方选择?
这个与WordPress版本没有关系。请确认你已经在自定义的页面模板头部添加了注释:
<?php
/*
Template Name: Page without sidebar
*/
?>
添加完毕后,在WordPress后台 – 页面,新建或编辑页面的时候,右边栏下方可以选择模板。页面模板中没有出现Template Name注释的,将不会出现模板选择框。
这套教程非常之好!我根据1-10学了一遍,竟然一晚上就会制作Wordpress模板了,太惊奇了。怎么感谢你啊!
"一晚上就会制作Wordpress模板了",不要说得那么轻松。
已回访!
哈哈,很不错啊,你说的很清楚了,php我是不懂的,我的站weboer.com正在修正主题。很复杂,有问题还请你指教啊
最近正在看CSS的入门教程,之前看了HTML。主题教程一路看下来觉得都很懂,已没有刚接触时的茫然无措。可我发现,制主题最应该教的还有CSS啊!那样才能体现个性与创造力,尤其对我这种视觉控来说。
本系列教程的主要内容是WordPress主题的内部实现原理,至于外在的界面等,请自行学习相关的网页制作知识。
非常感谢博主的教导,我不懂php也不懂css,但是学过教程确实对于主题的大致运作机制有了比较感性的理解。我会再去看看曹鹏的php和css教程。之前,已经看了wordpress教程,里面有些说法蛮有启发的,尤其是slug-translate的运用。
另外,博主是否可以推荐一些进阶的教程,当然,我理解php和css还是要好好学习的。
我的网站用wpyou的免费主题,后来又读了AJ Clarke的FreeBizz主题,感觉代码水平差距好大呀,也体会到好的主题设计不仅仅实现效果,更要给与用户足够的设置弹性,我想很多商业主题能卖钱也是这样的道理。
最后,再次感谢博主,你的讲解非常好,祝你新年快乐,万事如意!
接触网站设计制作两年了 懂原理 懂语句 但是很少手写,因为主要是做设计的,代码只是认知程度。读了你的介绍对WP的结构框架理解了,也知道了函数的调用以及不得不说WP真不愧为一套精品系统~ 谢谢你了
这些够基础!真正需要设计一款主题,需要学到很多东西的。。。
对于菜鸟的我来说 非常有用 一些承接仿制WP主题任务的人 再简洁的主题最少都三百
兄弟 看了你的教程 其实你就是老师了 中国人传统就是尊师重道的 感谢你的辛勤劳动 教程浅显易懂 收益非浅啊 以后会经常来关注你的博客的 :)