可视化内容管理方法和系统与流程

本发明涉及计算机信息技术领域，尤其涉及一种可视化内容管理方法和系统。

背景技术：

目前CMS（Content Management System，内容管理系统）内容管理流程为，登录后台后，在系统后台中查询需要被修改的内容，而后进入编辑页面进行修改，修改完成后，需访问系统前台并找到对应的页面，才能完成对修改内容的校验，需操作的内容较多时，需反复重复这一过程，使用体验较低。现有技术的CMS修改及校验过程如图1所示。

在公布号为CN103853735A的中国专利申请中公开了一种HTML模板可视化制作、编辑方法及系统。该方法及系统虽然实现碎片编辑或模板制作都能在同一个界面中完成，避免画面频繁切换，但也存在缺欠。首先，由系统自动识别并创建的碎片带有随机性，无法根据前端内容的关联关系进行合理有效的划分，对于初学者来讲，需要很高的学习成本来适应内容的碎片化；其次通过鼠标在页面上选取元素来生成碎片的方式，造成了模板制作的混乱状况，例如编辑人员创建的碎片可能被另一个编辑人员删除；还有碎片编辑也同样存在混乱状况，可能出现多人编辑同一内容，发生相互覆盖的情况；最后，碎片化的分割模式，只能针对单一元素，如一副配有说明文字的图片，就必须分割成两个碎片来单独管理，如果同一区域内的元素过多时，就需分割成多个碎片，用户体验过低，管理过程繁琐。

技术实现要素：

针对背景技术中所出现的问题，本发明提出了改进方案。在HTML模板制作阶段，可根据页面内容所属的区域及内容之间的关联性进行整合，即同一挂件内的所有元素，必然具有逻辑上的关联性，页面挂件与碎片最大的区别在于逻辑上的归类；本发明提出基于挂件的方案支持不同编辑人员的权限划分，即编辑人员的权限可以精确到某个页面中的某个插件，可有效避免管理上的错乱和相互覆盖。

本发明提供了一种可视化内容管理方法，包括：进入可视化编辑界面；在所述可视化编辑界面中选择可视化编辑挂件；对选择的所述可视化编辑挂件进行可视化编辑；保存编辑结果。

可选的是，所述进入可视化编辑界面包括：在地址栏中输入特定字符进入所述可视化编辑界面。

在上述任一方案中可选的是，所述在地址栏中输入特定字符之后，还包括通过身份验证后进入所述可视化编辑界面。

在上述任一方案中可选的是，还包括在所述身份验证后，在预定时间阈值内不需要重复进行身份验证，即可进入所述可视化编辑界面。

在上述任一方案中可选的是，所述可视化编辑还包括通过鼠标悬停显示鼠标所在位置的所述可视化编辑挂件的编辑按钮和隐藏按钮中至少一种。

在上述任一方案中可选的是，所述可视化编辑还包括通过点击所述编辑按钮进入挂件编辑界面。

在上述任一方案中可选的是，所述可视化编辑还包括在所述挂件编辑界面中编辑所述挂件的组成元素，所述组成元素包括标题、简介、链接地址、背景图、文本中至少一项。

在上述任一方案中可选的是，所述可视化编辑还包括通过点击所述隐藏按钮隐藏所述可视化编辑的图层。

在上述任一方案中可选的是，所述可视化编辑还包括在页面汇总菜单中选择要编辑的页面进行可视化编辑。

在上述任一方案中可选的是，所述可视化编辑还包括在不同版本的页面编辑之间互相切换。

在上述任一方案中可选的是，所述不同版本的页面包括PC端页面编辑和手机端页面编辑。

另一方面本发明还提供了一种可视化内容管理方法，包括：将前端页面分割成至少一个可视化编辑挂件；呈现可视化编辑界面，所述可视化编辑界面是包括至少一个可视化编辑挂件在内的前端页面；对所述可视化编辑挂件进行可视化编辑；保存编辑结果。

可选的是，所述呈现可视化编辑界面包括：响应于在地址栏中输入特定字符，呈现所述可视化编辑界面。

在上述任一方案中可选的是，所述在地址栏中输入特定字符之后，还包括经过身份验证后呈现所述可视化编辑界面。

