博达站群培训讲义-创建网站

1、 培训讲义西安博达软件有限公司XIAN WEBBER SOFTWARE CO., LTD.地址：中国西安高新开发区(东区)火炬路3号楼10层C区 邮编：710043电话：+86-29-82681001传真：+86-29-82682009网址：第 PAGE 32 页 共 NUMPAGES 32 页 培训讲义培训讲义创建网站文件编号：BDQP文件版号：1.0 文件页数：共页 生效日期：2010-8-17拟 制：冀晓璐 日 期：2010-8-10 审 核： 日 期： 批 准： 日 期：西安博达软件有限公司目 录 TOC o 1-4 h z u HYPERLINK l _Toc269908891 1.

2、产品概要 PAGEREF _Toc269908891 h 3 HYPERLINK l _Toc269908892 1.1 培训目的 PAGEREF _Toc269908892 h 3 HYPERLINK l _Toc269908893 1.2 适用范围 PAGEREF _Toc269908893 h 3 HYPERLINK l _Toc269908894 2.功能模块讲解 PAGEREF _Toc269908894 h 3 HYPERLINK l _Toc269908895 2.1 内容管理 PAGEREF _Toc269908895 h 3 HYPERLINK l _Toc269908896

3、 2.2网站管理 PAGEREF _Toc269908896 h 4 HYPERLINK l _Toc269908897 3.实例讲解 PAGEREF _Toc269908897 h 5 HYPERLINK l _Toc269908898 3.1文件|模板 PAGEREF _Toc269908898 h 5 HYPERLINK l _Toc269908899 3.1.1 上传插件 PAGEREF _Toc269908899 h 6 HYPERLINK l _Toc269908900 3.1.2 新建模板 PAGEREF _Toc269908900 h 7 HYPERLINK l _Toc269

4、908901 3.1.3 页面编辑模式 PAGEREF _Toc269908901 h 9 HYPERLINK l _Toc269908902 3.1.4 页面的组件化实施 PAGEREF _Toc269908902 h 9 HYPERLINK l _Toc269908903 3.1.5 系统组件库 PAGEREF _Toc269908903 h 9 HYPERLINK l _Toc269908904 3.1.6 新闻列表的添加 PAGEREF _Toc269908904 h 10 HYPERLINK l _Toc269908905 3.1.7 变换图片的添加 PAGEREF _Toc2699

5、08905 h 13 HYPERLINK l _Toc269908906 3.1.8 图片列表的添加 PAGEREF _Toc269908906 h 14 HYPERLINK l _Toc269908907 3.1.9 链接列表的添加 PAGEREF _Toc269908907 h 16 HYPERLINK l _Toc269908908 3.1.10 网站导航的添加 PAGEREF _Toc269908908 h 18 HYPERLINK l _Toc269908909 3.1.11 版权组件的添加 PAGEREF _Toc269908909 h 19 HYPERLINK l _Toc269

6、908910 3.1.12 二级页面的组件化实施 PAGEREF _Toc269908910 h 20 HYPERLINK l _Toc269908911 3.1.13 内容页模板 PAGEREF _Toc269908911 h 21 HYPERLINK l _Toc269908912 3.2 栏目创建 PAGEREF _Toc269908912 h 22 HYPERLINK l _Toc269908913 3.2.1 新增栏目 PAGEREF _Toc269908913 h 22 HYPERLINK l _Toc269908914 3.2.2 栏目工具条 PAGEREF _Toc269908

7、914 h 26 HYPERLINK l _Toc269908915 3.2.3 修改栏目名称 PAGEREF _Toc269908915 h 29 HYPERLINK l _Toc269908916 3.2.4 栏目排序、删除 PAGEREF _Toc269908916 h 29 HYPERLINK l _Toc269908917 3.3 内容库 PAGEREF _Toc269908917 h 291.产品概要 博达软件公司的“VSB9网站管理平台”是一套建站平台，通过该平台就可以很轻松地把制作的静态页面创建成一个动态可维护的独立网站发布，并提供强大的后台管理功能，给管理员的维护工作节省了大

8、量时间。1.1 培训目的为了使用户能很快了解我们产品，并且利用该产品能很轻松方便的进行网站维护工作，并能独立创建网站、对已有网站进行简单改版工作，通过培训能快速掌握创建网站的整体思路。1.2 适用范围适合学习网站创建的项目培训以及公司内部新员工培训。2.功能模块讲解VSB9网站管理平台建站系统包含：【内容管理】、【网站管理】两大主要功能。2.1 内容管理VSB9网站管理平台提供强大的内容管理，可以实现信息数据的批量导入功能，可以对各类文档进行入库导入。这里我们不作为重点进行讲解。2.2网站管理VSB9网站管理平台中网站管理主要包含：【网站建设】、【备份恢复】、【用户和权限】、【网站统计】、【网

