第三节项目实操

一、操作步骤

这里用首页、列表页和内容页为例，做一个简单的示范。

（一）准备材料

1、静态文件index.html（首页）、list.html（文章列表页）和single.html（文章内页）。第三章的实践任务。 2、创建好的zblog主题

（二）步骤

（1）在主题页面的template文件下创建index.php，输入代码

{if $type=='index'&&$page=='1'}
{template:c_index}
{else}
{template:c_list}
{/if}

$type=='index'&&$page=='1' 判断是不是首页 {template:c_index} - 嵌入模板文件 c_index.php 的文件内容。用于存放首页的代码。 {template:c_list} - 嵌入模板文件 c_list.php 的文件内容。用于存放列表页的代码。（2）创建c_index.php，将index.html代码复制进来。（3）创建c_list.php，将list.html代码复制进来。在页面找到类似代码

<ul>
  <li><a href="news-detail.html?id=1">新闻标题1</a></li>
  <li><a href="news-detail.html?id=2">新闻标题2</a></li>
  <li><a href="news-detail.html?id=3">新闻标题3</a></li>
</ul>

改成

<ul>
  {foreach $articles as $article}
  <li><a href="{$article.Url}">{$article.Title}</a></li>
  {/foreach}
</ul>

也可以去加其他标签，可参考《模板语法汇总》的《single》栏目。（4）创建single.php，将single.html代码复制进来。将标题改成{$article.Title}，内容改成{$article.Content} 如需显示其他内容，可参考《模板语法汇总》的《single》栏目。（5）然后就可以在后台添加分类，添加文章了。（6）然后将添加好的分类添加到导航里面。（7）这个时候一个简单的网站就制作好了。

二、视频教程

教学视频前端调用数据

三、思考与实践任务

任务一：制作一个简单的动态网站

1、把静态文件index.html（首页）、list.html（文章列表页）和single.html（文章内页）里面的代码放置到程序对应的php文件内， 2、将styles.css和scripts.js放置到程序对应的php文件内，并成功调用。 3、将列表页面和文章内页的php代码改成动态调用。 4、在网站后台适当的添加分类和内容，然后通过修改代码，让前台的导航栏正常显示。（预留一个二级下拉的位置）。

任务二：思考

静态转动态的过程中，你遇见的其中一个问题，并说下解决思路。

一、操作步骤

（一）准备材料​

（二）步骤​