在上述任一方案中可选的是，还包括在所述身份验证后，在预定时间阈值内不需要重复进行身份验证，即可呈现所述可视化编辑界面。

在上述任一方案中可选的是，所述可视化编辑还包括响应于鼠标悬停显示鼠标所在位置的挂件的编辑按钮和隐藏按钮中至少一种。

在上述任一方案中可选的是，所述可视化编辑还包括响应于点击所述编辑按钮呈现挂件编辑界面。

在上述任一方案中可选的是，所述可视化编辑还包括在所述挂件编辑界面中设置编辑框，用于编辑所述挂件的组成元素，所述组成元素包括标题、简介、链接地址、背景图、文本中至少一项。

在上述任一方案中可选的是，所述可视化编辑还包括响应于点击所述隐藏按钮隐藏所述可视化编辑的图层。

在上述任一方案中可选的是，所述可视化编辑还包括设置页面汇总菜单，用于选择要编辑的页面进行可视化编辑。

在上述任一方案中可选的是，还包括不允许两个以上用户同时对同一个所述可视化编辑挂件进行编辑。

在上述任一方案中可选的是，所述可视化编辑还包括在不同版本的页面编辑之间互相切换。

在上述任一方案中可选的是，所述不同版本的页面包括PC端页面编辑和手机端页面编辑。

在上述任一方案中可选的是，通过在系统前端页面中植入jquery代码，实现可视化内容管理。

再一方面本发明还提供了一种可视化内容管理系统，包括：分割单元，用于将前端页面分割成至少一个可视化编辑挂件；呈现单元，用于呈现可视化编辑界面，所述可视化编辑界面是包括至少一个可视化编辑挂件在内的前端页面；编辑单元，用于对所述可视化编辑挂件进行可视化编辑；保存单元，用于保存编辑结果。

可选的是，所述进呈现单元还配置为：响应于在地址栏中输入特定字符，呈现所述可视化编辑界面。

在上述任一方案中可选的是，所述进呈现单元还配置为：在地址栏中输入特定字符之后，经过身份验证后呈现所述可视化编辑界面。

在上述任一方案中可选的是，所述进呈现单元还配置为：在所述身份验证后，在预定时间阈值内不需要重复进行身份验证，即可呈现所述可视化编辑界面。

在上述任一方案中可选的是，所述编辑单元还配置为：响应于鼠标悬停显示鼠标所在位置的挂件的编辑按钮和隐藏按钮中至少一种。

在上述任一方案中可选的是，所述编辑单元还配置为：响应于点击所述编辑按钮呈现挂件编辑界面。

在上述任一方案中可选的是，所述编辑单元还配置为：在所述挂件编辑界面中设置编辑框，用于编辑所述挂件的组成元素，所述组成元素包括标题、简介、链接地址、背景图、文本中至少一项。

在上述任一方案中可选的是，所述编辑单元还配置为：响应于点击所述隐藏按钮隐藏所述可视化编辑的图层。

在上述任一方案中可选的是，还包括汇总单元，用于设置页面汇总菜单，在所述汇总菜单中选择要编辑的页面进行可视化编辑。

在上述任一方案中可选的是，所述编辑单元还配置为：不允许两个以上用户同时对同一个所述可视化编辑挂件进行编辑。

在上述任一方案中可选的是，还包括切换单元，用于在不同版本的页面编辑之间互相切换。

在上述任一方案中可选的是，所述不同版本的页面包括PC端页面编辑和手机端页面编辑。

在上述任一方案中可选的是，通过在系统前端页面中植入jquery代码，实现可视化内容管理。

本发明提供的可视化内容管理方法及系统使得系统前端内容，从逻辑框架到展示内容全部独立，增加了系统在内容管理上的灵活性；解决了在内容修改过程中，因数据过多带来的查询检索问题；其简易的使用方式，降低了系统管理员的学习使用成本；其所见即所得的编辑方式，减少了内容管理上的错误率；同时支持权限分配，规避多人编辑同一内容，相互覆盖的问题。

附图说明

图1是现有技术的CMS修改及校验过程；

图2是按照本发明的可视化内容管理方法的前端操作流程图；

