一种定制化样式网站实现方法与流程

文档序号:15828730发布日期:2018-11-03 00:12阅读:608来源:国知局

本发明涉及一种定制化样式网站实现方法,涉及网站设计领域。

背景技术

随着互联网,特别是移动互联网的高速发展,中小企业对于互联网营销的需求越来越大,而建设网站(含pc、移动)、小程序和微信公众号的需求越发明显。对于中小企业用户,网站中,对于产品展示,企业咨询的展示为最为基本的需求,但是不同行业不同类型的中小企业用户对于网站样式都有着个性化的要求。

目前市面上的建站服务主要分模板站,即服务商提供模板,用户添加内容,套用模板。这一类产品价格低廉,且服务期限长。但是这种产品仅仅能满足用户的展示需求,样式较为单一,用户只能挑选固定模板。若用户对于网站样式有着较高的要求,则一般选择定制化的服务。服务商提供的产品不能复用给第三方用户,所以制作成本高,单价偏高。

综上,低成本、长服务期的定制化样式网站是目前中小企业主的核心需求。



技术实现要素:

本发明提供了一种定制化样式网站实现方法,具有制作成本低,便于用户能够根据自己偏好实现较高要求的网站样式定制的特点。

根据本发明提供的一种定制化样式网站实现方法,包括静态数据展示实现方法和动态数据展示实现方法;其特征在于:提供基础的网站样式编辑器,使客户端提供效果图,通过编辑器自行生成网站样式,提交发布;所述动态数据展示实现方法中,具体包括,

内置自定义元件上传功能作为基本功能,使客户端能够通过上传接口上传元件;

定义网站内容的数据展示类型,及待上传元件或已上传元件与数据展示类型的关联方式,使客户端能够将待上传元件或已上传元件关联数据源,以实现上传元件与具体数据类型的关联;

组合存储关联好的元件,形成动态组件;

定义页面类型,包括首页、公司信息展示页、产品详情页、产品分类页面、图文信息详情页面、图文信息分类页面、图集展示页和图片查看页中任意一种或任意几种;

设置客户端页面选择方式和页面组件添加方式,以使客户端能够将设计好的动态组件添加至选择的页面;

所述元件为单个最小元素,包括、文本、图形、单选框、复选框、文本框和时间日期选择框中的任意一种或几种;所述组件为元件拼装成的站内需要展示的模块组成;所述页面由组件拼装成。一套页面形成一个模板。

所述方法还包括,将关联数据转换为数据接口,将此类接口进程处理,将代码操作的内容转化为客户端可选的选项,以使客户端通过选择的方式将上传的元件关联数据源。

所述方法还包括,设置关联数据展示效果,包括关联数据条条数、条数内容和关联数据指定的分类。

所述方法还包括设置自定义元件选项,包括自定义样式、颜色和大小中的任意一种或几种。

所述方法还包括设置元件指定添加链接接口,通过指定链接来添加元件。

所述方法还包括设置自定义拼装组件选项,元件拼装后打组生成自定义静态组件和/或自定义动态组件生成动态表单。

所述方法还包括设置组件自定义样式的功能选项,以实现客户端对自定义功能内容的选择。

所述方法还包括设置组件内部元件样式更改和替换选项。

所述方法还包括设置模板组件自定义调整选项,支持模板拆分成若干组件后进行自定义调整。

还包括动画数据展示实现方法,具体方法包括,

设置客户端动画数据关键帧和中间帧设置接口;所述关键帧包括前关键帧和后关键帧;

设置关键帧时间、位置和样式的设置接口,及页面翻页效果设置接口;

所述翻页效果设置接口包括当前页设置接口和跳转页设置接口。

所述方法还包括设置页面/动画切换设置接口,设置页面切换动画效果。

所述方法还包括设置动画效果设置接口,包括轮播图片切换设置和/或视频动画切入设置。

所述方法还包括设置排列方式设置接口,包括组合\取消组合和图层排列方式设置接口。

与现有技术相比,制作成本低,便于用户能够根据自己偏好实现较高要求的网站样式的定制。

附图说明

图1为本发明其中一实施例的原理示意图。

具体实施方式

为了使本发明的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本发明进行进一步详细说明。应当理解,此处所描述的具体实施例仅用以解释本发明,并不用于限定本发明。

本说明书(包括摘要和附图)中公开的任一特征,除非特别叙述,均可被其他等效或者具有类似目的的替代特征加以替换。即,除非特别叙述,每个特征只是一系列等效或类似特征中的一个例子而已。

对于建设网站的终端用户而言,根据数据来源样式需求主要分为两种类型:

1、静态展示数据:对于静态展示数据,一般的建站工具都有此类功能。用户只需要设计好元素(图片、按钮等)后,自行选择添加跳转链接即可。

2、动态展示数据:所谓动态数据展示,就是展示的内容时从用户上传的产品、图文信息等内容中获取的实时数据,这类展示因为涉及前端调用数据库数据,现在市面上的制作方式都是前端工程师上传模板时,调用服务端工程师提供的数据接口,所以非开发成员是无法自主制作或者上传动态数据模板的。

还有一种用户常见的需求就是动画效果的展示。常见的应用场景有:banner的切换动画、hover状态的展示动画、或者网站页面的翻页效果,当然当前页面的动画展示也是常见的应用场景之一。现在市面上有提供此类功能的建站系统,都是通过内置默认的动画效果进行设置,无法进行自定义编辑。

