CN101207450A - 一种专题模板制作方法、系统及客户端和网络侧服务器 - Google Patents

Abstract

本发明公开了一种专题模板的制作方法、系统及客户端和网络侧服务器，包括：客户端通过网络浏览器登录网络侧服务器，从网络侧服务器端获取专题模板制作页面，并在专题制作页面中设置布局和容器，并插入组件，生成专题模板并传送至所述网络侧服务器保存；制作专题模板不需要在客户端安装专门制作的客户端软件，通过网络浏览器所见即所得地进行可视化编辑，降低了编辑人员制作模板的难度，同时也提高了制作专题模板的效率。

Description

一种专题模板制作方法、系统及客户端和网络侧服务器

技术领域

本发明涉及信息发布领域，具体涉及一种专题模板制作方法、系统及客户端和网络侧服务器。

背景技术

随着互联网技术的迅速发展，人们利用这种方便快捷的网络传媒的频率越来越高，而对很多网站来说，网站被用户的关注程度，决定了该网站是否能在互联网领域发展下去，尤其是新闻网站的专题栏目，它是展开深度报道的有效方式，是整个网站的重中之重。

一般的新闻网站通常有栏目和专题，分别使用不同的网页模板展示，网站的普通栏目一般模板改动较少，只是页面的内容变化；专题则不一样，专题一般针对一些突发事件、重大新闻进行报道，因此具有很强的针对性，不同的专题界面布局都有很大的区别，同时专题还要求具备实效性、快捷性，这就需要编辑和美工人员能够快速地完成进行专题网页的制作与发布。

现有专题网页制作通常需要先利用专业制作网页的客户端软件制作出完整的专题模板，然后将专题模板上传到服务器，再将模板设定到栏目或文章上，最后通过发布程序将模板与文章等数据进行合成，生成静态的网页。现有制作专题模板过程存在以下问题：制作专题模板时，首先需要美工和编辑共同确定专题的版式，然后由美工制作专题模板，需要多人同时协作，效率较低；并且由于使用一般网页客户端软件制作专题模板的制作过程烦琐、门槛较高，目前只能由专业美工来完成，并且制作出来的专题模板也难以重复使用。另外，按照现有方法制作专题模板的过程中无法看到专题模板与实际文章同时结合的效果，也就是网页最终发布的效果。

发明内容

本发明提供一种专题模板制作方法、系统及客户端和网络侧服务器，解决了现有专题模板的制作过程中出现的制作门槛较高，并且制作流程繁琐，效率较低的问题。

一种专题模板制作方法，包括：

客户端通过网络浏览器登录网络侧服务器，从所述网络侧服务器获取专题模板制作页面；

所述客户端根据所述专题模板制作页面设置布局和容器，并插入组件，生成专题模板并传送至所述网络侧服务器保存。

一种客户端，包括：登录单元、获取单元、专题模板制作单元、发送单元；

所述登录单元，用于通过网络浏览器登录网络侧服务器；

所述获取单元，用于从网络侧服务器获取专题模板制作页面；

所述专题模板制作单元，用于从网络侧服务器获取专题模板制作页面，并在专题模板制作页面中设置布局、容器，并插入组件，生成所述专题模板；

所述发送单元，用于将制作完成的专题模板传送至所述网络侧服务器。

一种网络侧服务器，包括：页面生成单元、第二存储单元；

所述页面生成单元，用以生成制作专题模板的页面，包括框架视图和模板视图并返回客户端进行显示；

所述第二存储单元，用于存储所述客户端传送的制作完成的框架以及专题模板。

一种专题模板制作系统，包括：客户端和网络侧服务器；

所述客户端，用于通过网络浏览器登录网络侧服务器后，从所述网络侧服务器获取专题模板制作页面，根据所述专题模板制作页面设置布局、容器和插入组件，并传送至所述网络侧服务器；

所述网络侧服务器，用于在网络浏览器中向所述客户端提供专题模板制作页面，以及保存所述客户端生成的专题模板。

本发明提供的专题模板制作方法、系统及客户端和网络侧服务器，客户端通过网络浏览器登录网络侧服务器，从网络侧服务器端获取专题模板制作页面，并在专题制作页面中设置布局和容器，并插入组件，生成专题模板并传送至所述网络侧服务器保存；制作专题模板不需要在客户端安装专门制作模板的客户端软件，通过网络浏览器所见即所得地进行可视化编辑，降低了编辑人员制作模板的难度，同时也提高了制作专题模板的效率。

附图说明

图1为本发明实施例提供的专题模板中布局、容器和组件划分示意图；