图3是按照本发明的可视化编辑方法的步骤流程图；

图4是本发明实施例的可视化编辑界面；

图5是本发明实施例的推荐内容挂件编辑界面；

图6是本发明实施例的站点导航挂件编辑界面；

图7是本发明实施例的焦点图挂件编辑界面；

图8是本发明实施例的站点底部内容挂件编辑界面；

图9是本发明实施例的可视化编辑内容修改及校校验过程流程图；

图10是按照本发明的可视化内容管理方法的后端步骤流程图；

图11是按照本发明的可视化内容管理系统的结构示意图。

具体实施方式

下面将参照附图来详细描述本发明的各种示例性实施例。应注意到：除非另外具体说明，否则在这些实施例中阐述的部件和步骤的相对布置、数字表达式和数值不限制本发明的范围。

以下对至少一个示例性实施例的描述实际上仅仅是说明性的，决不作为对本发明及其应用或使用的任何限制。

本发明提供了一种可视化内容管理方法。图2是按照本发明的可视化内容管理方法的前端操作流程图。如图2所示，本发明可视化内容管理方法包括：步骤101，进入可视化编辑界面；步骤102，在所述可视化编辑界面中选择可视化编辑挂件；步骤103，对选择的所述可视化编辑挂件进行可视化编辑；步骤104，保存编辑结果。步骤101、步骤102、步骤103、步骤104顺序执行。

根据本发明应用的可视化内容管理方法的实施例，在步骤101中，所述进入可视化编辑界面包括：在地址栏中输入特定字符进入所述可视化编辑界面。所述在地址栏中输入特定字符之后，还包括通过身份验证后进入所述可视化编辑界面。用户在访问系统前台任意页面时，只需在地址栏中输入特定字符，如：/ed，页面中即会弹出身份验证对话框，验证身份后即可对系统前台的所有页面进行可视化编辑。验证身份可以确保有权限的用户才能使用编辑功能，避免多人随意使用造成的编辑的混乱状况。

根据本发明应用的可视化内容管理方法的实施例，在步骤101中，还包括在所述身份验证后，在预定时间阈值内不需要重复进行身份验证，即可进入所述可视化编辑界面。合理设定时间阈值，既起到权限认证的作用，又避免频繁操作多次重复认证带来的麻烦。

根据本发明应用的可视化内容管理方法的实施例，在步骤102中，进入可视化编辑界面之后，在所述可视化编辑界面中选择可视化编辑挂件；在步骤103中对选择的所述可视化编辑挂件进行可视化编辑。图3是按照本发明的可视化编辑方法的步骤流程图。如图3所示，可视化编辑具体方法包括：步骤S201，通过鼠标悬停显示鼠标所在位置的所述可视化编辑挂件的编辑按钮；步骤S202，通过点击所述编辑按钮进入挂件编辑界面；S203，在所述挂件编辑界面中编辑所述挂件的组成元素。所述组成元素包括标题、简介、链接地址、背景图、文本中至少一项。所述可视化编辑包括通过鼠标悬停显示鼠标所在位置的所述可视化编辑挂件的编辑按钮和隐藏按钮中至少一种。在所述可视化编辑界面中通过鼠标选择可视化编辑挂件。通过点击所述隐藏按钮隐藏所述可视化编辑的图层。图4是本发明实施例的可视化编辑界面。如图4所示，1为编辑按钮，2为隐藏按钮，图中所示的挂件为推荐内容挂件，当鼠标悬停在推荐内容挂件时，显示所述可视化编辑挂件的编辑按钮和隐藏按钮。隐藏按钮用于隐藏可视化编辑的图层，避免挂件编辑窗口标题栏遮挡网页上的内容。图5是本发明实施例的推荐内容挂件编辑界面。如图5所示，在推荐内容挂件编辑界面中可以对组成元素中标题、简介、链接地址、背景图中至少一项进行编辑。

根据本发明应用的可视化内容管理方法的挂件编辑的实施例，可视化编辑界面中还可以对站点导航挂件、焦点图挂件、站点底部内容挂件等进行编辑。图6是本发明实施例的站点导航挂件编辑界面。图7是本发明实施例的焦点图挂件编辑界面。图8是本发明实施例的站点底部内容挂件编辑界面。在挂件编辑界面中可以对组成元素中标题、简介、链接地址、背景图、文本中至少一项进行编辑。

