第一步,在左侧栏目,知识文库节点上右键选择首页自定义设置,如下图:
第二步,在右侧自定义页面代码编辑器中右键选择新建首页模版,如下图:
然后选择一个路径,保存后会自动生成了一个基于jquery mobile的页面代码,如下:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>自定义首页</title> <meta name="viewport" content="width=device-width,initial-scale=1"/> <link href="html/css/mobile.css" rel="stylesheet" /> <script type="text/javascript" src="html/js/jquery-1.6.4.min.js"></script> <script type="text/javascript" src="html/js/jquery.mobile-1.2.0.min.js"></script> </head> <body> <div data-role="page" id="page1"> <div data-role="header"><h1>页面一标题</h1></div> <div data-role="content"><p>欢迎您使用KM盒子</p><a href="#page2">转到页面二</a></div> <div data-role="footer"><h1>版权版有 @ KMAPK</h1></div> </div> <div data-role="page" id="page2"> <div data-role="header"><h1>页面二标题</h1></div> <div data-role="content"><p>感谢您使用KM盒子</p><a href="#page1">转到页面一</a></div> <div data-role="footer"><h1>版权版有 @ KMAPK</h1></div> </div> </body> </html>
同时会在保存的路径上生成一个html的文件夹,其中包含了引用到的js和css文件,以及相应的图标文件。同时html文件夹也可以用来存放其他用到的html文件。
上面代码div中的data-role属性为jquery mobile自定义属性,其参数意义如下:
data-role="page" 是显示在浏览器中的页面
data-role="header" 创建页面头部的工具栏
data-role="content" 定义页面的内容,比如文本、图像、表单和按钮,等等
data-role="footer" 创建页面底部的工具栏