图2为本发明实施例提供的专题模板制作方法流程图；

图3为本发明实施例提供的框架视图；

图4为本发明实施例提供的模板视图；

图5为本发明实施例提供的制作完成的模板的实例图；

图6为本发明实施例提供的专题模板制作系统结构示意图；

图7为本发明实施例提供的客户端结构示意图；

图8为本发明实施例提供的网络侧服务器结构示意图。

具体实施方式

本发明实施例提供一种专题模板制作方法，包括：客户端通过网络浏览器登录网络侧服务器后，从网络侧服务器获取专题模板制作页面；客户端根据获得的专题模板制作页面设置布局和容器，并插入组件，生成专题模板并传送至网络侧服务器保存。

本发明实施例中专题模板由布局、容器和组件组成。图1是专题模板中布局、容器和组件划分的示意图，一个专题模板中可以包含多个布局、多个容器和多个组件，其中，容器为所述布局中划分为列的块，用于存放插入的组件；

本发明实施例中组件又划分为静态组件和动态组件；

静态组件包括：文字、图片和Flash；静态组件的组件内容是固定的；

动态组件包括：高级标题列表、高级分页标题列表、高级栏目列表和当前路径；动态组件可以使用组件样式的代码，使动态组件显示各种不同的样式。

专题模板制作页面又划分为框架视图和模板视图，通过专题模板制作页面中分别包含客户端脚本语言javascript引用以及层叠样式表单(CSS，CascadingStyle Sheets)引用来区分，框架视图用于设置布局和容器，模板视图用于在容器中插入组件。

客户端在框架视图中设置布局和容器，并将设置好的布局和容器发送至网络侧服务器保存后，才能进入模板视图，将组件插入选定的容器中，完成专题模板的制作后并传送至网络侧服务器端保存。

下面结合附图，对本发明实施例提供的专题模板制作方法进行详细的阐述。

如图2所示，本发明实施例提供的专题模板制作方法包括以下步骤：

步骤201、客户端将预先制作好的动态组件及组件样式压缩后预先传送至网络侧服务器中保存；

这些动态组件及组件样式是后续制作专题模板所需的基础数据，一般由专业的美工用户在专题模板制作开始之前制作完成并压缩上传，组件样式可以为CSS样式，组件样式包括CSS样式文件以及背景图片文件等。设定样式文件中CSS主文件文件名为main.css，背景图片及CSS文件在主文件中引用，样式文件中的样式名称通过客户端和服务器端统一约定命名，例如约定“.comp”为组件样式名称；“.comp_title”为组件标题样式名称；“.comp_content”为组件正文区域样式名称；用户制作完成后通过压缩工具，压缩后传送至网络侧服务器保存。

步骤202、客户端通过网络浏览器登录网络侧服务器，从网络侧服务器获取专题模板制作页面，在该专题模板制作页面的框架视图中设置布局和容器；

如图3所示，客户端从网络侧服务器获取名为“专题模板编辑器”的专题模板制作页面，在框架视图中包含一个空白模板以及新建框架、新建布局、删除布局、布局调序等操作选项按钮。

新建布局可以从提供的基本布局中选择或用户自定义布局属性；

基本布局包括：通栏布局、两列布局、三列布局；如果用户选择自定义布局，则在自定义布局的选项下选择布局的列数以及每一列对应的宽度。

布局中划分为列的块就是容器，每个容器的宽度在设置布局时已经确定，高度则根据其插入的组件而自动扩展。一个布局只包括一行容器，多行的容器必须通过插入多个布局来实现；

用户可以通过布局调序的按钮来调整设置好的各个布局的上下关系，布局调序的操作选项包括向上调序及向下调序。图3所示的是一个已设置完成的框架，包含4个新建的布局和9个容器，通过对多种布局和容器的混合搭配，能够形成复杂多样的专题模板。

步骤203、客户端设置布局和容器完成后，将框架视图中的内容发送至网络侧服务器保存，同时从网络侧服务器端获取到模板视图，模板视图中有包含已设置好的布局和容器；客户端在模板视图中选择组件插入到选定的容器中；

客户端通过改变用户选定的容器的边框样式，以突出显示该容器，然后客户端可以从网络侧服务器提供的组件列表或者本地存储的组件中选择待插入的组件并插入至选定的容器中。

如图4所示，用户可以在模板视图中插入文字、图片、Flash静态组件以及高级标题列表、高级分页标题列表、高级栏目列表和当前路径等动态的组件。