在可视化编辑完成之后，执行步骤104，保存编辑结果。

图9是本发明实施例的可视化编辑内容修改及校校验过程流程图；如图9所示，用户经过身份验证进入可视化编辑界面后，可对多个挂件进行编辑，可重复执行以下步骤：选择挂件、可视化编辑、保存预览，直到完成对所有需要修改的挂件的编辑。用“可视化编辑”这种更简单的方式来管理系统前台中的内容，与传统的修改方式相比，减少了用户在使用CMS时的重复操作。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括在页面汇总菜单中选择要编辑的页面进行可视化编辑。除了汇总之外，汇总菜单的作用还有就是照顾那些操作习惯停留在通过后台来管理网站内容的用户。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括在不同版本的页面编辑之间互相切换。所述不同版本的页面包括PC端页面编辑和手机端页面编辑。点击切换按钮在不同版本之间进行切换，方便用户对多个版本进行编辑操作。

另一方面本发明还提供了一种可视化内容管理方法。图10是按照本发明的可视化编辑方法的后端步骤流程图。如图10所示，本发明可视化内容管理方法包括：步骤301，将前端页面分割成至少一个可视化编辑挂件；步骤302，呈现可视化编辑界面，所述可视化编辑界面是包括至少一个可视化编辑挂件在内的前端页面；步骤303，对所述可视化编辑挂件进行可视化编辑；步骤304，保存编辑结果。

根据本发明应用的可视化内容管理方法的实施方式，使用jquery代码，将系统前端页面分割成若干个挂件。根据编辑需求将系统前端页面分割成若干个挂件，使得系统前端内容从逻辑框架到展示内容全部独立，增加了系统在内容管理上的灵活性。另外在将页面分割成挂件时是在充分考虑了将来的编辑修改需求后而做的合理分割，并且在需求变化时后台可以随时根据需求去做优化升级。这样可以既满足了编辑需求，又充分保证了系统的稳定性，避免因随意分割而造成的混乱。

根据本发明应用的可视化内容管理方法的实施方式，所述呈现可视化编辑界面包括：响应于在地址栏中输入特定字符，呈现所述可视化编辑界面。

根据本发明应用的可视化内容管理方法的实施方式，所述在地址栏中输入特定字符之后，还包括经过身份验证后呈现所述可视化编辑界面。

根据本发明应用的可视化内容管理方法的实施方式，还包括在所述身份验证后，在预定时间阈值内不需要重复进行身份验证，即可呈现所述可视化编辑界面。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括响应于鼠标悬停显示鼠标所在位置的挂件的编辑按钮和隐藏按钮中至少一种。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括响应于点击所述编辑按钮呈现挂件编辑界面。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括在所述挂件编辑界面中设置编辑框，用于编辑所述挂件的组成元素，所述组成元素包括标题、简介、链接地址、背景图、文本中至少一项。图5-图8分别是本发明实施例的推荐内容挂件编辑界面、站点导航挂件编辑界面、焦点图挂件编辑界面、站点底部内容挂件编辑界面。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括响应于点击所述隐藏按钮隐藏所述可视化编辑的图层。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括设置页面汇总菜单，用于选择要编辑的页面进行可视化编辑。

根据本发明应用的可视化内容管理方法的实施方式，还包括不允许两个以上用户同时对同一个所述可视化编辑挂件进行编辑。可视化编辑亦同时支持权限分配，规避多人编辑同一内容，相互覆盖的问题，保证数据一致性。

根据本发明应用的可视化内容管理方法的实施方式，所述可视化编辑还包括在不同版本的页面编辑之间互相切换。所述不同版本的页面包括PC端页面编辑和手机端页面编辑。

根据本发明应用的可视化内容管理方法的实施方式，通过在系统前端页面中植入jquery代码，实现可视化内容管理。

