课程设计Ⅴ课程设计设计说明书个人博客管理网站学生姓名学号班级成绩指导教师课程设计任务书2011—2012学年第二学期专业:信息管理与信息系统学号:姓名:课程设计名称:课程设计V课程设计设计题目:个人博客管理网站完成期限:自2012 年 2 月20 日至2012 年 3 月 2 日共 2 周设计依据、要求及主要内容(可另加附页):现在的很多网站都是用户建立的一个日记网站,也就是博客网站。
用户可以通过书写博客把自己的心情,想法等通过互联网和朋友交流。
本次课程设计依据《网页设计》课程所学的内容,结合现在网站发展的趋势和布局要求,利用Macromedia Dreamweaver 、visual studio 、Fireworks和Flash等网页设计工具,建立一个基于的个人博客网站。
具体要求及主要内容:1.利用c#作为博客的开发语言。
2.后台数据库可以采用ACCESS或者SQL SERVER。
3.网站首页的导航菜单准确无误,无死连接。
4.利用CSS样式,美化网站的字体和颜色。
5.进入任何一个博客页面都可返回首页。
页面显示没有错误。
6.管理员可登陆博客后台管理博客。
要求能自定义的博客的栏目,发表博文和图片。
7.管理员可以随时修改和删除发布的博文。
指导教师(签字):教研室主任(签字):批准日期:年月日博客是开放的私人空间,可以充分利用超文本链接、网络互动、动态更新等特点,可以以文会友,结识和汇聚朋友,进行深度交流沟通。
本次课题个人博客系统主要用于发表个人最近日志,记录一些心情感想的一种网页形式博客。
本网站主要是利用visual studio2010 制作而成,并结合Fireworks和Flash等网页设计工具进行网页的设计,后台采用SQL SERVER 2005数据库,使用c#语言设计的一个个人博客管理动态网站。
关键词:visual studio2010;个人博客;动态网站1 课题描述 (3)2 设计过程 (4)2.1 需求分析 (4)2.2 系统流程图 (4)2.3功能结构分析 (5)2.4数据库设计 (6)2.5前台页面设计 (8)2.5.1母版页设计 (8)2.5.2首页设计 (8)2.5.3留言板设计 (10)2.6后台页面设计 (10)2.6.1后台页面布局设计 (10)2.6.2文章管理设计 (11)2.6.2留言管理 (13)2.6.3相册管理 (13)3 测试 (15)3.1后台管理登陆 (15)3.2博客管理 (16)3.2.1添加文章验证 (16)3.3.2删除文章验证 (16)3.3.3修改文章验证 (17)3.3留言管理 (17)3.4.1修改照片信息验证 (18)3.4.2上传照片验证 (18)总结 (19)参考文献 (20)1 课题描述本次课题是要完成一个集日志发表、后台管理为一体的个人博客管理系统。
在前台游客可以查看相册、博文、等并可在留言板中添加评论。
后台管理可以实现的功能有:博文的添加、修改和删除;照片的添加、删除以及分类;查询删除留言等。
界面直观、操作简单,内容布局条理清楚,版面协调、统一,能够实现方便快捷的管理与维护。
开发工具:、visual studio 2010、SQL server 20052 设计过程该博客网站包括前台浏览和后台管理两部分功能。
实现过程包括三部分:前台功能设计,后台设计,数据库设计。
2.1 需求分析本系统的用户包括:普通游客、博客主人。
(1)普通游客进入网站后可以浏览博客文章和博客相册,并在浏览博客后进行评论。
(2)博客主人通过前台登录后,可对自己的博客空间进行管理,包括发布自己的网络日志, 收藏个人照片,相关人员进行交流和沟通以及删除访问者发表的评论等。
(3)在博客管理界面,博主可以对自己的博客类型进行管理。
包括:添加、编辑和删除博客类型。
(4)博主可以暂时不发布博客,而是将文章先放到草稿箱等以后要发布时,再从草稿箱中提出,还能够将回收站中的博客还原或者将博客从回收站中彻底删除。
(5)博主还可以上传图片文件,同时进行管理,包括浏览和删除操作。
(6)博主能够对游客的评论进行管理,包括查询和删除操作。
2.2 系统流程图后台业务流程:(博主操作流程)见下图:图 2.1 后台业务流程图前台业务流程:(游客操作流程)见下图:图 2.2 前台业务流程2.3功能结构分析此系统主要包含两个方面,一为前台信息显示系统即普通游客空间、二为后台信息管理系统即管理员管理空间。
前者是面向公众的一个窗口,通过前台信息显示系统方便普通游客浏览日志、评论和留言。
后台信息管理系统在管理员登录后,管理员可以发表日志;回复评论和留言;管理日志、评论、留言及个人信息等。
系统的基本功能结构图如图2.1所示。
图2.3 功能结构图普通游客模块:主要是为了让访问本博客的游客对博客有一个基本的了解。
通过游客的评论和留言了解游客对本博客博主博文的评价,以便于同博主更好的互动和交流。
博客主人管理员模块:主要实现对所发表的博文、评论及留言信息进行管理,对博客各个方面的管理与维护以便网站更好的运行。
其个管理模块的功能有:文章管理:管理员可以对博文进行分类管理、添加分类、添加博文等操作。
相册管理:管理员可以对照片进行分类管理、添加分类、添加或删除照片等操作。
留言管理:管理员可以回复或者删除游客留言。
2.4数据库设计本系统采用SQL Server 2005作为开发工具。
根据系统需求分析和保证数据统一、完整和高效的原则,需要对数据库进行合理的设计。
首先先在SQL Server 2005中建立一个名为“blog”的数据库来存放本系统所必须的数据表。
本系统数据库中主要的数据表分别为用户注册表(Register), 博客类别表(Class),博客文章表(News),图片文件表(Photo),博客留言表(Message)。
如表2-1—2-5所示:表2-1用户注册表表2-2博客类别表表2-3博客文章表表2-4图片文件表表2-5博客留言表2.5前台页面设计2.5.1母版页设计利用母版页可以将前台的几个页面创建一致的布局。
单个母版页可以为应用程序中的所有页(或一组页)定义所需的外观和标准行为。
然后可以创建包含要显示的内容的各个内容页。
当用户请求内容页时,这些内容页与母版页合并以将母版页的布局与内容页的内容组合在一起输出。
如下图2.4为site2.master的设计图。
图 2.4 母版页设计图2.5.2首页设计首页作为内容页面被包含在母版页site2.master的占位符控件显示最新文章、友情链接、相册以及留言。
如图2.5所示。
图2.5主页面主要具体代码如下:<asp:Content ID=""ContentPlaceHolderID="Left"runat="server"><uc1:LeftList ID="LeftList1"runat="server"/></asp:Content><asp:Content ID=""ContentPlaceHolderID="Right"runat="server"><asp:Repeater ID="Repeater1"runat="server"><ItemTemplate><div id="c-right"><div class="Page"><h3><a href='<%#Eval("news_id","Next.aspx?id={0}")%>'target="_blank "><%#Eval("Title") %></a></h3><p class="botime"><%#Eval("AddDate") %></p><p class="bod"><%#BindBody(Eval("Body").ToString()) %></p><p class="show">浏览 | 评论</p><br></div></div></ItemTemplate></asp:Repeater>2.5.3留言板设计留言板主要是把访客的留言显示出来,是一个博主与游客谈心交流的地方,在留言板中可以畅所欲言,就感兴趣的话题展开讨论与大家进行交流和沟通。
留言模板页面如图 2.6所示。
图 2.6 留言板主要代码如下:<div id="inner"><div><uc1:liuyan ID="liuyan1"runat="server"/></div><br/><br/><uc2:huifu ID="huifu1"runat="server"/></div>2.6后台页面设计2.6.1后台页面布局设计后台页面使用框架iframe来搭建页面。
iframe元素会创建包含另外一个文档的内联框架。
如下图2.7图2.7 后台页面设计图主要代码如下:<div id="inner"><div><iframe name="top"src="../html/top.htm"scrolling="no"framebord er="0"width="700px"></iframe></div><div><iframe name="out"src="../html/outlookleft.html"scrolling="no" frameborder="0"width="180px"height="530px"></iframe></div><div><iframe name="cen"src="../html/Main.htm"scrolling="no"framebor der="0"width=" 465px"height="479px"></iframe></div></div>后文中用target属性来设置页面<li><a href="../Manage/ManangeNews.aspx"target="cen">文章管理</a></li>2.6.2文章管理设计博主登录后单击导航栏“添加文章”即可进入添加文章页面。