CN110765399A - 一种基于零购官网的智能页面配置系统及其实现方法 - Google Patents
一种基于零购官网的智能页面配置系统及其实现方法 Download PDFInfo
- Publication number
- CN110765399A CN110765399A CN201910985940.3A CN201910985940A CN110765399A CN 110765399 A CN110765399 A CN 110765399A CN 201910985940 A CN201910985940 A CN 201910985940A CN 110765399 A CN110765399 A CN 110765399A
- Authority
- CN
- China
- Prior art keywords
- module
- app
- retail
- page
- central processing
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06Q—INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES; SYSTEMS OR METHODS SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES, NOT OTHERWISE PROVIDED FOR
- G06Q30/00—Commerce
- G06Q30/06—Buying, selling or leasing transactions
- G06Q30/0601—Electronic shopping [e-shopping]
- G06Q30/0641—Shopping interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Databases & Information Systems (AREA)
- Business, Economics & Management (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Accounting & Taxation (AREA)
- Finance (AREA)
- General Engineering & Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Economics (AREA)
- General Business, Economics & Management (AREA)
- Strategic Management (AREA)
- Marketing (AREA)
- Development Economics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
为了解决现有的系统无法实现模块自由搭配组合的问题,本发明提出一种基于零购官网智能页面配置系统,其包括服务器、前端、APP端、可以自由配置的模块、中央处理模块和对应的展示模块;其中,中央处理模块的作用是将运营客户端发送过来的页面各个可以自由配置的模块的配置参数进行处理、加工和保存;所述的对应的展示模块是根据中心配置的参数在浏览器和APP端显示;其特征在于:所述的中央处理模块将服务器端推送过来的可以自由配置的模块中的JSON字符串进行解析,根据键查找相应的值,当根据键查找到相应的值后,中央处理模块需要对该可以自由配置的模块进行处理,并将处理后的结果返回给前端和APP,前端和APP通过前端编译将模块显示在手机屏幕前端。
Description
技术领域
本发明涉及页面配置系统,较为具体的,涉及到一种基于零购官网的智能页面配置系统及其实现方法。
背景技术
基于手机端的移动电商平台要在有限的屏幕空间展示丰富的内容,不仅布局要更加合理,页面也要美观,给用户良好的购物体验。另外,电商平台的运营环境复杂多变,日常的商城首页、促销页、大小型活动会场、专题等页面,经常需要根据运营需求,变换页面风格;同时也要根据用户画像的不同,例如新用户、老用户、男性用户、女性用户、近期访问用户等,陈列不同页面模块,推荐不同的商品列表。
目前,市场上可以实现更换页面风格的电商系统也有,但基本都是几套固定模板的更换,无法实现模块自由搭配组合,更无法完成根据用户画像读取数据和展示不同页面。另外,针对原有系统,每次页面改版或者运营人员举办小型活动会场的时候,运营人员都无法自由配置页面,而是要求动用大量的研发人员参与更换页面结构,更换符合会场的主题风格以及数据需求,这部分的工作内容有大量的重复性;每次都要运营人员、产品人员、UI人员和研发人员一起参与,无形中花费了大量的人力,而且极不灵活。
发明内容
有鉴于此,为了解决现有的系统无法自由实现模块自由搭配组合的问题,本发明提出一种基于零购官网智能页面配置系统及其实现方法,其可以实现运营人员根据需求,在零购官网的配置中心,针对零购官网首页、专题活动页和个人中心等页面实现自由组合模块和搭配页面风格的功能,所见即所得,配置出所需页面,并且运营人员可以实时预览,及时更换、发布显示页面。页面发布之后,客户端用户可以在零购官网页面和APP中及时浏览到,并且可以做到全站式的自由搭配。
一种基于零购官网的智能页面配置系统,其包括服务器、前端、APP端、可以自由配置的模块、中央处理模块和对应的展示模块;
其中,中央处理模块的作用是将运营客户端发送过来的页面各个可以自由配置的模块的配置参数进行处理、加工和保存;
所述的对应的展示模块是根据中心配置的参数在浏览器和APP端显示;
其特征在于:所述的中央处理模块将服务器端推送过来的可以自由配置的模块中的JSON字符串进行解析,根据键(Key)查找相应的值(Value),当根据键(Key)查找到相应的值(Value)后,中央处理模块需要对该可以自由配置的模块进行处理,并将处理后的结果返回给前端和APP,前端和APP通过前端编译将模块显示在手机屏幕前端,供用户浏览。
进一步的,所述的对应的展示模块包括页面顶部菜单模块、搜索模块、轮播(banner)模块、金刚区模块、抢购模块、主题区模块、弹窗模块、底部(tabbar)模块、悬浮模块和商品模块中的一种或多种的组合。
进一步的,所述的可以自由配置的模块包含模块风格和数据来源等设置,其通过一串JSON字符串组成,所述的字符串包含模块的名称(name)、模块类型(mid)、模块主图(image)、模块基础CSS属性(props)、以及对应的需要被解析处理的值(Value)。
进一步的,所述的模块基础CSS属性(props)包含模块背景颜色(background)、背景图(background-image)、默认字体颜色(font-color)、活动字体颜色(active-font-color)、字体大小(font-size)、模块之间的内外边距(margin/padding)、是否支持圆角(radius)等。
进一步的,所述的JSON字符串是根据键(Key)查找值(Value)的过程,其中键(key)是指要展示的模块名称(name)、模块类型(mid)、模块主图(image)、模块基础CSS属性(props)以及对应的需要被解析处理的值(Value),而最终需要确定的值(Value)是指对应的需要被解析处理的值(Value)中具体的某一个固定的值(Value)。
进一步的,如上所述的JSON字符串,由服务器端、前端、APP端协定统一,且此JSON字符串需要由服务器自动生成。
本发明还涉及基于零购官网智能页面配置系统的实现方法,其包括如下步骤:
S1,系统配置中心陈列出各种可以自由配置的模块,后期可以根据需要继续添加;
S2,每个可以自由配置的模块包括样式(CSS)设置、数据(DATA)设置和符合本模块需求的一些特殊设置(Other);
S3,设置可以自由配置的模块的各个参数,交由中央处理模块处理并生成JSON字符串进行保存;
S4,通过HTTPS请求到服务器接口上,中央处理模块将解析JSON字符串,通知到页面前端和APP端;
S5,前端和APP端分别根据JSON字符串,用前端代码编译解析,根据模块类型(mid字段)来区分各模块的展示位置、风格和数据,展示出来供用户浏览。
由此可见,采用本发明的基于零购官网的智能页面配置系统,运营人员可以根据根据需求,在零购官网的配置中心,针对零购官网首页、专题活动页和个人中心等页面实现自由组合模块和搭配页面风格的功能,并且运营人员可以实时预览,所见即所得,非常方便。
附图说明
图1为本发明的基于零购官网的智能页面配置系统的配置中心工作流程图。
图2为本发明的前端展示工作流程图。
以下具体实施方式将结合附图对本发明的构思、具体结构及产生的技术效果作进一步说明,以充分地了解本发明的目的、特征和效果。
具体实施方式
具体实施案例1:金刚区模块的配置。
金刚区是一个页面中头部的重要位置,是页面的核心功能区域,通常是位于搜索模块、轮播(banner)模块下面。从用户阅读屏幕内容的视觉来说位置至关重要,而且是聚合各类子版块的入口,为各个子版块分发内容引导流量。
在系统配置中心,选择首页设置,然后选择金刚区模块,分别对样式(CSS)设置和数据(DATA)设置进行设置,其中样式(CSS)设置具体包含金刚区模块的是否支持圆角(radius)、阴影、模块之间的内外边距(margin/padding)、默认字体颜色(font-color)、活动字体颜色(active-font-color)、字体大小(font-size)、背景颜色(background)和背景图片(background-image)的设置;数据(DATA)设置包括名称、图片、文字、链接、兼容APP的参数配置等,最后设置要展示成的列数和行数。设置好的各参数内容,通过中央处理模块的处理,处理为JOSN格式保存。
当然,其他可以自由配置的模块都可以参考金刚区的配置,一次配置好后,运营人员也可以及时预览配置结果,确认无误后,可以保存发布。
接着,在页面发布之后,在零购官网前端页面和APP中,通过HTTPS接口方式从服务器中读取数据,然后将数据展示在页面上供用户查看。
具体实施案例2:首页可以自由配置的模块的自由配置。
在模块化系统配置中心,陈列出页面所需要的基本模块,首页配置常用的模块包括顶部菜单模块、轮播(Banner)模块、金刚区模块、抢购区模块、主题区模块、弹窗模块、悬浮模块、展示模块和底部(Tabbar)模块。选择相应的可以自由配置的模块,对此模块进行配置,这里以金刚区模块为例,按照样式(CSS)设置、数据(DATA)设置和其他参数(Other)分别进行设置。
其中,样式配置(CSS)配置主要决定可以自由配置的模块在前端展示的样式风格,包括是否支持圆角(radius)、阴影、模块之间的内外边距(margin/padding)、默认字体颜色(font-color)、活动字体颜色(active-font-color)、字体大小(font-size)、背景颜色(background)和背景图片(background-image)的设置;数据(DATA)配置包括名称、显示图片、图片的宽度和高度、文字、链接地址和兼容APP端的参数配置等;其他参数(Other)配置为根据不同的模块,显示为不同的配置参数,金刚区展示对列数的配置。
配置好所有参数后,点击保存,然后通过中央处理模块,把数据处理成JSON字符串格式保存在数据库中。
其他模块都可以参考金刚区的配置,一次性配置好,运营人员也可以及时预览配置结果,及时作出调整,确认无误后,可以保存发布。
接着,在页面发布之后,在零购官网前端页面和APP中,通过HTTPS接口方式从服务器中读取数据,然后将数据展示在页面上供用户查看。
以上所述实施例仅表达了本发明的几种实施方式,其描述较为具体和详细,但并不能因此而理解为对本发明专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本发明构思的前提下,还可以做出若干变形和改进,这些都属于本发明的保护范围。因此,本发明专利的保护范围应以所附权利要求为准。
Claims (9)
1.一种基于零购官网的智能页面配置系统,其包括服务器、前端、APP端、可以自由配置的模块、中央处理模块和对应的展示模块;
其中,中央处理模块的作用是将运营客户端发送过来的页面各个可以自由配置的模块的配置参数进行处理、加工和保存;
所述的对应的展示模块是根据中心配置的参数在浏览器和APP端显示;
其特征在于:所述的中央处理模块将服务器端推送过来的可以自由配置的模块中的JSON字符串进行解析,根据键查找相应的值,当根据键查找到相应的值后,中央处理模块需要对该可以自由配置的模块进行处理,并将处理后的结果返回给前端和APP,前端和APP通过前端编译将模块显示在手机屏幕前端,供用户浏览。
2.如权利要求1所述的基于零购官网的智能页面配置系统,其特征在于:所述的对应的展示模块包括页面顶部菜单模块、搜索模块、轮播模块、金刚区模块、抢购模块、主题区模块、弹窗模块、底部模块、悬浮模块和商品模块中的一种或多种的组合。
3.如权利要求1所述的基于零购官网的智能页面配置系统,其特征在于:所述的可以自由配置的模块包含模块风格和数据来源,其通过一串JSON字符串组成,所述的字符串包含模块的名称、模块类型、模块主图、模块基础CSS属性、以及对应的需要被解析处理的值。
4.如权利要求3所述的基于零购官网的智能页面配置系统,其特征在于:所述的模块基础CSS属性包含模块背景颜色、背景图、默认字体颜色、活动字体颜色、字体大小、模块之间的内外边距、是否支持圆角。
5.如权利要求1所述的基于零购官网的智能页面配置系统,其特征在于:所述的JSON字符串是根据键查找值的过程,其中键是指要展示的模块名称、模块类型、模块主图、模块基础CSS属性以及对应的需要被解析处理的值,而最终需要确定的值是指对应的需要被解析处理的值中具体的某一个固定的值。
6.如权利要求1所述的基于零购官网的智能页面配置系统,其特征在于:如上所述的JSON字符串,由服务器端、前端、APP端协定统一,且此JSON字符串需要由服务器自动生成。
7.一种基于零购官网智能页面配置系统的实现方法,其包括如下步骤:
S1,系统配置中心陈列出各种可以自由配置的模块,后期可以根据需要继续添加;
S2,每个可以自由配置的模块包括样式设置、数据设置和符合本模块需求的一些特殊设置;
S3,设置可以自由配置的模块的各个参数,交由中央处理模块处理并生成JSON字符串进行保存;
S4,通过HTTPS请求到服务器接口上,中央处理模块将解析JSON字符串,通知到页面前端和APP端;
S5,前端和APP端分别根据JSON字符串,用前端代码编译解析,根据模块类型来区分各模块的展示位置、风格和数据,展示出来供用户浏览。
8.如权利要求7所述的基于零购官网智能页面配置系统的实现方法,其特征在于:数据配置包括名称、显示图片、图片的宽度和高度、文字、链接地址和兼容APP端的参数配置。
9.如权利要求7所述的基于零购官网智能页面配置系统的实现方法,其特征在于:所述的样式设置包括背景颜色、背景图、默认字体颜色、活动字体颜色、字体大小、模块之间的内外边距、是否支持圆角。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910985940.3A CN110765399A (zh) | 2019-10-17 | 2019-10-17 | 一种基于零购官网的智能页面配置系统及其实现方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910985940.3A CN110765399A (zh) | 2019-10-17 | 2019-10-17 | 一种基于零购官网的智能页面配置系统及其实现方法 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN110765399A true CN110765399A (zh) | 2020-02-07 |
Family
ID=69332120
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201910985940.3A Pending CN110765399A (zh) | 2019-10-17 | 2019-10-17 | 一种基于零购官网的智能页面配置系统及其实现方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN110765399A (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN117348870A (zh) * | 2023-09-20 | 2024-01-05 | 北京安锐卓越信息技术股份有限公司 | 一种页面定制方法、装置、介质及电子设备 |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN108446953A (zh) * | 2018-02-26 | 2018-08-24 | 苏州市那美网络科技有限公司 | 一种基于零购官网app的智能消息推送系统及其实现方法 |
CN108733443A (zh) * | 2018-05-09 | 2018-11-02 | 成都市极米科技有限公司 | 一种基于Android系统的APP动态配置系统及其实现方法、动态配置方法 |
CN109101300A (zh) * | 2018-06-14 | 2018-12-28 | 腾讯科技(深圳)有限公司 | 一种页面渲染方法、装置及终端 |
CN109688203A (zh) * | 2018-12-05 | 2019-04-26 | 广州嘉影软件有限公司 | 一种基于多媒体展馆的多主体、多主题展示方法 |
CN110263266A (zh) * | 2019-05-20 | 2019-09-20 | 江苏大学 | 一种基于微信小程序和爬虫的数据展示方法 |
-
2019
- 2019-10-17 CN CN201910985940.3A patent/CN110765399A/zh active Pending
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN108446953A (zh) * | 2018-02-26 | 2018-08-24 | 苏州市那美网络科技有限公司 | 一种基于零购官网app的智能消息推送系统及其实现方法 |
CN108733443A (zh) * | 2018-05-09 | 2018-11-02 | 成都市极米科技有限公司 | 一种基于Android系统的APP动态配置系统及其实现方法、动态配置方法 |
CN109101300A (zh) * | 2018-06-14 | 2018-12-28 | 腾讯科技(深圳)有限公司 | 一种页面渲染方法、装置及终端 |
CN109688203A (zh) * | 2018-12-05 | 2019-04-26 | 广州嘉影软件有限公司 | 一种基于多媒体展馆的多主体、多主题展示方法 |
CN110263266A (zh) * | 2019-05-20 | 2019-09-20 | 江苏大学 | 一种基于微信小程序和爬虫的数据展示方法 |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN117348870A (zh) * | 2023-09-20 | 2024-01-05 | 北京安锐卓越信息技术股份有限公司 | 一种页面定制方法、装置、介质及电子设备 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US10235349B2 (en) | Systems and methods for automated content generation | |
CN113342821B (zh) | 报表配置方法、装置、设备及计算机存储介质 | |
CN106886418B (zh) | Html界面控件贴 | |
US8572105B2 (en) | Method and system for desktop tagging of a web page | |
US9778920B2 (en) | Mobile design patterns | |
CN105373567B (zh) | 页面生成方法及客户端 | |
CN105354025B (zh) | 基于移动应用的业务模型配置系统和方法 | |
TW201814555A (zh) | 搜索系統、頁面顯示方法和用戶端 | |
CN107391134B (zh) | 一种通用移动应用交互界面自动生成与动态变换方法与装置 | |
CN110297636B (zh) | 一种基于页面配置文件的页面自动生成和参数管理方法、系统和装置 | |
CN102279851A (zh) | 一种智能导航方法、装置和系统 | |
CN105094775B (zh) | 网页生成方法和装置 | |
CN107066244B (zh) | 一种移动终端应用界面的生成方法和装置 | |
CN102693247A (zh) | 数据综合管理系统及客户终端 | |
CN105022810A (zh) | 一种显示页面位置浏览信息的方法和装置 | |
CN106407220A (zh) | 一种发布信息的控制方法、控制装置及系统 | |
CN108470289B (zh) | 基于电商购物平台的虚拟物品发放方法及设备 | |
CN104424271A (zh) | 出版物数字资源的自动采集方法及系统 | |
CN110765399A (zh) | 一种基于零购官网的智能页面配置系统及其实现方法 | |
CN104834703A (zh) | 检索方法及系统 | |
CN102955827A (zh) | 一种无线应用协议网页的创建方法和编辑器 | |
KR20210125454A (ko) | 유행 색상 정보를 이용한 의류 정보 제공 방법 및 장치 | |
KR101951244B1 (ko) | 인터넷 신문 편집툴을 이용한 인터넷 신문 편집 방법 및 시스템 | |
CN105224539B (zh) | 页面文件的处理方法和装置 | |
CN113849172B (zh) | 一种基于可视化配置开发自定义首页的方法及系统 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
RJ01 | Rejection of invention patent application after publication | ||
RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200207 |