用户在制作专题模板时，一般会将与该专题相关的文字、图片、Flash存储在本地，以便随时补充和修改。这些静态组件通过“CMS_TPL_EDIT_STATIC”来标识，例如用户将本地存储的文字插入容器中，将待插入的文字对应的html代码插入对应的容器中：

<div id＝”CMS_TPL_EDIT_STATIC”>待插入的文字的内容</div>

如果用户选择将本地存储的图片或Flash插入到选定的容器中，客户端将用户选择的图片或Flash通过表单提交的方式上传至网络侧服务器并保存，网络侧服务器返回存储的该图片或Flash的新的文件名和路径，客户端根据该图片或Flash的新的文件名和路径，将该图片或Flash插入到选定的容器中，例如插入一个图片：

<img src＝”data\attachment\pic\site4\20061021\00115bdf8ea306a40a0f02.JPG”>

当用户选择将存储于网络侧服务器端的动态组件及动态组件对应的组件样式时，网络侧服务器将所述客户端选择的所述动态组件以及对应的组件样式进行解析，生成动态组件对应的html代码并发送给所述客户端，客户端将html代码插入到模板中选定的容器中。

客户端在模板中插入的所有组件都是互相独立的，用户除了将组件插入选定的容器中，还可以对组件进行修改、删除、移动的操作，本发明实施例中这些操作通过DHTML、javascript技术实现，并且可以有多种实现方法，本发明实施例对此不做限定。

客户端将选择的组件插入专题制作模板中所有容器后，就完成了专题模板的制作，图5所示的是一个针对“6.15广东九江大桥事故”的新闻专题制作完成的模板实例，在专题模板的整个制作过程中，用户可以通过反复切换到不同的视图(框架视图或模板视图)对布局、容器及组件的进行所见即所得的可视化编辑。

步骤204、客户端将制作完成的当前专题模板对应的html代码，传送至网络侧服务器进行保存，网络侧服务器在保存时过滤掉初始化时添加在专题制作页面使用的javascript引用和CSS引用。

本发明实施例提供的专题模板制作方法，客户端不需要安装专业的客户端软件，只需通过网络浏览器登录网络侧服务器，在网络侧服务器端获取的专题模板制作页面(包括框架视图或模板视图)中设置布局和容器，并插入组件，生成专题模板后传送至网络侧服务器保存；并且在专题模板的制作过程中，用户还可以通过反复切换到不同的视图，对布局、容器及组件的进行所见即所得的可视化编辑；整个制作过程简单、快捷，并且所见即所得地进行可视化编辑也降低了编辑人员制作专题模板的难度。

本发明实施例提供了一种专题模板制作系统，如图6所示，包括：客户端601和网络侧服务器602；

客户端601，用于通过网络浏览器登录网络侧服务器602后，根据网络侧服务器602提供的专题模板制作页面设置布局、容器和插入组件，并传送至所述网络侧服务器602；

网络侧服务器602，用于在网络浏览器中向所述客户端601提供专题模板制作页面，以及保存客户端601生成的专题模板。

本发明实施例提供了一种客户端，如图所示，包括：登录单元701、获取单元702、专题模板制作单元703、发送单元704；

登录单元701，用于通过网络浏览器登录网络侧服务器；

获取单元702，用于从网络侧服务器获取专题模板制作页面；

专题模板制作单元703，用于在专题模板制作页面中设置布局、容器，并插入组件，生成所述专题模板；

发送单元704，用于将制作完成的专题模板传送至所述网络侧服务器。

上述客户端，还包括第一存储单元705；

第一存储单元705，用于存储用于制作专题模板的组件；

获取单元702，还用于获取第一存储单元以及网络侧服务器存储的组件，并发送至专题模板制作单元703；

本发明实施例还提供一种网络侧服务器，如图8所示，包括：页面生成单元801、第二存储单元802；

页面生成单元801，用以生成专题模板制作页面并返回客户端进行显示；

第二存储单元802，用于存储所述客户端传送的制作完成的专题模板。

上述第二存储单元802，还用于存储所述客户端预先制作好的动态组件及组件样式。

本发明提供的专题模板制作系统、客户端和网络侧服务器，使得客户端通过网络浏览器登录网络侧服务器，就可简单、高效率地实现专题模板制作，避免了现有制作专题模板过程中，制作门槛较高，且流程烦琐、效率较低的问题。

显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。

Claims (15)

1.一种专题模板制作方法，其特征在于，包括：

客户端通过网络浏览器登录网络侧服务器，从所述网络侧服务器获取专题模板制作页面；

所述客户端根据所述专题模板制作页面设置布局和容器，并插入组件，生成专题模板并传送至所述网络侧服务器保存。

