wp 主题，wordpress主题，wordpress建站主题（图文教程）(wordpress主题制作教程(九):制作index.php文件)

wp 主题，wordpress主题，wordpress建站主题（图文教程）

wp 主题，便捷设置管理，可以独立自主开发的WordPress后台主题设置面板，wp 主题可以方便快捷的设置站长的网站，即使不懂代码也可以随心所欲地修改主题自定义选项。自动SEO优化，wp 主题在开发过程中非常注重搜索引擎的优化，并借助WP平台的SEO优势，可以不需要任何插件即可实现自动提取生成页面关键词和描述。

wp 主题的前沿设计风格，wp 主题时刻关注前沿设计风格，紧跟行业趋势，无论响应式还是扁平化，WordPress主题都能轻松搞定，使用技术支持，长久免费使用，wp 主题都可获得长久免费使用权。wp 主题具有15个不同的预建网站，可以分别安排并按照不同的类型进行管理。站长可以完全自由地随意组合这些预建网站中的任何组件。

wp 主题无限制的页脚布局，加上4种以上的博客布局组合、4种以上的作品展示布局组合、2个作品展示单项布局、3个产品页面布局。wp 主题支持视网膜，同时兼容WooCommerce以及通过自身wp 主题的性能优化，加上WPML多语言插件。可以让网站站长360°网站图片布局，再进行自定义产品标签。

wp 主题在详细分解代码之前，我们还是要先了解一下wp 主题的大致情况。一个wp 主题是由几个templates文件组成的，每一个主题必有的二个文件是：index.php 和 style.css（样式表），除此之外还有一些其它的文件（不是必须），它们和index.php文件间存在优先级关系，如果它们存在，wp 主题系统就会调用它们显示相应的页面，否则模板系统会调用index.php 来显示。

wp 主题的每个主题的页头信息都是几乎一样，具体可以查看默认模板的 header.php 文件，为保证所有页面的页头信息的一致性，所有页头信息都放在 header.php 文件。wp 主题body中的内容。它包含四个部分，每一部分都可以叫做一个集成模块，其实一个主题就是由不同的模块构成，模块又是由不同的模块构成。header WP 的顶部，显示博客的名字与描述，放置导航栏，搜索栏等等。content WP 的正文部分，显示帖子的内容，作者，时间，分类，评论，编辑等等。

sidebar WP 的侧边栏部分。footer WP 尾部，这部分只有很少的内容，通常是版权信息。对于每一个集成模块中的内容，理论上是可以随意放置的，比如我们可以把wp 主题中的搜索栏放在sidebar模块中去。wp 主题如何区分这四个集成模块呢？看以下代码：

<div id="header">

站长自己的博客网站

</div>

<div id="content">

这是我的日志</div>

<div id="sidebar">

搜索栏，分类，存档，友情链接

</div>

<div id="footer">

现在开始我们wp 主题第一部分的代码块，不过在写代码之前代码要有层次感，要记得缩进，不要用空格缩进而用TAB键。

<div id="header">

<h1><a href="<?php bloginfo('url');?>"><?php bloginfo('name');?></a></h1>

<?php bloginfo('description');?>

</div>

id 是 div 的一个属性，给 id 赋于不同的值，这样就可以区分每一个div代码段。

bloginfo() 是wp 主题中定义好的函数，参数 url 返回网址，参数 name 返回网站的名字，参数 description 返回网站描述。

在wp 主题上面的代码中，就是为博客的标题并加上一个超链接，并且显示描述。

如果我们把上面的三行代码加上页头部分另存为一个新的文件 — header.php。这样我们就可以通过wp 主题函数导入它们。

wordpress主题制作教程(九):制作index.php文件

我们前面已经将index.php文件里面的公用代码提取出来制作成了header.php\\footer.php\\sidebar.php，现在我们就来整理一下index.php的代码，index.php文件算是一个最普遍使用的模板页面了，如果你的主题没有home.php、且后台设置首页显示最新文章，那么index.php文件就是首页模板了，如果你的主题没有文章也模板(single.php)、没有单页面模板(page.php)、没有分类页模板(category.php)、没有标签页(index.php)......没有404页面等的，都将会使用index.php文件代替。

那么我们今天要整理的index.php文件到底要以什么形式来显示呢?一般来说都是文章列表，这样这个文件做首页能正确显示、还能做归档页、搜索结果页等。。

不过我们首页如果需要显示20篇文章？我们是不是需要写20篇文章的代码呢？其实这20篇文章代码都是同样的形式，所以我们只需要写一篇文章的代码，然后将这个代码循环输出就好了。如果你之前学过任何一门编程语言，那么while\\for循环应该不陌生，条件语句if也应该不陌生。

下面用编辑器打开index.php文件，可以看到里面有3篇文章的代码，我们将其中两篇代码删除，只留下一篇、并且将摘要文字删除：

1. <?php get_header(); ?>   
2.     <!-- Column 1 /Content -->   
3.     <div class=\"grid_8\">   
4.         <!-- Blog Post -->   
5.         <div class=\"post\">   
6.             <!-- Post Title -->   
7.             <h3 class=\"title\"><a href=\"single.html\">Loreum ipsium massa cras phasellus</a></h3>   
8.             <!-- Post Data -->   
9.             <p class=\"sub\"><a href=\"#\">News</a>, <a href=\"#\">Products</a> &bull; 31st Sep, 09 &bull; <a href=\"#\">1 Comment</a></p>   
10.             <div class=\"hr dotted clearfix\">&nbsp;</div>   
11.             <!-- Post Image -->   
12.             <img class=\"thumb\" alt=\"\" src=\"<?php bloginfo(\'template_url\'); ?>/images/610x150.gif\" />   
13.             <!-- Post Content -->   
14.                
15.             <!-- Read More Button -->   
16.             <p class=\"clearfix\"><a href=\"single.html\" class=\"button right\"> Read More...</a></p>   
17.         </div>   
18.         <div class=\"hr clearfix\">&nbsp;</div>   
19.            
20.         <!-- Blog Navigation -->   
21.         <p class=\"clearfix\"> <a href=\"#\" class=\"button float\">&lt;&lt; Previous Posts</a> <a href=\"#\" class=\"button float right\">Newer Posts >></a> </p>   
22.     </div>   
23.     <?php get_sidebar(); ?>   
24. <?php get_footer(); ?>