一种定制化样式网站实现方法,包括静态数据展示实现方法和动态数据展示实现方法;其特征在于:提供基础的网站样式编辑器,使客户端提供效果图,通过编辑器自行生成网站样式,提交发布;所述动态数据展示实现方法中,具体包括,

内置自定义元件上传功能作为基本功能,使客户端能够通过上传接口上传元件;

定义网站内容的数据展示类型,及待上传元件或已上传元件与数据展示类型的关联方式,使客户端能够将待上传元件或已上传元件关联数据源,以实现上传元件与具体数据类型的关联;

组合存储关联好的元件,形成动态组件;

定义页面类型,包括首页、公司信息展示页、产品详情页、产品分类页面、图文信息详情页面、图文信息分类页面、图集展示页和图片查看页中任意一种或任意几种;

设置客户端页面选择方式和页面组件添加方式,以使客户端能够将设计好的动态组件添加至选择的页面;

所述元件为单个最小元素,包括、文本、图形、单选框、复选框、文本框和时间日期选择框中的任意一种或几种;所述组件为元件拼装成的站内需要展示的模块组成;所述页面由组件拼装成。一套页面形成一个模板。

如图1所示,在本发明技术方案中,提供基础的网站样式编辑器,使客户端提供效果图,通过编辑器自行生成网站样式,提交发布。元件上传功能作为基本功能,对于组件的拼装,一般为动态组件,是自定义样式网站的核心功能。用户将这些关联好的元件(此时可以理解为动态元件)进行组合存储,形成动态组件,此时,一个动态组件就设置完成了。用户设置好了动态组件后,选中页面,将设计好的组件添加至页面中以实现动态数据的展示。

数据类型根据实际需求进行定义,例如,产品信息中,数据类型可以包括:产品标题、副标题、产品价格、型号、主图、规格型号、详细介绍文本、详细介绍图片和视频等。

所述方法还包括,将关联数据转换为数据接口,将此类接口进程处理,将代码操作的内容转化为客户端可选的选项,以使客户端通过选择的方式将上传的元件关联数据源。

所述方法还包括,设置关联数据展示效果,包括关联数据条条数、条数内容和关联数据指定的分类。便于关联数据精确值展示条数、数据指定的某个分类等(例如:用户设置某文本元件将产品信息中的产品价格数据进行关联)。

所述方法还包括设置自定义元件选项,包括自定义样式、颜色和大小中的任意一种或几种。

所述方法还包括设置元件指定添加链接接口,通过指定链接来添加元件。

所述方法还包括设置自定义拼装组件选项,元件拼装后打组生成自定义静态组件和/或自定义动态组件生成动态表单。

所述方法还包括设置组件自定义样式的功能选项,以实现客户端对自定义功能内容的选择。

所述方法还包括设置组件内部元件样式更改和替换选项。

所述方法还包括设置模板组件自定义调整选项,支持模板拆分成若干组件后进行自定义调整。从而提高用户的自定义网站样式需求。

还包括动画数据展示实现方法,具体方法包括,

设置客户端动画数据关键帧和中间帧设置接口;所述关键帧包括前关键帧和后关键帧;

设置关键帧时间、位置和样式的设置接口,及页面翻页效果设置接口;

所述翻页效果设置接口包括当前页设置接口和跳转页设置接口。

关键帧决定起始动作和结束动画、(多个)中间帧决定运动轨迹。用户可以通过关键帧和中间帧的样式来解决展示动画的效果。

网站动画和视觉动画不同,有一部分涉及到翻页效果,所以前后关键帧有两个元素,一个是传统的时间、位置和样式;另一个是页面元素;在进行翻页效果的设置时,分为当前页和跳转页。

当前页,主要通过设定焦点位置来操作。例如常见的楼层导航,导航栏中选中某个分类,不是跳转页面,而是页面展示当前的指定位置。这时我们需要设置一个居中的焦点位置,设置关键帧的焦点位置即可。

跳转页,跳转页面涉及到切换效果,这时,我们提供了一个假定的翻页动画设定元素,即一个pc或者手机等比例尺寸的矩形区域,我们设定矩形的切换路径即可。

所述方法还包括设置页面/动画切换设置接口,设置页面切换动画效果。

所述方法还包括设置动画效果设置接口,包括轮播图片切换设置和/或视频动画切入设置。

用户可根据需求,自定义设置网上的动画效果,这一方面用的比较多的是轮播图片的切换效果和网站的视频动画切入。

所述方法还包括设置排列方式设置接口,包括组合\取消组合和图层排列方式设置接口。

为了方便用户自定义网站样式,针对元件、组件提供了组合\取消组合、图层、和排列的方式。客户端可以组合元件、组件进行更加方便的切换、通过图层来调整元素的展示层级、通过排列设置元素的展示效果。比较常用的是:左右对齐、居中、平铺等。

对于模板,可以仅包括静态数据展示和动态数据展示,也可以包括动画数据展示,如果包括动画数据展示,则最后将设定好的动画和页面合成模板,这样一个自定义的网站模板。

关于前后端数据对接:

动态组件数据对接:将确定好的数据类型,在数据库中进行存储,提供数据接口至前端工程师,前端工程师将数据接口形成应用功能,用户上传元件后,选中对应的数据源即可;

动画效果数据对接:前端提供动画编辑器后,展示动画(banner、hover等)样式保存至本地,直接生产模板即可;对于翻页效果的动画,前端需要提供所在页面的参数和动画样式提供至服务端,记录以备生产模板时应用。

当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1