9、站安全】、【文章采集】及【其他设置】七个主要功能模块。VSB9网站管理平台是一套利用静态页面创建动态网站的过程，那么首先需要我们实施人员先准备好静态页面（即设计好.htm（.html）格式静态页面）。【网站建设】模块是整个建站过程中的核心、重点模块，该模块提供整个网站创建过程中的页面导入、图片样式导入、网站模板建立、网站栏目生成以及页面静态部分变动态维护的实施等功能。下面的章节中我们重点对【网站建设】进行实例讲解。网站在网站建设模块建立好之后，整个网站的框架就被搭建起来了，就到了我们“管理内容”部分。3.实例讲解（序：讲解实例建站之前，讲述以下创建网站中各个功能模块的作用）点击【创建网站】，我

10、们可以看到如图所示：213第1部分：VSB9网站管理平台所包含的功能模块；第2部分：该平台中【网站建设】所包含的功能模块；从图中我们可以看出，创建网站包含文件|模板、栏目、内容库三个模块。文件|模板：管理整个网站的文件和模板页。模板页是我们建站的基础，网站前台 所显示的栏目就是以其所调用的模板页的样式来显示的。 栏目：网站的层级，也是网站前台显示的结构。 内容库：网站维护资料存放的地方。 下面我们来具体看一下这三个模块：3.1文件|模板点击2中的文件|模板，然后再点击3中的点击这里开始管理文件|模板，打开如图界面：新建模板：可以新建一个空的模板页。上传文件：用来把本地机上的文件、图片等上传到系

11、统中。新建目录：新建一个网站目录，相当于新建一个文件夹，这样我们就可以把相关的东西放在一起，方便查找。上传插件：我们用它来把本地机上的静态页面、图片、视频、样式表等传到系统中去，用它上传页面的好处是我们只需要选中要上传的页面，而不需要管页面中的图片和样式等，系统会自动把页面中的图片和样式放在相应的路径下。上传插件点击上图中的批量上传文件按钮，打开页面：点击下载安装，将上传插件VSBIEHelperSetup.exe下载到本地计算机，进行安装，安装完成之后，重启ie浏览器，我们就可以用它来进行批量上传文件及上传页面了。下面我们来看看如何使用该插件在新建模板时进行页面的上传。新建模板利用VSB9创

12、建网站的第一步是导入已有的静态页面，新建模板：在网站建设文件|模板处，要建立网站需要的模板，有两种方式：一、直接新建空白的模板；二、新建导入本地静态页面的模板。新建模板时，从两方面创建所需的模板。熟悉系统，可直接创建相应的模板，创建完成后，再用组件库中相对应的组件实现相应的功能；不熟悉系统，创建时选择相应的模板类型，则在组件库分类下会出现适合本模板类型所需的关联组件和通用组件。在此以新建模板，选择模板类型为例进行讲解。点击图中的“”，根据系统提示“没有首页模板无法正常预览网站，请建立index.jsp模板作为首页模板”，新建一个网站首页，如图所示：图在打开的对话框中，输入模板名称和标题，点击【

13、选择html源文件】上传静态页面，静态页面上传成功后选择模板类型。【例】在此输入的信息为： 模板名称：index.jsp 标 题：首页 源 文 件：index.htm 模板类型：首页注意：在源文件处，选择本地的Html源文件，则在模板创建成功后，此静态页面上所有的图片、样式等都会自动传到系统中，并归属到默认的图片、样式分类目录中。点击“”，模板创建成功后，则页面自动跳转到模板的编辑模式。页面编辑模式页面的编辑模式有三种：预览、设计和代码。预览就是页面在前台显示的样子，设计是我们对页面进行组件化实施、编辑、修改的地方，而代码状态显示的是这个页面的html代码。页面的组件化实施设计模式点击前面的方

14、框，我们就可以看到页面上的表格了。直观显示这个模板页面的排版、组件的布局、然后将静态页面上需要维护的、要进行资料添加的部分删掉，用我们的组件来代替，可以对组件的样式配置和部分组件的资料维护。页面组件系统组件库 如图，系统按照组件的属性和功能用途的不同，将其分成了不同的类别。我们可以将这些展开，找到自己需要的组件拖拽到页面中。 新闻列表的添加如图，页面上中间的部分是一条一条的新闻，它肯定是需要后期进行资料维护的部分，那我们选中这个单元格中的内容，删除内容，然后到组件库中找和它样子比较接近的组件（不过，样式不是完全一样也没关系，因为我们可以在样式配置里面具体调整将其配成我们想要的样子。）我们要加的

15、是一条条的新闻，所以可以找新闻列表，如图，在推荐组件中，打开新闻列表，找一个和我们静态页面显示的样子比较接近的，鼠标放在组件上就可以看到它的预览的样子了。然后将其拖到页面上相应的位置。如图，在组件库中鼠标左键单击要拖拽的组件，按着不放到要放的位置，松开。保存页面。那么这里我们先讲讲单个组件上面五个功能按钮分别的作用，首先我们看第一个: :可以修改页面组件名称、配置页面组件样式、页面组件代码编辑及移出此页面组件；：资料添加、编辑按钮；：配置页面组件样式按钮；：移动组件位置按钮；：移出页面组件按钮。点击，对标题列表进行样式配置，如图，我们可以设置新闻的显示条数，字体样式和大小，也可以对其进行前导图

