前言 上节中已经通过Wordpress最基本的组成元素编写了一个mapull主题，现在需要将发布的博客内容展示出来。
这一节开始需要写PHP代码了，但是一定要有一个意识，浏览器是不认识PHP代码的，浏览器只能解析HTML，CSS，JS。 因此，在HTML文件中，所见到的就是浏览器里显示的，但是PHP中的代码需要服务器(Apache、nginx)解析后才会发给浏览器。
Wordpress提供很多了方法来方便开发者调用，方法很多，每个方法还有多个参数，全部记住它们几乎不可能。 但是对于常用的，还是需要记住，其实大多数方法使用默认参数就能满足绝大部分需求。
对于一篇文章，最重要的几个部分：
标题作者发布日期摘要/内容在wordpress中，这些内容都被封装了一个个方法，我们可以方便地拿到这些信息。
<?php the_title(); ?> 大多数时候，点击标题可以到详情，还需要文章的链接：<?php the_permalink(); ?>
作者姓名：<?php the_author(); ?>
发布时间：<?php the_time('Y年n月j日') ?>
PHP代码输出内容<?php the_time('Y年n月j日') ?>2019年5月1日<?php the_time('Y年m月d日') ?>2019年05月01日<?php the_time('Y-m-d') ?>2019-05-01<?php the_time('y-m-d H:i:s') ?>19-05-01 02:09:08摘要信息： <?php the_excerpt(); ?> 如果在写文章的时候，写了摘要，就会显示摘要的内容，如果没有编写摘要，就会取文章的开头的一部分文字，然后加上 … 正文信息： <?php the_content(); ?> 正文用于输出全文，当然如果你在编写文章的时候，用了分页标签<!-- more -->，只会显示标签之前的内容。
把上面的内容组合一下，改造 index.php
<body> <div> <p><strong>Logo文字</strong></p> <p>发现</p> <p>关注</p> <p>消息</p> </div> <div> <main> <h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1> <h5><?php the_author(); ?> <?php the_time('Y年n月j日') ?></h5> <article> <?php the_excerpt(); ?> </article> </main> </div> </body>先去发布几篇文章，然后访问一下主页 http://localhost
到目前为止，首页还只能显示一篇文章，要想输出所有文章，需要用到PHP的循环。
加上循环代码后的 index.php
<body> <div> <p><strong>Logo文字</strong></p> <p>发现</p> <p>关注</p> <p>消息</p> </div> <div> <main> <?php while (have_posts()) : the_post(); ?> <h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1> <h5><?php the_author(); ?> <?php the_time('Y年n月j日') ?></h5> <article> <?php the_excerpt(); ?> </article> <?php endwhile; ?> </main> </div> </body>访问一下主页 http://localhost，看看是不是显示了更多的文章。
实际上，在wordpress中输出文章的内容，有相对固定的写法：
判断文章是否存在循环遍历所有文章输出文章标题显示文章内容/摘要虽然现在的页面看起来还有点丑，不过可以通过一些css来美化一下。
在首页中添加一些元素 index.php
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>模板文件</title> <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" /> </head> <body> <div class="header-view"> <a class="logo" href="<?php home_url() ?>"><strong>Logo文字</strong></a> <a class="menu" href="#">发现</a> <a class="menu" href="#">关注</a> <a class="menu" href="#">消息</a> <input type="text" class="search" placeholder="搜索"> </div> <div class="content-area"> <main id="main" class="site-main"> <?php while (have_posts()) : the_post(); ?> <h1 class="article-title"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1> <article class="article-content"> <?php the_excerpt(); ?> </article> <h5><?php the_author(); ?> <?php the_time('Y年n月j日') ?></h5> <?php endwhile; ?> </main> </div> </body> </html>然后在样式表文件中美化一下 style.css
a { text-decoration: none; color: #0f0f0f; } body { color: #333; } .content-area { width: 60%; padding-top: 30px; margin: auto; } .logo { padding: 0 80px; color: #FF4400; } .menu{ padding: 0 20px; } .search { width:240px; height: 38px; font-size: 14px; border-radius: 40px; background: #eee; border: none; outline: none; padding-left: 20px; } .article-title { color: #969696; font-size: 18px; line-height: 1.5; } .article-content { font-size: 14px; line-height: 24px; color: #999; }看起了和某网站相似多了。