2.如权利要求1所述的方法，其特征在于，所述专题模板制作页面包括框架视图和模板视图。

3.如权利要求2所述的方法，其特征在于，所述客户端根据所述专题模板制作页面设置布局和容器，并插入组件，生成专题模板并传送至所述网络侧服务器保存，具体包括：

所述客户端在所述框架视图提供的空白专题模板中设置布局和容器，并传送至网络侧服务器保存；

所述网络侧服务器向所述客户端返回包含所述客户端设置好的布局和容器的模板视图；

所述客户端将所述组件插入到选定的容器中，并传送至所述网络侧服务器保存。

4.如权利要求3所述的方法，其特征在于，所述框架视图提供的操作选项包括：新建框架、新建布局、删除布局、布局调序；

所述新建布局的操作选项包括从基本布局中选择或自定义布局属性；

所述基本布局包括：通栏布局、两列布局、三列布局；

所述布局调序的操作选项包括向上调序及向下调序。

5.如权利要求3所述的方法，其特征在于，所述客户端将所述组件插入到选定的容器中，包括：

所述客户端选择待插入组件的容器，通过改变所述容器的边框样式突出显示选定的容器；

所述客户端从所述网络侧服务器提供的组件列表或本地存储的组件中选择待插入的组件并插入至所述选定的容器中。

6.如权利要求1至5所述的任一方法，其特征在于，所述组件包括静态组件和动态组件；

所述静态组件包括：文字、图片和Flash其中之一或任意组合；

所述动态组件包括：高级标题列表、高级分页标题列表、高级栏目列表和当前路径其中之一或任意组合。

7.如权利要求6所述的方法，其特征在于，当所述组件为图片或Flash时，所述客户端将组件插入到选定的容器中，包括：

客户端选择本地存储的图片或Flash；

所述客户端将选择的图片或Flash通过表单提交方式上传至所述网络侧服务器保存；

所述网络侧服务器返回存储的所述图片或Flash的文件名和路径；

所述客户端根据所述文件名和路径将所述图片或Flash插入至所述选定的容器中。

8.如权利要求6所述的方法，其特征在于，在所述客户端将组件插入到选定的容器中之前，还包括：所述客户端将制作好的动态组件及组件样式压缩后预先传送至所述网络侧服务器中保存。

9.如权利要求8所述的方法，其特征在于，当所述组件为动态组件时，所述客户端将组件插入到选定的容器中，包括：

所述客户端在所述网络侧服务器中选择所述动态组件以及所述动态组件对应的组件样式；

所述网络侧服务器将所述客户端选择的所述动态组件以及对应的组件样式进行解析，生成动态组件对应的html代码并发送给所述客户端；

所述客户端将所述动态组件的html代码插入所述选定的容器中。

10.如权利要求3所述的方法，其特征在于，所述客户端将组件插入到选定的容器中之后，还包括：客户端根据需要对已插入的组件进行修改、删除、移动的操作。

11.一种客户端，其特征在于，包括：登录单元、获取单元、专题模板制作单元、发送单元；

所述登录单元，用于通过网络浏览器登录网络侧服务器；

所述获取单元，用于从网络侧服务器获取专题模板制作页面；

所述专题模板制作单元，用于从网络侧服务器获取专题模板制作页面，并在专题模板制作页面中设置布局、容器，并插入组件，生成所述专题模板；

所述发送单元，用于将制作完成的专题模板传送至所述网络侧服务器。

12.如权利要求11所述的客户端，其特征在于，还包括第一存储单元；

所述第一存储单元，用于存储用于制作专题模板的组件；

所述获取单元，还用于获取第一存储单元以及网络侧服务器存储的组件，并发送至所述专题模板制作单元。

13.一种网络侧服务器，其特征在于，包括：页面生成单元、第二存储单元；

所述页面生成单元，用以生成制作专题模板的页面，包括框架视图和模板视图并返回客户端进行显示；

所述第二存储单元，用于存储所述客户端传送的制作完成的框架以及专题模板。

14.如权利要求13所述的网络侧服务器，其特征在于，所述第二存储单元，还用于存储所述客户端预先制作好的动态组件及组件样式。

15.一种专题模板制作系统，其特征在于，包括：客户端和网络侧服务器；

所述客户端，用于通过网络浏览器登录网络侧服务器后，从所述网络侧服务器获取专题模板制作页面，根据所述专题模板制作页面设置布局、容器和插入组件，并传送至所述网络侧服务器；

所述网络侧服务器，用于在网络浏览器中向所述客户端提供专题模板制作页面，以及保存所述客户端生成的专题模板。

Images