个人成长历程网站的设计与实现大学课程Word格式文档下载.docx
- 文档编号:19423151
- 上传时间:2023-01-06
- 格式:DOCX
- 页数:10
- 大小:24.66KB
个人成长历程网站的设计与实现大学课程Word格式文档下载.docx
《个人成长历程网站的设计与实现大学课程Word格式文档下载.docx》由会员分享,可在线阅读,更多相关《个人成长历程网站的设计与实现大学课程Word格式文档下载.docx(10页珍藏版)》请在冰豆网上搜索。
进入安装向导,该界面提示为便于安装系统更新文件,需要在安装前关闭其他应用程序,单击“NEXT”按钮继续。
步骤三:
选择安装目录
设置XAMPP安装目录,单击“Next”按钮,进入XAMPP设置界面。
步骤四:
设置XAMPP
设置界面包含“生成桌面快捷图标”、“加入开始菜单”、“安装Apache服务”、
“安装MySQL服务”、“安装Filezilla服务”选项,本例选中了“生成桌面快捷图标”、“加入开始菜单”两选项,单击“Install”按钮进入文件解压安装。
[2]
步骤五:
文件解压安装
该步XAMPP系统进行文件解压安装,“Next”按钮变灰不可单击,安装完毕后,状态变为可击,可单击进入下一步。
“Back”为返回上一步,“Cancel”则为取消安装。
在该步中会弹出一个DOS命令提示窗口提示,该提示说明系统安装正常。
步骤六:
XAMPP安装向导结束
文件解压安装完毕后,XAMPP安装向导结束提示系统安装成功,单击“Finish”按钮完成安装。
单击“Finish”按钮后,XAMPP弹出对话窗口,询问是否需要开始XAMPP控制面板进行设置,单击“是”进行快速设置,否则单击“否”退出。
步骤七:
XAMPP快速设置
安装过程结束后,首先使用XAMPP控制面板来“启动/停止”PHP、MySQL服务。
步骤八:
启动Apache
Apache和MySQL均为停止状态。
单击Apache后“start”按钮。
Windows系统防火墙提示是否允许访问,选择“允许访问”。
[3]
步骤九:
启动MySQL
单击MySQL后“start”按钮。
步骤十:
建Joomla数据库
单击控制面板中Apache后“Admin”按钮,系统会打开默认浏览器,进入XAMPP管理界面语言选择页,单击语言选择“中文”选项进入中文管理界面。
中文界面里集成了三类工具,包括XAMPP系统信息、第三方程序演示、XAMPP中的PHP管理工具。
单击“工具→phpMyAdmin”进入用PHP编写的MySQL管理软件phpMyAdmin。
在phpMyAdmin界面“创建一个新的数据库”下文本框中填入“joomla”创建Joomla的数据库,库名为“joomla”。
单击“创建”按钮提交创建。
提交请求后,phpMyAdmin跳转到该数据库管理页面,系统在右侧页面中提示“数据库joomla已经建立”,代表数据库创建操作成功。
左侧创建数据库的数据表列表,由于刚创建的数据库为空,则左侧列表只出现“joomla”数据库名。
[4]
1.1.2Joomla的安装
安装Joomla!
系统:
Joomla!
内容管理系统(CMS)的安装。
[5]
将Joomla!
软件包解压
首先,在XAMPP的htdocs主文件夹中(.\xampp\htdocs)建立目录“joomla”,将安装包复制到目录中,单击鼠标右键,选择“解压到当前文件夹”。
进入安装界面
解压缩完毕后,然后打开浏览器,输入网址http:
//localhost/joomla,进入Joomla!
安装界面,选择“zh-CN”,然后单击“下一步”按钮。
安装前服务器环境检查
必须符合要求的检查工程。
如果有某些工程显示为红色,说明服务器环境设置不符合必需的最低要求,更改配置,刷新重新检查是否通过检测。
协议
本步是阅读并接受Joomla!
协议,单击“下一步”继续。
数据库配置
数据库类型选“mysql”。
主机名填入“localhost”,用户名填“root”,由于MySQL的“root”用户默认状态是没有密码,所以密码不填。
“数据库名称”里填入“joomla”,单击“下一步”继续。
FTP配置
Joomla1.5的文件处理的一种新机制,也可以在安装以后通过后台管理控制界面进行管理,在这里我们直接单击“下一步”。
Jmoola设置
1.站名设置:
在“本站名称”里填入站点的名称。
2.管理员邮件和密码设置:
填入您的邮件地址以及管理后台所用的密码。
3.加载样例数据:
单击“安装网站的示范内容”进行示例数据的安装。
单击“下一步”完成Joomla!
的安装。
完成安装
本步是完成界面,提示安装成功。
但提示必须删除installlation目录。
删除installlation目录后,回到joomla安装结束界面,单击“浏览本站”进入前台,或单击“进入管理后台”进入后台管理界面,开始Joomla之旅途。
Joomla前台和后台
Joomla系统分为前台和后台两部分。
前台展现给网站访问者,用于发布网站内容,提供访问者服务。
后台供站点管理者使用,提供对应于前台内容、服务的管理设置功能。
[6]
1.2网站的设计主题与思路准备
我们要做的是个人成长历程网站,因此主要应该要体现个人特色。
我们的水平自然是有限的,所以上面的有些东西都是从网上优秀的个人网站上借鉴来的,例如布局和样式。
总体来说网站的布局,是统一的,这样在浏览的时候不至于显得太混乱。
[7]
整个网站大体分七部分:
“我的日志”“我的相册”“我的视频”“我的朋友”“我的关注”“我的音乐”“留言板”。
1.3网站的图片素材准备
Photo图片文件夹的准备。
1.4网站的视频素材准备
Video视频文件夹的准备。
1.5网站的文字素材准备
Diary文章文件夹的准备。
2、网站中期
2.1全局配置
Joomla可以分为两个部分,管理后台和网站前台。
后台是管理和创造内容的地方,一般只有网站的管理人员才能看得到,网站前台是给用户看的,它是用来显示网站内容的。
登录网站后台
首先,打开后台的地址是http:
//localhost/joomla/administrator/index.php,默认管理员账号密码,用户名admin,密码为安装Joomla时设定的密码。
全局设置
点击登录进入管理后台的控制面板
首先我们要更改网站服务器时区,点击全局设置。
点击服务器选项,并更改为北京时间,点击保存。
后台语言管理
点击语言管理,点击进入页面后可见所有选项,其中五角星标志的为默认语言,可点击更改后台语言。
[8]
2.2模版管理
通过后台更改前台显示预览。
首先,我们通过预览查看前台显示的网站。
回到网站管理后台,点击扩展菜单下的模板管理。
我们看到Joomla默认安装了三个模板,每一个模板都可以让网站前台变得不一样,当我们把鼠标停留在模板名称的上面时显示出模板的缩略图,让我们大致了解一下模板的前台显示界面。
点击名称前的圆圈并设置成默认模板,便可得到不同示样的前台。
[9]
2.3分类管理
2.3.1分类类型的添加
进入网站管理后台,点击分类管理。
进入单元管理后,点击右上角“创建”按钮,创建标题为“个人隐私”的单元并保存,单元创建完成,点击“内容”→“分类管理”,点击右上角创建“我的日志”的分类,并在单元分类中选择“个人隐私”,访问级别选择“公开”。
并按照上述方法,创建“我的相册”“我的视频”“我的朋友”“我的关注”“我的音乐”“留言板”分类。
[10]
2.3.2添加分类文章
进入网站管理后台,点击“内容”→“文章管理”→“创建”。
把编写好《半年一年》文章粘贴进去,设置“标题”,选择“我的日志”分类,设置其他项,设置好之后点击“保存”按钮,设置精选,在首页显示,刷新前台并浏览。
重复上述动作,添加《无限》《木偶戏》《退三舍》等文章。
[11]
2.3.3文章的排版
推荐文章到首页
打开“文章管理”,找到我们想要推荐到首页的文章,点击“首页”栏目的“X”,变为“√”则为推荐成功。
我们把视频“我要当舅舅了”推荐到首页。
修改菜单参数
打开“菜单”→“mainmenu”→“Home”,进入“Home”,基本参数包括“头条文章”、“引言”、“栏”和“链接数”,设置参数“头条文章”为0、“引言”为3、“栏”为3、“链接数”为4,我们还可以对不满意的文章进行除,点击“内容”→“首页文章”,选中要删除的文章,点击“删除”,现在首页的文章有“作者”、“创建时间”等等信息,但是标题连接不到文章上,回到“Home”的组件参数,进行设置。
菜单的排序
点击“内容”→“分类管理”,在分类管理列表中点击“排序”中的小三角形修改排序号来排序。
同上在“Home”菜单的高级参数中,也可以更改“默认排序”。
影响文章排序的方式另一个因素是文章分类的顺序,在首页菜单的高级参数里面我们可以设定文章分类排序方式,设置“菜单项”→“文章分类排序”→“排序”,基本参数中“引言”设为7。
我们这里按照“我的日志”“我的相册”“我的视频”“我的作品”“我的朋友”“我的关注”“我的音乐”“留言板”来进行排序。
文章的统一参数设置
以上我们已经为我们的文章添加了图片,视频等内容,我们发现在文章标题的下栏中有关于作者的信息,文章发布的时间,右上角有PDF、打印、邮件等小图标,这些我们可以通过文章编辑的文章参数可以调整,但是我们需要每发一篇文章就要更改一次参数吗?
这里我们可以通过修改文章的统一参数来调整,点击“内容”→“文章管理”→“统一参数”进入设置,使其更加工整美观。
[12]
2.3.4Logo的修改
首先我们用一些图形设计工具设计好Logo,这里准备的图片是logo.gif。
将设计好的Logo命名为“logo.gif”,放入“E:
\XAMPP\htdocs\joomla\templates\beez\images”中替换原来的Logo,刷新前台。
[13]
2.4菜单管理
在主菜单添加菜单项
点击“菜单”→“mainmenu”,点击进入“Home”,更改“标题”为“首页”。
创建一个新的菜单项
进入“分类-文章类别列表式布局”,基本参数“分类”为“我的日志”。
头条文章,“引言”,“栏”,“链接数”,依次设置。
“标题”设定为“我的日志”,高级参数中“多栏排序”选择横向排序。
按照上述方法一次创建“我的相册”“我的视频”“我的朋友”“我的关注”“我的音乐”“留言板”菜单工程。
2.5模块管理
Joomla的模板里面已经定义好了一些位置,我们首先看一下现在我们使用的这个模板上的位置分布,打开“扩展”→“模板管理”,点击我们正在使用的模板“beez”。
进入模板“beez”,点击“预览”,其中红色标注的就是模板定义的位置。
2.5.1搜索的添加
回到模块管理,点击“创建”→“搜索”,标题命名为“搜索”,位置选择“use4”,点击应用。
2.5.2面包屑的添加
回到模块管理,点击“创建”→“面包屑(导航路径)”,点击进入,输入标题“导航路径”,将位置放到“breadcrumb”位置上,首页入口的文字修改为“首页”,点击保存。
2.5.3创建自定义模块
自定义模块可以让我们自己定义显示在模块里面的内容,可以输入文字、可以插入图片或者视频。
创建一个自定义模块,显示在网站底部,做为网站的版权声明,打开“扩展”→“模块管理”→“创建”→“定制html”,标题命名为“版权声明”,显示标题为“否”,位置选择“footer”。
2.5.4附加功能的添加
给网站加入在线QQ功能
打开一个QQ在线状态的生成网站,输入你的QQ账号、密码进行登录。
进入编辑页面,选择代码类型为“完全公开”,图片留言“我是客服一号”,在线状态风格可以更改选择一个自己喜欢的图标,点击确定,复制公开代码。
回到网站管理后台,创建一个“定制HTML”的模块,标题为“QQ在线”,代码复制到自定义输出(点击编辑器的HTML,复制到HTML面板,更新)。
点击保存,刷新前台。
[14]
3、组件的应用
组件可以扩展Joomla的功能,让我们的Joomla变得更加强大。
Joomla里面可用的组件很多,它们可以完成不同的任务。
我们可以根据自己对网站功能的需求为网站安装相应的组件。
3.1投票组件的应用
点击“组件”→“投票调查”,点击“创建”进入编辑投票调查页面,进入编辑界面,在细节设置里面命名“标题”为“我网站怎么样?
?
”,在选项里面输入调查问卷的一些选项,这里“选项1”为“网站的风格你们喜欢吗?
”,“选项2”为“你们觉得网站有什么地方需要修改?
”,“选项3”为“如果是十分,你们给我的网站打多少分?
”,已发布位置点击“是”。
下面我们还必须创建一个模块来显示我们的调查问卷,点击“扩展”→“模块管理”,创建“投票调查”模块,标题为“投票调查”,位置为“use1”,模块参数中投票调查选择“您对我们的服务是否满意”,点击保存。
下面我们对投票调查做个测试,点击“选项1”→“投票”,即可看到投票的结果。
3.2留言板组件的应用
安装并使用留言组件,点击“扩展”→“安装卸载”→“浏览”,选择我们需要安装的“com_easybook_v2.0_RC4_zh-CN”,安装完成后提示安装成功,下面我们创建一个菜单项,让它链接到这个组件。
点击“菜单”→“常用菜单”→“创建”,选择“easybook”标准布局。
命名标题为“在线留言”,组件参数中显示Easybook为“隐藏,”允许发言的群组更改为“Everybody”,添加上留言内容点击“提交留言”即可,为了防止有人发布垃圾信息,还需要为留言板安装一个验证码组件“com_easycaptcha_v2.0_RC2_zh-CN”,安装完成后进入在线留言的菜单项,组件参数中启用验证码项选择“是”,就可以使用了。
4、插件的使用
插件就是一些扩展Joomla功能的小东西,通常每一个插件都可以完成一个特定的任务。
插件有许多类型,有些插件用在文章中,比如我们即将安装并且使用的相册插件,使用它可以在文章中插入一个可以自动生成缩略图的相册。
还有一些插件提供网站内容的搜索功能,有的插件能够生成页面缓存,可以让网站速度变得更快。
[15]
4.1图片文件的添加
打开管理后台,点击“扩展”→“安装卸载”进入安装界面,安装相册插件plg_verysimple_gallery_1.5.3,安装完毕后提示安装成功。
在默认情况下,新安装插件的状态都是禁用的,下面我们启用安装的相册插件。
点击“扩展”→“插件管理”,选择类型“content”筛选,找到插件“VerySimpleImageGalleryPlugin”,选择启用并保存,点击“VerySimpleImageGalleryPlugin”进行编辑参数,相册宽度修改为“760”单位设置为“像素”,对齐方式选择“左对齐”,缩略图宽度设置为“65”,缩略图高度设置为“35”,缩略图质量“100”,缩略图之间的空间“8”,缩略图显示位置“在大图的右边显示”,设置完成后点击保存,我们要使用VerySimpleImageGalleryPlugin这个插件,必须在文章中使用一个命令,在VerySimpleImageGalleryPlugin插件的简介中有这个命令,命令为{vsig}文件夹名称{/vsig},打开“网站”→“媒体管理”,这里面显示的是已经上传到我们服务器中的图片。
我们点击左面菜单栏中的“stories”,建立一个新的文件夹,点击“创建文件夹”,,命名为“ainimal”,点击“ainimal”文件夹,进入文件夹里,点击“浏览”→“开始上传”,选择图片进行上传,回到“文章管理”选择我们要插入相册的文章,并选择相册显示的位置,输入相册显示命令{vsig}ainimal{/vsig},则在“我的照片”-《动物园》中就可以浏览。
按照上述做法添加《成长站》-----正定站,我的小外甥,《成长站》-----天津站等照片文件。
4.2音乐文件的添加
打开管理后台,点击“扩展”→“安装卸载”进入安装界面,安装“com_avreloaded-1.2.4”,安装完毕后提示安装成功。
点击“扩展”→“插件管理”,找到插件“com_avreloaded-1.2.4”,点击启用。
我们要使用VerySimpleImageGalleryPlugin这个插件,必须在文章中使用一个命令,在VerySimpleImageGalleryPlugin插件的简介中有这个命令,命令为{MP3}文件夹名称{/MP3},打开“网站”→“媒体管理”,这里面显示的是已经上传到我们服务器中的歌曲。
回到“文章管理”选择我们要插入歌曲,并选择歌曲显示的位置,输入歌曲显示命令{MP3}zheyangaile{/mp3},则在“我的歌曲”-《这样爱了》中就可以浏览。
按照上述做法添加《遗憾》《到不了》等歌曲文件。
4.3视频的添加
我们要使用VerySimpleImageGalleryPlugin这个插件,必须在文章中使用一个命令,在VerySimpleImageGalleryPlugin插件的简介中有这个命令,命令为{视频文件格式}文件夹名称{/视频文件格式},例如{MP4}文件夹名称{/MP4}。
打开“网站”→“媒体管理”,这里面显示的是已经上传到我们服务器中的视频。
回到“文章管理”选择我们要插入视频,并选择视频显示的位置,输入歌曲显示命令{mp4}borther{/mp4},则在“我的视频”-《我们小小的青春》中就可以浏览。
按照上述做法添加《我要当舅舅了,呵呵呵呵》《和我一起成长的小松鼠》等视频文件。
5、网站后期
5.1网站的测试
测试网站的跳转和链接,是否能正常跳接到指定界面。
测试投票,QQ等组件能否正常使用。
5.2网站的调试
进入后台,调试有问题的链接,进入前台继续测试。
调试如果不成功,继续调试。
注释
[1]XamppSurhone,LambertM.、Timpledon,MiriamT.、Marseken,SusanF.VDMPublishingHouse(2010-07出版)。
[2]数据库系统概论(第4版)王珊、萨师煊高等教育出版社(2006-05出版)。
[3][4]同上。
[5]廖旻可、吴涛涛:
《Joomla建站步步通》,人民邮电出版社,2009年,第23页。
[6]Joomla之门网站,。
[7]于丙超:
《网站开发:
工程规划、设计与实现》,电子工业出版社,2004年,第55-58页。
[8]郭順能:
《Joomla!
2.5素人架站計畫》,碁峰資訊股份有限公司。
[9]陈红飞:
《PHP内容管理系统:
Joomla快速建站指南》,电子工业出版社。
[10]王学军:
《网站建设与规划》,武汉理工大学出版社
2005年,第25页。
[11]张红
章剑林:
《网站建设》,高等教育出版社,第35页。
[12]徐磊:
《网页制作与网站建设技术大全》,清华大学出版社。
[13]王静等:
《AdobePhotoshopCS4网页设计与制作标准实训教程》,印刷工业出版社。
[14]《HTML5+CSS3网页布局和样式精粹》,清华大学出版社。
[15]导向工作室:
《24小时学会网站建设》,人民邮电出版社。
参考文献
1Joomla之门网站,。
2《HTML5从入门到精通》,清华大学出版社。
3《HTML5+CSS3网页布局和样式精粹》,清华大学出版社。
4王静等:
5郭順能:
6廖旻可、吴涛涛:
《joomla建站步步通》,人民邮电出版社。
7陈红飞:
8杨宇等:
《PHP典型模块与工程实战大全》,清华大学出版社。
9胡嘉玺:
《BLOG启示录:
WordPress博客建设与经营
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 个人 成长 历程 网站 设计 实现 大学 课程
![提示](https://static.bdocx.com/images/bang_tan.gif)