书签 分享 收藏 举报 版权申诉 / 35
上传文档赚钱

类型网页设计与布局项目化教程08课件.ppt

  • 上传人(卖家):三亚风情
  • 文档编号:2878862
  • 上传时间:2022-06-07
  • 格式:PPT
  • 页数:35
  • 大小:10.88MB
  • 【下载声明】
    1. 本站全部试题类文档,若标题没写含答案,则无答案;标题注明含答案的文档,主观题也可能无答案。请谨慎下单,一旦售出,不予退换。
    2. 本站全部PPT文档均不含视频和音频,PPT中出现的音频或视频标识(或文字)仅表示流程,实际无音频或视频文件。请谨慎下单,一旦售出,不予退换。
    3. 本页资料《网页设计与布局项目化教程08课件.ppt》由用户(三亚风情)主动上传,其收益全归该用户。163文库仅提供信息存储空间,仅对该用户上传内容的表现方式做保护处理,对上传内容本身不做任何修改或编辑。 若此文所含内容侵犯了您的版权或隐私,请立即通知163文库(点击联系客服),我们立即给予删除!
    4. 请根据预览情况,自愿下载本文。本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
    5. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007及以上版本和PDF阅读器,压缩文件请下载最新的WinRAR软件解压。
    配套讲稿:

    如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。

    特殊限制:

    部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。

    关 键  词:
    网页 设计 布局 项目 教程 08 课件
    资源描述:

    1、第7章 橘汁仙剑游戏网站(动态)布局本章简介本章简介:上一章中,我们学习了如何构建一个静态站点。但上一章中,我们学习了如何构建一个静态站点。但是随着是随着互联网的互联网的发展,一个简单的静态站点并不能满足发展,一个简单的静态站点并不能满足我们的要求,它不易维护我们的要求,它不易维护、不易、不易添加内容。因此,很多添加内容。因此,很多站长采用了站长采用了PHPPHP、ASPASP等动态语言编写等动态语言编写网页网页,实现动态站,实现动态站点的功能。但是这种动态语言并不是那么容易点的功能。但是这种动态语言并不是那么容易掌握的掌握的,尤其是编写一个具有高效率、高安全性、负载能力强的尤其是编写一个具有

    2、高效率、高安全性、负载能力强的动态动态程序更是程序更是需要花费大量的时间深入地学习,反复地需要花费大量的时间深入地学习,反复地实践,因此实践,因此CMSCMS应运而生应运而生。我们可以很方便地下载一些。我们可以很方便地下载一些免费的免费的CMSCMS程序,通过模板的制作程序,通过模板的制作,结合,结合CMSCMS的后台的后台,实,实现现动态网站的功能。这里,我们选择的是目前动态网站的功能。这里,我们选择的是目前国内国内非常非常流行的流行的SupeSiteSupeSite和和DiscuzDiscuz! !程序。程序。课堂学习目标了解了解SupeSiteSupeSite和和DiscuzDiscuz

    3、! !程序及其程序及其安装步骤安装步骤掌握掌握SupeSiteSupeSite系统的使用方法系统的使用方法掌握制作掌握制作SupeSiteSupeSite模板的技巧模板的技巧掌握模板系统的高级应用技术掌握模板系统的高级应用技术8.1 SupeSite和Discuz!系统简介 SupeSiteSupeSite/X-Space/X-Space是由康盛创想公司出品的一套使用跨平台的是由康盛创想公司出品的一套使用跨平台的PHPPHP语言和语言和MySQLMySQL数据库构建的社区门户网站解决方案包。通过安装使数据库构建的社区门户网站解决方案包。通过安装使用用SupeSiteSupeSite/X-Spa

    4、ce/X-Space系统,网站建设者可以轻松、迅速和高效地构建系统,网站建设者可以轻松、迅速和高效地构建拥有高度拥有高度Web 2.0Web 2.0特性的社区门户,为站点的会员提供包含日志(博特性的社区门户,为站点的会员提供包含日志(博客)、影音视频(播客)、群组(圈子)、相册图片、商品买卖、软客)、影音视频(播客)、群组(圈子)、相册图片、商品买卖、软件分享和书签收藏等在内的全方位的件分享和书签收藏等在内的全方位的Web 2.0Web 2.0服务。服务。8.2 系统安装我们选择好了这一套系统以后,需要将其安装在网站空间上,才我们选择好了这一套系统以后,需要将其安装在网站空间上,才能够使其正常

    5、使用。首先,网站空间需要满足以下需求:能够使其正常使用。首先,网站空间需要满足以下需求:1 1、WebWeb服务器(如服务器(如ApacheApache、IISIIS或或ZeusZeus等);等);2 2、 PHP 4.1.0PHP 4.1.0或以上;或以上;3 3、ZendZend Optimizer 3.0 Optimizer 3.0或以上;或以上;4 4、MySQLMySQL 3.23 3.23或以上。或以上。8.3 使用SupeSite系统登录登录SupeSiteSupeSite后台设置后台设置基本设置基本设置资讯的发布和管理资讯的发布和管理资讯等级审核资讯等级审核资讯自定义字段资讯自

    6、定义字段其他设置其他设置8.3.1 构思规划站点为了管理站点,对站点进行设置,首先需要的就是登录后台了。这一步为了管理站点,对站点进行设置,首先需要的就是登录后台了。这一步需要我们以管理员身份(即在需要我们以管理员身份(即在DiscuzDiscuz! 6.0! 6.0安装过程中创建的管理员账号)安装过程中创建的管理员账号)登录登录SupeSiteSupeSite系统。操作方法是:在浏览器里输入自己的站点地址,然后在系统。操作方法是:在浏览器里输入自己的站点地址,然后在界面右侧的登录窗口输入管理员账号和密码。界面右侧的登录窗口输入管理员账号和密码。用管理员账号登录系统登录成功后显示的个人面板8.

    7、3.2 基本设置SupeSiteSupeSite后台的基本设置是后台的基本设置是SupeSiteSupeSite/X-Space/X-Space系统常用功能和全局配置系统常用功能和全局配置的总开关。这里主要是针对下面几大块的配置,包括系统设置、频道操作、的总开关。这里主要是针对下面几大块的配置,包括系统设置、频道操作、用户组权限、公告管理、站点广告、用户组权限、公告管理、站点广告、HTMLHTML静态配置、缓存更新、在线编辑、静态配置、缓存更新、在线编辑、计划任务和其他管理。计划任务和其他管理。1 1、用户权限、用户权限2 2、站点广告的添加和设置方法、站点广告的添加和设置方法3 3、HTML

    8、HTML静态配置静态配置4 4、更新缓存、更新缓存SupeSite 6.0 的后台管理界面8.3.3 资讯的发布和管理资讯是任何一个资讯是任何一个CMSCMS必不可少的功能。必不可少的功能。SupeSiteSupeSite自身也有一套很实用的自身也有一套很实用的资讯管理系统。资讯管理系统。SupeSiteSupeSite资讯功能不但具有最基本的发布和管理资讯的功能,资讯功能不但具有最基本的发布和管理资讯的功能,还可以让站长自定义资讯分类;还可以让站长自定义资讯分类; 资讯等级审核使得站长可以按自己的意愿资讯等级审核使得站长可以按自己的意愿决定哪些资讯可以显示,哪些资讯不显示;强大的信息采集功能

    9、使站长可以决定哪些资讯可以显示,哪些资讯不显示;强大的信息采集功能使站长可以通过采集别的站点的资讯信息来填充自己空白的版面;通过采集别的站点的资讯信息来填充自己空白的版面; 如果想就自己站点如果想就自己站点某方面的设计征求大家的意见,投票功能可以实现这个目标;某方面的设计征求大家的意见,投票功能可以实现这个目标; 资讯自定义资讯自定义字段功能允许站长根据自身站点的需求灵活扩充整个程序的功能,以达到站字段功能允许站长根据自身站点的需求灵活扩充整个程序的功能,以达到站长的特殊需求,并且可以很方便地通过模块进行调用。长的特殊需求,并且可以很方便地通过模块进行调用。1 1、资讯发布、资讯发布2 2、资

    10、讯管理、资讯管理8.3.4 资讯等级审核SupeSiteSupeSite后台的资讯等级审核可以对资讯进行管理操作。后台的资讯等级审核可以对资讯进行管理操作。通过等级审核操作,可以对信息进行等级分类处理、删除处理,从而可通过等级审核操作,可以对信息进行等级分类处理、删除处理,从而可以有效地控制站点页面上信息的显示。以有效地控制站点页面上信息的显示。资讯等级审核页面8.3.5 资讯自定义字段很多人一听说很多人一听说“字段字段”这个词,也许会认为是数据库的相关内容,实际这个词,也许会认为是数据库的相关内容,实际上在上在SupeSiteSupeSite中并非如此。中并非如此。SupeSiteSupeS

    11、ite提供了自定义信息扩展功能,站长可以提供了自定义信息扩展功能,站长可以针对资讯、日志和图片等各个频道设置自定义信息,从而来扩充整个程序的针对资讯、日志和图片等各个频道设置自定义信息,从而来扩充整个程序的功能。功能。添加两个自定义信息自定义信息的显示效果8.3.6 其他设置除了基本设置和资讯管理这两个主要设置之外,除了基本设置和资讯管理这两个主要设置之外,SupeSiteSupeSite后台还提供了后台还提供了个人空间管理、论坛相关设置、模型管理和专题管理等设置。其中,个人空个人空间管理、论坛相关设置、模型管理和专题管理等设置。其中,个人空间管理主要是在开通了间管理主要是在开通了X-spac

    12、eX-space之后,针对会员的空间及相关用户组的权限之后,针对会员的空间及相关用户组的权限进行的设置。论坛相关设置主要是集成了进行的设置。论坛相关设置主要是集成了DiscuzDiscuz! !论坛后台中的有关论坛后台中的有关upeSiteupeSite的相关设置项以及数据库备份等常用的设置项。模型管理主要是指大家可以的相关设置项以及数据库备份等常用的设置项。模型管理主要是指大家可以根据自己的需要建立自己所需要的模型(如官方自带的招聘、交友等模型),根据自己的需要建立自己所需要的模型(如官方自带的招聘、交友等模型),实现不同于资讯的功能。具体的设置方法请参考实现不同于资讯的功能。具体的设置方法

    13、请参考SupeSiteSupeSite/X-space/X-space安装包中安装包中的模型操作手册。的模型操作手册。由于这些设置并不和下面将要讲到的模板制作相关联,因此这里不做进由于这些设置并不和下面将要讲到的模板制作相关联,因此这里不做进一步的解释,对于这些设置不明白的读者可以自行参考一步的解释,对于这些设置不明白的读者可以自行参考SupeSiteSupeSite/X-space/X-space用用户手册,里面有详细的说明。户手册,里面有详细的说明。对于和模板制作联系最为紧密的对于和模板制作联系最为紧密的“模板模块向导模板模块向导”,我们将在,我们将在8.4.68.4.6体体验验SupeS

    14、iteSupeSite模块设置一节中做详细的说明。模块设置一节中做详细的说明。8.4 制作SupeSite模板SupeSiteSupeSite模板系统模板系统选择需要制作的模板选择需要制作的模板制作前的准备制作前的准备首页头部信息的制作首页头部信息的制作首页头部导航的制作首页头部导航的制作体验体验SupeSiteSupeSite模块设置模块设置在头部导航中加入资讯分类在头部导航中加入资讯分类首页主体内容的制作首页主体内容的制作深入探究深入探究SupeSiteSupeSite模块系统模块系统首页页脚的制作首页页脚的制作站点头部及页脚文件的制作站点头部及页脚文件的制作分类目录页的制作分类目录页的制

    15、作文章浏览页面的制作文章浏览页面的制作用户面板的制作用户面板的制作SupeSiteSupeSite模板制作小结模板制作小结8.4.1 SupeSite模板系统SupeSiteSupeSite模板是存放在程序目录下的模板是存放在程序目录下的templatestemplates文件夹下的文件夹下的一组文件,在一组文件,在DreamweaverDreamweaver中打开中打开templates/defaulttemplates/default文件夹下文件夹下的的index.html.phpindex.html.php文件,这个就是默认模板的首页文件。看上去,文件,这个就是默认模板的首页文件。看上去

    16、,这个文件和普通的这个文件和普通的htmlhtml没多少区别,它只不过多了些带有没多少区别,它只不过多了些带有$ $的变的变量和一些放在量和一些放在!-中的灰色代码,这些变量和代码就是实中的灰色代码,这些变量和代码就是实现动态网站的现动态网站的“必需品必需品”。简单地说,带有。简单地说,带有$ $符号的变量是动态符号的变量是动态获取相关的内容,放在获取相关的内容,放在!-中的灰色代码就是我们要讲解中的灰色代码就是我们要讲解的模块系统,它用来调用相关的模块信息,并且按照自己的定义的模块系统,它用来调用相关的模块信息,并且按照自己的定义和设置显示在网页上。和设置显示在网页上。8.4.2 选择需要制

    17、作的模板有人可能会说,这么多文件,要做起来岂不是很麻烦?其实不是这样的,有人可能会说,这么多文件,要做起来岂不是很麻烦?其实不是这样的,这里的文件并不都是必须的。我们要根据网站的规划合理地选择模板,如网站这里的文件并不都是必须的。我们要根据网站的规划合理地选择模板,如网站究竟需要哪些频道,需要实现哪些功能。这里还是以橘汁仙剑网为例,大家可究竟需要哪些频道,需要实现哪些功能。这里还是以橘汁仙剑网为例,大家可以先到网站上去看一看,我们这个实例站点都采用了哪些频道,实现了什么样以先到网站上去看一看,我们这个实例站点都采用了哪些频道,实现了什么样的功能。其实很简单,它只用了资讯和博客这两个频道,像商品

    18、、书签、文件、的功能。其实很简单,它只用了资讯和博客这两个频道,像商品、书签、文件、图片和论坛聚合等频道并没有使用,这样就去除了以图片和论坛聚合等频道并没有使用,这样就去除了以“goods”goods”、“link”link”、“file”file”、“image”image”和和“bbsbbs”开头的文件,看起来工作量小了很多。再仔开头的文件,看起来工作量小了很多。再仔细看看,对于站点公告,我们可以直接调用论坛的站点公告,所以细看看,对于站点公告,我们可以直接调用论坛的站点公告,所以site_announcement.html.phpsite_announcement.html.php这个文

    19、件也可以省略了;这个文件也可以省略了; TAGTAG标签虽然是一个标签虽然是一个很不错的功能,但是这里为了节省时间,也不再考虑了,所以很不错的功能,但是这里为了节省时间,也不再考虑了,所以site_tag.html.phpsite_tag.html.php和和site_tagall.html.phpsite_tagall.html.php这两个文件也省略了;这两个文件也省略了; 友情链友情链接会在首页下方显示,并不会单独制作页面显示友情链接,所以接会在首页下方显示,并不会单独制作页面显示友情链接,所以site_link.html.phpsite_link.html.php这个文件也省略了;因为

    20、站内搜索采用的是百度的搜索这个文件也省略了;因为站内搜索采用的是百度的搜索功能,所以功能,所以site_search.html.phpsite_search.html.php这个页面也不用制作了;投票的功能暂时这个页面也不用制作了;投票的功能暂时不需要,所以又省略了不需要,所以又省略了ite_poll.html.phpite_poll.html.php文件。文件。8.4.3 制作前的准备制作之前,大家需要做以下准备。制作之前,大家需要做以下准备。(1 1)完善)完善SupeSiteSupeSite资讯频道中的资讯分类以及资讯频道中的资讯分类以及DiscuzDiscuz! !论坛中的板块,论坛中

    21、的板块,并发布一些简单的信息,以便在日后调用中及时显示效果。并发布一些简单的信息,以便在日后调用中及时显示效果。(2 2)确保)确保SupeSiteSupeSite后台的基本设置中的后台的基本设置中的“启用缓存启用缓存”选项选择为选项选择为“不开不开启缓存启缓存” ” ,并确保,并确保“是否生成是否生成HTML”HTML”的选项选择为的选项选择为“否否”(如图(如图8.168.16所示)。所示)。这样,我们对模板所做的任何更改就能及时反映出来,有利于调试。这样,我们对模板所做的任何更改就能及时反映出来,有利于调试。在基本设置中关闭缓存确保HTML 静态功能为不开启8.4.4 首页头部信息的制作

    22、启动启动DreamweaverDreamweaver网页制作软件,打开上一章中制作的首页文件网页制作软件,打开上一章中制作的首页文件index.htmlindex.html,然后打开,然后打开SupeSiteSupeSite模板目录模板目录templates/defaulttemplates/default文件夹下的文件夹下的index.html.phpindex.html.php文件以及文件以及templates/templates/ojpalojpal文件夹下的文件夹下的index.html.phpindex.html.php文件。文件。在在ojpalojpal模板的模板的index.ht

    23、ml.phpindex.html.php文件的开始处加入文件的开始处加入“”并回车,表示并回车,表示让浏览器不要以让浏览器不要以PHPPHP文件的形式解析这个文档,然后将文件的形式解析这个文档,然后将index.htmlindex.html中的所有内中的所有内容复制到容复制到ojpalojpal文件夹下的文件夹下的index.html.phpindex.html.php文件中。文件中。8.4.5 首页头部导航的制作在本节中,我们需要将首页头部导航改为可以根据在后台开启的频道自在本节中,我们需要将首页头部导航改为可以根据在后台开启的频道自动获取频道名称,并在首页显示。动获取频道名称,并在首页显示

    24、。其中的其中的“资料资料”和和“博客博客”两个频道就是通过模板调用出来的。两个频道就是通过模板调用出来的。打开打开index.php.htmlindex.php.html这个模板文件,开始修改这个模板文件,开始修改bodybody中的内容。首先在代中的内容。首先在代码视图中按码视图中按“Ctrl+FCtrl+F” ” 组合键打开搜索,搜索组合键打开搜索,搜索“images/”images/”并全部替换为并全部替换为“S_URL/templates/$_SCONFIGtemplate/images/”S_URL/templates/$_SCONFIGtemplate/images/”。调用频道名

    25、称后的效果8.4.6 体验SupeSite模块设置上一节在制作首页头部导航的时上一节在制作首页头部导航的时候,需要调用资讯分类,这里需要先候,需要调用资讯分类,这里需要先在后台设置相应的模块,才能够调用。在后台设置相应的模块,才能够调用。我们这里就以上一节中需要创建的资我们这里就以上一节中需要创建的资讯分类模块为例说明讯分类模块为例说明SupeSiteSupeSite模块的模块的设置。进入设置。进入SupeSiteSupeSite“后台设置后台设置”中中的的“模块模板向导模块模板向导”标签,单击标签,单击“创创建模块建模块”,并在选择基本模块中选择,并在选择基本模块中选择“系统分类系统分类”,

    26、这样就可以创建调用,这样就可以创建调用资讯分类的模块了。资讯分类的模块了。后台中创建新的模块8.4.7 在头部导航中加入资讯分类这一节中,将学习如何将已经创建好的模块加入到模板文件中,并这一节中,将学习如何将已经创建好的模块加入到模板文件中,并且将需要实现调用资讯分类的名称显示在主导航的第且将需要实现调用资讯分类的名称显示在主导航的第2 2个个 标记处。标记处。资讯分类调用效果图8.4.8 首页主体内容的制作按照前面模块调用规划图,我们的计划是在主体内容中部放置一些按照前面模块调用规划图,我们的计划是在主体内容中部放置一些版块,分别调用最新的资讯、论坛的新帖等。版块,分别调用最新的资讯、论坛的

    27、新帖等。调用最新资讯的效果图8.4.9 深入探究SupeSite模块系统我们已经体验了我们已经体验了SupeSiteSupeSite的模块设置,并且在的模块设置,并且在8.4.78.4.7小节以及小节以及8.4.88.4.8小小节中通过两个实例对节中通过两个实例对SupeSiteSupeSite的模块设置做了进一步的说明,为大家总结了的模块设置做了进一步的说明,为大家总结了一般的模块调用方法,但是我们还仅仅局限于调用标题(一般的模块调用方法,但是我们还仅仅局限于调用标题($valuesubject$valuesubject)和超级链接(和超级链接($value$valueurlurl )这两个

    28、内容。在这一节中,将进一步地探究)这两个内容。在这一节中,将进一步地探究SupeSiteSupeSite模块调用,通过探究模块调用,通过探究$value$value中存放的数据,实现更多丰富的内容调中存放的数据,实现更多丰富的内容调用。用。浏览量显示示意图8.4.10 首页页脚的制作从页面的规划图中可以看出,页脚主要包括友情链接、赞助商链接和从页面的规划图中可以看出,页脚主要包括友情链接、赞助商链接和版权信息等。接下来为站点添加友情链接。版权信息等。接下来为站点添加友情链接。站点友情链接的调用8.4.11 站点头部及页脚文件的制作1 1、头部文件的制作、头部文件的制作因为站点头部都采用统一的样

    29、式,所以直接复制因为站点头部都采用统一的样式,所以直接复制index.html.phpindex.html.php文件中的文件中的到到#header#header这个这个divdiv结束之间的所有代码到结束之间的所有代码到site_header.html.phpsite_header.html.php文件文件中。中。2 2、站点页脚的制作、站点页脚的制作站点页脚的制作主要就是指友情链接的调用、底部广告位的调用,以及一站点页脚的制作主要就是指友情链接的调用、底部广告位的调用,以及一些其他信息的展示等。由于在些其他信息的展示等。由于在index.html.phpindex.html.php中已经制

    30、作了页脚,因此先将中已经制作了页脚,因此先将index.html.phpindex.html.php中中#foot#foot这个这个divdiv的开始一直到的开始一直到文件结束之间的代码全部文件结束之间的代码全部复制到复制到site_footer.html.phpsite_footer.html.php这个文件中。这个文件中。8.4.12 分类目录的制作1 1、头部的制作、头部的制作在前面已经制作好了站点的头部文件在前面已经制作好了站点的头部文件site_header.html.phpsite_header.html.php,所以这里可以直接调用这,所以这里可以直接调用这个文件,在个文件,在n

    31、ews_category.html.phpnews_category.html.php的第的第1 1行的行的后回车,然后输入后回车,然后输入“template template site_headersite_header”,这样就完成了首页头部模板的调,这样就完成了首页头部模板的调用。同样,在页脚中,也可以很方便地调用前面制用。同样,在页脚中,也可以很方便地调用前面制作好的页脚模板,在本文件的最下部加入作好的页脚模板,在本文件的最下部加入“template template site_footersite_footer”即可。即可。2 2、中部主体内容的制作、中部主体内容的制作从示意图可以看

    32、出,这个调用和制作首页的调从示意图可以看出,这个调用和制作首页的调用没多大的区别,只不过创建的模块不同罢了。这用没多大的区别,只不过创建的模块不同罢了。这里仅作简要的说明,大家可以参考里仅作简要的说明,大家可以参考defaultdefault模板中模板中的的news_category.html.phpnews_category.html.php进行制作。我们通过调进行制作。我们通过调用根分类下的子分类制作左侧导航给大家进行简要用根分类下的子分类制作左侧导航给大家进行简要说明。说明。分类目录页的版块调用示意图8.4.13 文章浏览页面的这里关于文章具体信息的调用其实用不到太多的模块系统,因为这里

    33、的很多内容这里关于文章具体信息的调用其实用不到太多的模块系统,因为这里的很多内容都有固定的变量名称。都有固定的变量名称。SupeSiteSupeSite系统在识别出这个是文章详细内容界面之后,就会传系统在识别出这个是文章详细内容界面之后,就会传递给这个页面一些变量,这些变量都是和这篇文章相关的。递给这个页面一些变量,这些变量都是和这篇文章相关的。文章浏览页模块调用示意图8.4.14 用户面板的制作用户面板对于一个互动性的网站来说是必不可少的。这里的面板不仅要实现基本用户面板对于一个互动性的网站来说是必不可少的。这里的面板不仅要实现基本的各个功能项的链接,还要实现一些根据用户组权限判断自动开启或

    34、隐藏某些功能的的各个功能项的链接,还要实现一些根据用户组权限判断自动开启或隐藏某些功能的设置。设置。管理员登录之后显示的快捷面板游客的快捷面板8.4.15 SupeSite模板制作小结就这样,将需要的模板文件全部制作完成了。可以看出,模板文件的框架都是上就这样,将需要的模板文件全部制作完成了。可以看出,模板文件的框架都是上一章学习静态网站制作时的网页文件框架,在这一节中所做的就是在静态页面的框架一章学习静态网站制作时的网页文件框架,在这一节中所做的就是在静态页面的框架的的“缝隙缝隙”里添加一些用于里添加一些用于SupeSiteSupeSite系统识别的代码、用于声明数据的调用(即模块系统识别的

    35、代码、用于声明数据的调用(即模块模板内部调用代码),然后在需要展示数据的位置使用相应的变量进行内容的替换,模板内部调用代码),然后在需要展示数据的位置使用相应的变量进行内容的替换,即可实现动态获取数据内容进行展示。即可实现动态获取数据内容进行展示。8.5 模块系统的高级应用SupeSiteSupeSite模块系统的语法格式模块系统的语法格式条件判断语句条件判断语句自定义广告显示函数自定义广告显示函数8.5.1 SupeSite模块系统的语法格式1 1、语法格式、语法格式2 2、条件判断、条件判断3 3、不带下标变量的数组循环、不带下标变量的数组循环4 4、带下标变量数组循环、带下标变量数组循环

    36、5 5、时间处理函数、时间处理函数6 6、自定义广告显示函数、自定义广告显示函数7 7、模板文件包含、模板文件包含8 8、模板中的、模板中的evaleval函数函数9 9、模板中的、模板中的blockblock函数函数8.5.2 条件判断语句通过条件判断语句,可以设置在满足条件的情况下才会显示某些模块,通过条件判断语句,可以设置在满足条件的情况下才会显示某些模块,在不满足条件的情况下不显示或者显示其他模块。这个功能很有用,如在前在不满足条件的情况下不显示或者显示其他模块。这个功能很有用,如在前一节中制作一节中制作index.html.phpindex.html.php这个模板文件时创建的这个模

    37、板文件时创建的“最新资料最新资料”的版块,调的版块,调用的是最新的资讯文章。如果站点里还没有添加新的资讯,它就没有内容可用的是最新的资讯文章。如果站点里还没有添加新的资讯,它就没有内容可以调用,在浏览器上只能显示一个空荡荡的版块。以调用,在浏览器上只能显示一个空荡荡的版块。没有内容的版块8.5.3 自定义广告显示函数这里就要对站点加入广告了。以首页底部这里就要对站点加入广告了。以首页底部“友情链接友情链接”下面的页面底部下面的页面底部广告为例进行说明。我们将要学习:广告为例进行说明。我们将要学习:1 1、在模板中使用自定义广告显示函数添加广告;、在模板中使用自定义广告显示函数添加广告;2 2、

    38、配合我们学习的条件判断语句,实现不在后台添加广告,或者取消广、配合我们学习的条件判断语句,实现不在后台添加广告,或者取消广告显示的时候不显示这个广告位;告显示的时候不显示这个广告位; 在后台添加并设置为显示的时候才显示该在后台添加并设置为显示的时候才显示该广告位。广告位。广告位不显示广告位显示8.6 完成测试经过一番努力之后,我们的页面终于制作完成了。建议大家把自己制作好经过一番努力之后,我们的页面终于制作完成了。建议大家把自己制作好的模板上传的模板上传到空间到空间里进行测试,看是否有问题,其实主要的问题在前面的讲解里进行测试,看是否有问题,其实主要的问题在前面的讲解中已经有所涉及,主要是中已

    39、经有所涉及,主要是模板模板代码的书写。然后看看是否有新的需要,并进一代码的书写。然后看看是否有新的需要,并进一步完善。步完善。从本次的制作经历中来看,制作一套完整的从本次的制作经历中来看,制作一套完整的SupeSiteSupeSite系统模板并不难,只系统模板并不难,只要掌握了要掌握了基本的基本的模块操作技巧,并配合模块高级语法函数的使用,可以制作很模块操作技巧,并配合模块高级语法函数的使用,可以制作很完善的动态页面。这里也完善的动态页面。这里也并不并不需要了解多么深奥的知识,只要在上一章中,制需要了解多么深奥的知识,只要在上一章中,制作好了静态的模板,然后再添加模块,作好了静态的模板,然后再

    40、添加模块,就可以就可以实现动态网站的功能。可见,制实现动态网站的功能。可见,制作静态页面所用到的作静态页面所用到的div+CSSdiv+CSS是基础,希望大家多花是基础,希望大家多花点时间点时间,弄明白,弄透彻,弄明白,弄透彻,这才是制作一个好网站的根本。这才是制作一个好网站的根本。8.7 Discuz!模板系统简介上一节中,我们学习了上一节中,我们学习了SupeSiteSupeSite系统模板的制作方法,想必大家可以自己系统模板的制作方法,想必大家可以自己动手制作一套属于自己的模板了。这一节中,将简要介绍一下动手制作一套属于自己的模板了。这一节中,将简要介绍一下DiscuzDiscuz! !

    41、论坛系统论坛系统的模板。的模板。一套独立完整的一套独立完整的DiscuzDiscuz! !模板的模板的CSSCSS是存放在模板目录下的是存放在模板目录下的css.htmcss.htm文件中的,文件中的,这个文件在这个文件在DreamweaverDreamweaver中是不能看到样式的,需要将其更名为中是不能看到样式的,需要将其更名为css.csscss.css才能看才能看到它的样式。所以大家如果想自己独立制作一套到它的样式。所以大家如果想自己独立制作一套DiscuzDiscuz! !模板的话,就需要先在模板的话,就需要先在本地制作好本地制作好css.csscss.css文件,然后另存为文件,然

    42、后另存为css.htmcss.htm文件。另外,该文件中的各个文件。另外,该文件中的各个divdiv的名称以及风格变量名称必须参照的名称以及风格变量名称必须参照defaultdefault模板中的模板中的css.csscss.css文件的相关设置,文件的相关设置,否则将无法正常显示。没有能力的朋友可以在作者允许的情况下,使用或者修否则将无法正常显示。没有能力的朋友可以在作者允许的情况下,使用或者修改模板为己所用。改模板为己所用。8.8 本章小结在本章中,通过橘汁仙剑网这个实例学习制作了在本章中,通过橘汁仙剑网这个实例学习制作了SupeSiteSupeSite系统模板,并简系统模板,并简单了解了

    43、在后台编辑单了解了在后台编辑DiscuzDiscuz! !论坛模板的方法。这里,我们可以看出论坛模板的方法。这里,我们可以看出SupeSiteSupeSite强强大的模块系统的简单实用。当然,大家也可以根据自己的喜好选择自己喜爱的大的模块系统的简单实用。当然,大家也可以根据自己的喜好选择自己喜爱的CMSCMS程序并根据相关的教程制作自己的模板文件,从而建立一个动态站点。模板程序并根据相关的教程制作自己的模板文件,从而建立一个动态站点。模板的制作其实大同小异,例如的制作其实大同小异,例如SupeSiteSupeSite系统采用是模块系统,而系统采用是模块系统,而PHPCMSPHPCMS则采用的则

    44、采用的是标签系统,其实它们的原理都是一样的,都是在现有的静态模板的基础上进是标签系统,其实它们的原理都是一样的,都是在现有的静态模板的基础上进行改造,加入相应的模块或标签,实现数据的动态调用。由此,可以看出制作行改造,加入相应的模块或标签,实现数据的动态调用。由此,可以看出制作HTMLHTML静态页面和学习静态页面和学习DIV+CSSDIV+CSS技术的基础性以及重要性,所以大家务必加强基础技术的基础性以及重要性,所以大家务必加强基础的学习,千万不要好高骛远。没有学习扎实就贸然制作,结果只能是费时费力,的学习,千万不要好高骛远。没有学习扎实就贸然制作,结果只能是费时费力,适得其反。适得其反。C

    45、MSCMS程序为我们提供了强大的后台,给我们打好了地基,我们则使用程序为我们提供了强大的后台,给我们打好了地基,我们则使用DIV+CSSDIV+CSS的技术进行前台页面的制作,用的技术进行前台页面的制作,用divdiv搭建房屋然后用搭建房屋然后用CSSCSS进行装修。在这进行装修。在这个过程中,我们能够体会到用个过程中,我们能够体会到用CSSCSS布局的方便与简单,也能够体会到整个站点制布局的方便与简单,也能够体会到整个站点制作完成后的那份喜悦。相信大家在学习好作完成后的那份喜悦。相信大家在学习好DIV+CSSDIV+CSS技术之后,也能够制作一个自技术之后,也能够制作一个自己的动态网站。己的动态网站。

    展开阅读全文
    提示  163文库所有资源均是用户自行上传分享,仅供网友学习交流,未经上传用户书面授权,请勿作他用。
    关于本文
    本文标题:网页设计与布局项目化教程08课件.ppt
    链接地址:https://www.163wenku.com/p-2878862.html

    Copyright@ 2017-2037 Www.163WenKu.Com  网站版权所有  |  资源地图   
    IPC备案号:蜀ICP备2021032737号  | 川公网安备 51099002000191号


    侵权投诉QQ:3464097650  资料上传QQ:3464097650
       


    【声明】本站为“文档C2C交易模式”,即用户上传的文档直接卖给(下载)用户,本站只是网络空间服务平台,本站所有原创文档下载所得归上传人所有,如您发现上传作品侵犯了您的版权,请立刻联系我们并提供证据,我们将在3个工作日内予以改正。

    163文库