WordPress简单主题创建教程2：创建主题HTML结构

现在我们用我们的代码编辑器打开我们的index.php，添加HTML核心标签，如图所示。我们这里只了解PHP函数。 language_attributes() 函数用于决定WordPress网站所要显示的语言，bloginfo() 函数用于添加网站的信息，具有多个参数用于显示站点的名称、描述、URL以及列表，这里我们使用name参数用于在浏览器标签栏上显示网站名称。

我们保存index.php文件，重新加载站点前端页面，你就可以可以看到我们的站点标题 wordpress dev，如图所示。

我们需要在我们的标签中设置字符集（ character set），所以我们添加meta charset，同样使用bloginfo() 函数，参数设置为 charset。

我们保存我们的源代码，加载站点网页，查看网页源代码。我们会看到两个网页语言属性，我们的网页使用中文，字符集是utf-8。如图所示。这些属性都可以从WordPress内部设置。

我们打开style.css文件，添加站点网页的背景颜色样式，颜色为黑色。

我们重新加载网页，我们网页背景不会变成黑色，因为CSS样式表没有被网页读取。

为了能够让网页读取CSS样式表，我们在我们的style.css中输入图中选中的代码。这里我们同样使用 bloginfo() 函数，参数为 stylesheet_url 。这段代码将使我们的网页从正确的位置获取样式表。

保存代码并重新加载网页，我们现在可以看到我们的网页背景变成黑色的了。因为现在我们的网页已经正确加载CSS样式文件了。

现在，我们在标签中添加一个函数 wp_head()，如图所示。这个函数的作用是将我们需要的所有信息都添加到标签中，例如，当您安装一个插件时，比方说插件需要一个样式表，或者需要在heade标签中执行一些操作，我们就需要添加 wp_head() 函数。所以当你创建插件时，就会在中添加一些内容。

保存我们的代码，重新加载网页，查看网页源代码，我们就会发现网页的标签内部新增了许多内容，这些内容就是来自于 wp_head() 函数。

如果我们删除 wp_head() 函数，重新加载网页，查看网页的源代码，我们就会发现我们的页面源码只有index.php文件中的代码。

现在我们将学习如何在 body 中添加基本的 HTML 标签。我们创建一个

标签，在里面添加一个标签并且在这个标签中添加站点标题。由于我们在前面已经将网页的背景颜色设置成黑色，所以重新加载我们的网页是不能显示我们站点标题的。我们回到我们的style.css文件中将网页背景颜色样式设置成白色。

我们站点标题可以使用动态的标签，当然我们这里使用

标签。我们保存，重新加载我们的网页，我们的网页上出现了我们站点标题 WordPressDev 了。

现在我们如果想改变站点的前端输出内容，我们进入我们WordPress站点管理后台，选择“Settings”，选择“常规”选项。将我们的站点标题改为：My Website，站点副标题改为:The Best Website，点击“保存更改”。我们重新加载网页，看看有什么变化。

现在我们的站点标题更改为My Website 了，但是页面没有显示我们站点的副标题。

标签换成标签。

我们保存我们的代码，重新加载网页，我们页面上就出现了我们站点标题和站点副标题了。

现在我们添加更多的 HTML 标签。在我们的

标签下面，我们添加一个 class 为 main 的 div 标签，整个div标签哟用于获取我们的博客文章。在

标签中，我们首先使用 if 语句检查是否有文章存在，如果有，网页显示 post found，否则就显示 Sorry, No posts were found。后者既可以使用PHP函数显示，也可以直接用文字显示。

我们重新加载我们的站点，我们的页面显示了 post found，说明我们的站点已经存在文章了。后面我们在学习如何显示我们的站点中的文章。如果你觉得本教程对你有帮助，可关注我的企鹅号以便学习后续内容。

扫描二维码或搜索dwysxh123关注我的微信公众号，发送 Simple 获取源代码。