16、或者前导符的配置等（实际培训时设置下可以看下效果），设置完成之后一定要记得点击按钮，这样我们的设置才可以生效。变换图片的添加 如图，页面左边下面的部分，是由一张张的变换的图片组成的，所以我们在推荐组件中的里面选择变化图片组件，找一个样式比较接近的，拖到页面中相应的位置，拖拽方法和新闻列表是一样的。如图保存页面，如图点击，打开样式配置窗口，可以把它配成想要的样子，点按钮保存设置，如图。图片列表的添加 如图，页面左边下面的部分，是由一张张的图片组成的，因为刚才是一张张的图片，所以我们在栏目组件里面选择图片列表，找一个样式比较接近的，拖到页面中相应的位置，拖拽方法和新闻列表是一样的。如图保存页面，如

17、图点击，打开样式配置窗口，可以把它配成想要的样子，点按钮保存设置，如图。链接列表的添加如图，页面上认证标准介绍下面的部分应该是一个个的链接，所以我们删除掉页面上的静态的部分，用我们的组件来代替。然后在我们的组件库里面找和它样式比较接近的，因为是链接，所以我们在栏目组件里面找链接列表，然后将其拖到页面中相应的位置。如图保存页面，点击，打开样式配置窗口，可以把它配成想要的样子，点按钮保存设置，如图。网站导航的添加和前面的组件的添加方法是一样的，我们可以将静态页面上的部分删掉，然后将网站导航组件拖到页面上的相应的位置.然后，保存页面。备注：网站导航组件分为图片导航和文字导航两种，图片导航就是说网站上

18、的导航是用图片做的，文字导航就是说网站上的导航是文字。点击按钮，可以设置网站导航的获取方式，或指定栏目，也就是说点，可以设置导航条从哪里开始显示。如图：点击按钮，可以配置网站导航的显示样式，如图：版权组件的添加 如图，版权组件的添加方法和前面的也是一样的，把静态页面的部分删掉，然后在基本组件，基础信息中拖版权组件到页面上相应的位置，点击保存页面就可以了。页面上的需要组件实施的部分大概也就是这几种，我们都可以按照上述的方法，将整个页面实施。然后我们看二级页面。二级页面的组件化实施 其他页面的实施和上述的方法是一样的，（具体实施二级页面），我们可以根据需要实施。 如果我们要拖拽到页面的组件，其他页

19、面上已经有了，那我可以直接从其他页面将组件直接拖到本页面。如图，直接从首页拖个版权组件到二级页模板，弹出一个对话框。引用这个组件：如果选引用组件的话，就是说我们的这个组件和首页上的组件实际上是一个组件，任一个改动另外一个也跟着改。复制这个组件：如果选复制这个组件，就是说我们的这个组件只是首页上组件的一个副本，复制时它们的样式是完全一样的。但是改一个另外一个不会跟着改。然后根据页面布局，拖拽翻页标题列表组件至栏目页。如图内容页模板系统把添加了新闻内容组件的页面就默认为新闻样式页。打开内容页模板，把中间显示内容的静态部分删掉，然后在栏目组件里面拖一个新闻内容新闻内容组件，如图： 保存页面，系统就会

20、自动把这个加了新闻内容组件的页面认为是新闻内容页了。网站的模板页已经建立起来了，下面我们来看一下怎样根据这些模板来生成网站前台显示的一个个栏目，从而生成我们的整个网站。3.2 栏目创建如图，点击栏目，进入栏目管理，再点击页面右下角的点击这里开始管理栏目，进入网站的栏目编辑模块。3.2.1 新增栏目如图，点击系统列出栏目类型我们系统中基本的栏目类型分三种：首页：首页栏目，它是我们网站前台的首页，而且网站必须有且只有一个首页栏目。基本：最基本的栏目类型，也是我们用的最多的一种建设网站的栏目类型。链接：链接栏目，可以链接到网站的任一位置。新建首页栏目：点击，打开如图页面，配置好应用模板，点击配置好模板上组件的内容来源，点击完成按钮。新建基本栏目： 点击，打开如图页面，键入栏目名称和代码，配置好模板页，点击配置好模板上组件的内容来源，点击完成按钮。新建链接栏目： 点击，打开如图页面，键入栏目的显示名称和栏目代码，配置好栏目的链接位置，点击保存。备注：如果要新增的栏目和已有的栏目相似，只是显示的具体内容不同。那么我们可以找到已有的栏目复制，然后找到要新增的栏目的具体位置粘贴。点击后面的改名按钮，将其改为要新增的栏目的名称。然后在内