再一方面本发明还提供了一种可视化内容管理系统。图11是按照本发明的可视化内容管理系统的结构示意图。如图11所示，本发明还可视化内容管理系统包括：分割单元110，用于将前端页面分割成至少一个可视化编辑挂件；呈现单元120，用于呈现可视化编辑界面，所述可视化编辑界面是包括至少一个可视化编辑挂件在内的前端页面；编辑单元130，用于对所述可视化编辑挂件进行可视化编辑；保存单元140，用于保存编辑结果。

根据本发明应用的可视化内容管理系统的实施方式，所述进呈现单元120还配置为：响应于在地址栏中输入特定字符，呈现所述可视化编辑界面。

根据本发明应用的可视化内容管理系统的实施方式，所述进呈现单元120还配置为：在地址栏中输入特定字符之后，经过身份验证后呈现所述可视化编辑界面。

根据本发明应用的可视化内容管理系统的实施方式，所述进呈现单元120还配置为：在所述身份验证后，在预定时间阈值内不需要重复进行身份验证，即可呈现所述可视化编辑界面。

根据本发明应用的可视化内容管理系统的实施方式，所述编辑单元130还配置为：响应于鼠标悬停显示鼠标所在位置的挂件的编辑按钮和隐藏按钮中至少一种。

根据本发明应用的可视化内容管理系统的实施方式，所述编辑单元130还配置为：响应于点击所述编辑按钮呈现挂件编辑界面。

根据本发明应用的可视化内容管理系统的实施方式，所述编辑单元130还配置为：在所述挂件编辑界面中设置编辑框，用于编辑所述挂件的组成元素，所述组成元素包括标题、简介、链接地址、背景图、文本中至少一项。

根据本发明应用的可视化内容管理系统的实施方式，所述编辑单元130还配置为：响应于点击所述隐藏按钮隐藏所述可视化编辑的图层。

根据本发明应用的可视化内容管理系统的实施方式，还包括汇总单元150，用于设置页面汇总菜单，在所述汇总菜单中选择要编辑的页面进行可视化编辑。

根据本发明应用的可视化内容管理系统的实施方式，所述编辑单元130还配置为：不允许两个以上用户同时对同一个所述可视化编辑挂件进行编辑。

根据本发明应用的可视化内容管理系统的实施方式，还包括切换单元160，用于在不同版本的页面编辑之间互相切换。所述不同版本的页面包括PC端页面编辑和手机端页面编辑。

根据本发明应用的可视化内容管理系统的实施方式，通过在系统前端页面中植入jquery代码，实现可视化内容管理。

本发明提供的可视化内容管理方法及系统使得系统前端内容，从逻辑框架到展示内容全部独立，增加了系统在内容管理上的灵活性；解决了在内容修改过程中，因数据过多带来的查询检索问题；其简易的使用方式，降低了系统管理员的学习使用成本；其所见即所得的编辑方式，减少了内容管理上的错误率；同时支持权限分配，规避多人编辑同一内容，相互覆盖的问题。

为了更好地理解本发明，以上结合本发明的具体实施例做了详细描述，但并非是对本发明的限制。凡是依据本发明的技术实质对以上实施例所做的任何简单修改，均仍属于本发明技术方案的范围。本说明书中每个实施例重点说明的都是与其它实施例的不同之处，各个实施例之间相同或相似的部分相互参见即可。对于系统实施例而言，由于其与方法实施例基本对应，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。

可能以许多方式来实现本发明的方法系统。例如，可通过软件、硬件、固件或者软件、硬件、固件的任何组合来实现本发明的方法和系统。用于所述方法的步骤的上述顺序仅是为了进行说明，本发明的方法的步骤不限于以上具体描述的顺序，除非以其它方式特别说明。此外，在一些实施例中，还可将本发明实施为记录在记录介质中的程序，这些程序包括用于实现根据本发明的方法的机器可读指令。因而，本发明还覆盖存储用于执行根据本发明的方法的程序的记录介质。

本发明的描述是为了示例和描述起见而给出的，而并不是无遗漏的或者将本发明限于所公开的形式。很多修改和变化对于本领域的普通技术人员而言是显然的。选择和描述实施例是为了更好说明本发明的原理和实际应用，并且使本领域的普通技术人员能够理解本发明从而设计适于特定用途的带有各种修改的各种实施例。