Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rishiqing/mui032
新版官网模板
https://github.com/rishiqing/mui032
Last synced: 27 days ago
JSON representation
新版官网模板
- Host: GitHub
- URL: https://github.com/rishiqing/mui032
- Owner: rishiqing
- Created: 2018-03-19T09:01:46.000Z (almost 7 years ago)
- Default Branch: dev
- Last Pushed: 2022-04-25T13:26:27.000Z (over 2 years ago)
- Last Synced: 2023-03-03T17:06:40.937Z (almost 2 years ago)
- Language: PHP
- Homepage:
- Size: 562 KB
- Stars: 2
- Watchers: 6
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# mui032
安装
-----
直接把源代码clone到metinfo的templates文件夹下，然后在后台系统里直接导入即可
应用工具下载
-----
* 在后台系统中 增值服务--官方商城--应用，右上角搜索处进行应用的搜索、下载和安装。
1.模板制作助手（可以不安装）
* 修改模板的时候，如果需要自定义一些标签，借助模板制作助手，可以往我们的模板中增加一些变量，避免页面中的文字和图片等信息写死，后期不方便产品运营在后台修改，不方便维护。注：目前这套模板放弃通过模板制作助手添加变量的方式，而是通过修改ui.json文件方式配置参数。
* 我们通过模板制作助手添加的一些分区、变量等数据信息会保存在我们模板中的install文件夹--template.json文件中。首次在模板制作助手添加，会自动生成一个install文件夹。
2.上传文件管理器（米拓暂时下架这个应用了，无需安装）
* 方便管理那些我们已经上传的图片、视频、文本文件等。
栏目管理
-----
* 点击 栏目管理--添加新栏目，按照以下栏目添加。属于二级栏目的对应在其一级栏目的 更多--添加 即可。下面列出的分别按照 栏目等级--排序--栏目名称--导航栏显示--所属模块--目录名称 的顺序，对照设置。本项目最多用到二级栏目。
* 下面表格中的 `-`仅仅是为了对照方便查看而插入的分割线，表格太长，设置项较多，分割线便于对照。
* 另外，下面表格中的 `...`是表示此处设置只是简单列出了部分项，没有全部列出，实际设置时按照产品要求同理设置即可。
栏目等级
排序
栏目名称
导航栏显示
所属模块
目录名称
一级
0
功能
头部主导航条
产品模块
function
二级
0
日程安排
不显示
产品模块
function
二级
1
计划管理
不显示
产品模块
function
二级
2
工作笔记
不显示
产品模块
function
二级
3
在线云盘
不显示
产品模块
function
二级
4
公司同事
不显示
产品模块
function
－
－
－
－
－
－
一级
1
价格
头部主导航条
产品模块
price
二级
0
中国铁塔
不显示
产品模块
price
二级
1
SYKES
不显示
产品模块
price
二级
2
亚洲保理
不显示
产品模块
price
二级
3
昌河汽车
不显示
产品模块
price
二级
4
中原物流
不显示
产品模块
price
二级
5
华生集团
不显示
产品模块
price
二级
6
通威太阳能
不显示
产品模块
price
二级
7
四达人才
不显示
产品模块
price
－
－
－
－
－
－
一级
2
下载
头部主导航条
下载模块
download
－
－
－
－
－
－
一级
3
解决方案
头部主导航条
文章模块
solution
二级
0
互联网
不显示
文章模块
solution
三级
0
互联网文章1
不显示
文章模块
solution
...
...
...
...
...
...
二级
1
建筑
不显示
文章模块
solution
三级
0
建筑文章1
不显示
文章模块
solution
...
...
...
...
...
...
二级
2
制造业
不显示
文章模块
solution
...
...
...
...
...
...
二级
3
电商
不显示
文章模块
solution
...
...
...
...
...
...
二级
4
法律
不显示
文章模块
solution
...
...
...
...
...
...
－
－
－
－
－
－
一级
4
使用方法
头部主导航条
文章模块
method
二级
0
使用方法1
不显示
文章模块
method
三级
0
使用方法文章1
不显示
文章模块
method
...
...
...
...
...
...
－
－
－
－
－
－
一级
5
企业微信
头部主导航条
产品模块
wechat
－
－
－
－
－
－
一级
6
支持
头部主导航条
简介模块
about
二级
0
帮助中心
不显示
图片模块
help
二级
1
产品手册
不显示
简介模块
about
三级
0
日事清概况
不显示
简介模块
about
三级
1
开始使用日事清
不显示
简介模块
about
三级
2
注册账号
不显示
简介模块
about
三级
3
登陆账号
不显示
简介模块
about
...
...
...
...
...
...
二级
2
培训课程
不显示
图片模块
img
二级
3
官方博客
不显示
文章模块
article
三级
0
官方公告
不显示
文章模块
article
三级
1
媒体报道
不显示
文章模块
article
三级
2
活动沙龙
不显示
文章模块
article
三级
3
用户故事
不显示
文章模块
article
...
...
...
...
...
...
二级
4
更新日志
不显示
文章模块
toplog
三级
0
Web
不显示
文章模块
toplog
三级
1
Android
不显示
文章模块
toplog
三级
2
iOS
不显示
文章模块
toplog
...
...
...
...
...
...
－
－
－
－
－
－
一级
7
底部导航
不显示
产品模块
product
二级
0
产品
不显示
产品模块
product
二级
1
使用
不显示
产品模块
product
二级
2
公司
不显示
产品模块
product
二级
3
其他
不显示
产品模块
product
－
－
－
－
－
－
一级
8
使用技巧
不显示
图片模块
skill
二级
0
日程
不显示
图片模块
skill
二级
1
计划
不显示
图片模块
skill
二级
2
笔记
不显示
图片模块
skill
二级
3
公司
不显示
简介模块
other
...
...
...
...
...
...
－
－
－
－
－
－
一级
9
关于我们
不显示
简介模块
company
二级
0
公司简介
不显示
简介模块
company
二级
1
联系我们
不显示
简介模块
company
二级
2
加入我们
不显示
招聘模块
job
－
－
－
－
－
－
一级
10
代理合作
不显示
产品模块
agency
二级
0
为什么选择成为日事清的代理商？
不显示
产品模块
agency
二级
1
日事清能为你提供什么？
不显示
产品模块
agency
二级
2
代理日事清您需要具备什么基础条件？
不显示
产品模块
agency
－
－
－
－
－
－
一级
11
服务条款
不显示
service
－
－
－
－
－
－
一级
102
使用用户
不显示
图片模块
use
－
－
－
－
－
－
一级
103
产品介绍
不显示
产品模块
introduce
－
－
－
－
－
－
一级
104
首页随时随地享受工作
不显示
产品模块
animate
－
－
－
－
－
－
一级
105
首页解决方案
不显示
图片模块
partial
－
－
－
－
－
－
一级
106
工作中遇到的问题
不显示
图片模块
settle
－
－
－
－
－
－
一级
107
帮助中心第一部分
不显示
图片模块
helpone
一级
108
帮助中心第二部分
不显示
图片模块
helptwo
一级
109
帮助中心第三部分
不显示
图片模块
helpthree
－
－
－
－
－
－
一级
110
常见问题
不显示
文章模块
faq
二级
0
日程
不显示
文章模块
faq
二级
1
计划
不显示
文章模块
faq
二级
2
笔记
不显示
文章模块
faq
二级
3
公司
不显示
文章模块
faq
二级
4
其它
不显示
文章模块
faq
－
－
－
－
－
－
一级
111
数据安全说明
不显示
简介模块
datasafe
需要进一步进行设置的一级二级和三级栏目
-----
* 1.一级栏目--功能，是在 功能 这个列表页用到的，其下面的5个二级栏目，需要进一步设置描述以及栏目图片。
* 2.一级栏目--价格，其下面的8个二级栏目，是在 价格 这个列表页的`谁在用日事清`部分用到的，需要进一步设置栏目图片。
* 3.一级栏目--首页解决方案，需要设置栏目标题为`为各行各业提供全方位的解决方案`，以及简短描述为解决方案的链接地址，开发环境下为`http://localhost/metinfo/solution/index.php?lang=cn&pageset=1`，还有栏目修饰名称为`了解更多`。
* 4.一级栏目--工作中遇到的问题，同上面首页解决方案的设置，需要分别设置栏目标题/简短描述/栏目修饰名称。
风格--Banner管理
-----
* 点击 风格--Banner管理--添加Banner，按照以下banner信息添加。
* 为空没填的项，代表清空此项的数据即可。
排序
图片标题
图片标题颜色
图片描述
图片描述颜色
图片文字位置
所属栏目
0
日事清 工作开始的地方
#5698db
企业微信战略合作伙伴，数十万家企业共同选择，打造高效企业
#97acc1
左
网站首页
1
覆盖工作方方面面
#5698db
高效之旅，远不止于此
#97acc1
居中
功能
2
永久免费，按需付费
#5698db
做最适合你的选择，用最低的价格
#97acc1
居中
价格
3
让工作超越距离
#5698db
全平台支持，只为时刻准备着的你
#97acc1
居中
下载
4
全方位企业管理解决方案
#5698db
让每个行业、每份工作都能运转自如
#97acc1
居中
解决方案及其下所有子栏目
5
深入场景，玩转日事清
#5698db
完美解决办公场景中的每一个问题
#97acc1
居中
使用方法及其下所有子栏目
6
日事清 X 企业微信
#5698db
保持高昂生产力
#97acc1
居中
企业微信
7
帮助中心
#5698db
获悉你想要的一切
#97acc1
居中
帮助中心
8
产品手册
#5698db
欢迎使用日事清！
#97acc1
居中
产品手册及其下所有子栏目
9
培训课程
#5698db
走进企业 了解企业 服务企业
#97acc1
居中
培训课程
10
官方博客
#5698db
记录日事清的点滴
#97acc1
居中
官方博客及其下所有子栏目
11
更新日志
#5698db
变化之间，无不洞悉
#97acc1
居中
更新日志及其下所有子栏目
12
日事清，工作开始的地方
#5698db
#97acc1
居中
关于我们及其下所有子栏目
13
日事清邀您一起
#5698db
开拓企业级SaaS市场这片蓝海
#97acc1
居中
代理合作
14
使用技巧
#5698db
#97acc1
居中
使用技巧及其下所有子栏目
15
常见问题
#5698db
#97acc1
居中
常见问题
其它数据配置(可视化后台中的一些顶部选项配置信息)
-----
* 1.页面设置，地址栏图标---上传日事清.ico文件
* 2.风格--风格设置，模板主色调---#5b5b5b；模板副色调---#8c8c8c；模板配色调---#5698db
* 3.风格--水印/缩略图-缩略图，产品模块--200 X 200；图片模块--268 X 214；文章模块--230 X 152
下面的设置和内容均指在可视化后台中某个部分的设置/内容，只有设置的表示此部分只需要点击设置，不需要点击内容；只有内容的表示此部分只需要点击内容，不需要点击设置；
-----
头部导航条设置(公共)
-----
导航固定时下拉时logo
（自己上传logo图片）
下拉展示
无
导航禁用下拉菜单
功能|价格|解决方案|使用方法|
一级导航文字颜色
#97acc1
导航固定时一级导航文字颜色
#4a4a4a
一级导航鼠标经过文字颜色
#5698db
区块背景色
#ffffff
二、三级菜单字体颜色
#4a4a4a
二、三级菜单背景色
#ffffff
二、三级菜单鼠标经过字体颜色
#5698db
二、三级菜单鼠标经过背景色
#ffffff
一级导航菜单禁止跳转
支持|
首页banner部分设置
-----
* 由于banner被头部导航条覆盖，所以对banner进行单独设置的时候，需先将鼠标置于头部导航条，右键--点击隐藏掉头部导航条
内页无banner时头部标语的位置
左
按钮2链接
http://res-front-cdn.rishiqing.com/common/video/%E6%97%A5%E4%BA%8B%E6%B8%85%EF%BC%8C%E4%BD%A0%E7%90%86%E6%83%B3%E7%9A%84%E5%B7%A5%E4%BD%9C%E6%96%B9%E5%BC%8F.mp4
按钮颜色
#0e6dce
首页第二部分`partner_list`
-----
* 1.设置
标题
深受数十万企业用户的喜爱
描述
大尺寸电脑显示列数
6
普通电脑显示列数
6
平板显示列数
3
手机显示列数
2
栏目选择
使用用户
调用条数
8
区块背景展示方式
背景色
区块背景色
#ffffff
缩略图宽
177
缩略图高
94
图片展示方式
灰度
区块标题颜色
#9c9c9c
区块描述颜色
列表图片是否有链接
纯展示
* 2.内容
* 可视化后台中点击内容--右上角选择使用用户--再点击添加内容，设置以下三项即可，按设计图上依次共需要设置八个，设置好之后，将这八个的排序按照排序值从大到小（可以是从8到1），对应设计图上的从前到后顺序(即排序数值越大越靠前)。
所属栏目
使用用户
标题
中国铁塔
展示图片
上传对应图片即可
首页第三部分`service_list`
-----
* 1.设置
标题
覆盖工作方方面面，释放每个人的潜力
描述
调用栏目
产品介绍
调用栏目数量
9
是否链接
纯展示
大尺寸电脑显示列数
3
普通电脑显示列数
3
平板显示列数
1
手机显示列数
1
区块背景方式
背景色
标题颜色
#5b5b5b
描述颜色
* 2.内容
* 点击添加内容，设置以下几项
* 下面以日程安排为例，其它八项同理按设计图上一一设置添加即可
所属栏目
产品介绍
标题
日程安排
展示图片
上传对应图片即可
详细内容
工作任务分轻重缓急逐一破，日、周、月视图任意切换
其他设置--链接至
写入对应链接即可
首页第四部分`custom_list`
-----
* 1.设置
栏目选择
产品动画列表
是否链接
超链接
查看文字
开始使用
调用条数
1
区块背景展示方式
背景色
奇块背景色
#ffffff
偶块背景色
#f5f8fa
区块标题颜色
#ffffff
区块副描述
#ffffff
超链接颜色
#ffffff
* 2.内容
* 点击内容，右上角选择首页随时随地享受工作，添加内容，按照下面设置
所属栏目
首页随时随地享受工作
标题
随时随地享受工作
展示图片
上传大图
详细内容
我们的提供全平台的产品，触及每一个工作场景，只为时刻准备着的你
链接至
对应跳转链接
首页第五部分`img_list_page`
-----
* 1.设置
* 调用栏目--首页解决方案
* 2.内容
* 右上角选择首页解决方案，然后添加内容，依次按照下面设置添加对应的5个解决方案即可
所属栏目
首页解决方案
标题
互联网解决方案
展示图片
上传对应图片即可
链接至
解决方案页面中的对应子分类地址
首页第六部分`img_list_page`
-----
* 1.设置
* 调用栏目--工作中遇到的问题
* 2.内容
* 右上角选择工作中遇到的问题，然后添加内容，同上面首页第五部分解决方案的设置，依次添加对应内容即可
首页第七部分`contact`
-----
* 设置
标题
从此，拥有更好的前程
描述
展示内容
按钮链接
按钮文字
立即体验
区块背景展示方式
背景图
区块背景色
#f9fcff
区块标题颜色
#5b5b5b
区块背景图
上传背景图即可
区块描述颜色
#ffffff
按钮颜色
#0e6dce
按钮文字颜色
#ffffff
首页第八部分友链`link`
-----
* 1.设置
友情链接标题
合作伙伴
背景色
标题颜色
#333333
描述颜色
鼠标经过颜色
线框颜色
底部导航栏设置(在首页设置)
-----
* 1.设置
调用栏目
底部导航
服务热线
描述文字
微信
关闭
微信二维码
QQ
关闭
新浪
关闭
邮箱
关闭
显示栏目数量
4
鼠标经过颜色
当前栏目颜色
#3d3d3d
区块背景色
子栏目字体颜色
#8c8c8c
边框线条颜色
#ffffff
* 2.内容
* 点击内容--右上角选择 底部导航--产品，然后添加内容，按照以下设置，依次给底部导航的四个子栏目添加对应内容即可
所属栏目
产品
标题
产品功能
链接至
设置为头部功能页的练级即可
功能页`product_list_page`设置
-----
* 设置
区块背景色
#ffffff
标题颜色
#3d3d3d
描述颜色
#8c8c8c
区块背景展示方式
背景色
奇块背景色
#ffffff
偶块背景色
#f9fcff
价格页`product_list_page`内容
-----
* 内容
* 点击添加内容，设置以下几项
所属栏目
价格
标题（名称）
免费版
展示图片
参数管理
按下面表格新增参数
* 然后是 参数管理 选项，参照下面表格
名称
字段类型
所属栏目
访问权限
排序
价格
简短
价格
不限制
0
储存空间
简短
价格
不限制
1
文件大小
简短
价格
不限制
2
功能1
简短
价格
不限制
3
功能2
简短
价格
不限制
4
功能3
简短
价格
不限制
5
功能4
简短
价格
不限制
6
功能5
简短
价格
不限制
7
功能6
简短
价格
不限制
8
功能7
简短
价格
不限制
9
功能8
简短
价格
不限制
10
功能9
简短
价格
不限制
11
功能10
简短
价格
不限制
12
功能11
简短
价格
不限制
13
* 接着 返回到 内容设置页面，点击参数管理后面的 刷新 按钮，就可以看到刚才添加的参数了，依次按设计图上文字设置，注意价格一栏由于下角标的特殊显示，其参数需要填充为html形式，如免费版中是`0元/年`
* 按照以上设置，依次设置免费版，专业版，企业版，旗舰版参数
* 其中专业版，企业版，旗舰版的存储空间和文件大小一栏，同样由于一些文字的特殊样式显示，其参数也需要填充为html形式，如专业版中存储空间为`50G储存空间`，文件大小为`上传单个文件最大支持1G`。企业版和旗舰版同理。
价格页`img_list_page`
-----
* 这部分的设置显示比较特殊，需从 栏目管理--价格--设置--栏目标题，设置为'谁在用日事清？'，就是此部分展示的标题；所以修改也需要到这里修改。图片的展示按照设计图上，在可视化后台中这部分的对应图片点击上传即可。
价格页`news_list_page`
-----
* 同样，这部分的标题也需要从 栏目管理--价格--设置--栏目修饰名称，设置为'常见问题'；
* 然后点击 内容，右上角选择 产品--价格--三级栏目，再添加内容，只需要设置标题(名称)和详细信息即可，这两个分别对应页面中的问题标题和答案。
* 注意：点击 内容，选择 产品--价格--三级栏目 后，能看到四个已经存在的 免费版，专业版，企业版，旗舰版 列表，继续添加内容即可，只不过最后添加完问题以后，将列表排序更新正确即可。即前四个是价格详情中展示需要的，从第5个开始，是展示在此部分中的。
下载页`download_list_page`内容
-----
* 1.设置
标题颜色
#000000
鼠标经过颜色和按钮颜色及当前页的颜色
#5698db
* 2.内容
* 点击 内容，右上角选择 下载，然后点击 添加内容，按照下面进行设置即可
* 在弹窗的添加内容框中，先找到点击参数管理，新增两个参数，Windows 32位---所属栏目选择下载---排序0；Windows 64位---所属栏目选择下载---排序1，然后保存，回到内容设置弹窗页面，点击 刷新 按钮，即可看到参数设置中多了两个选项 Windows 32位 和 Windows 64位.
* 然后只在 Windows 下载 中设置这两项参数，其它下载中这两项参数值为空
* Windows 下载 中：
* 1.Windows 32位---https://rishiqing-client.oss-cn-shenzhen.aliyuncs.com/pc-autoupdate/win/ia32/release/rishiqing-win-ia32-release-3.1.6.exe
* 2.Windows 64位---https://rishiqing-client.oss-cn-shenzhen.aliyuncs.com/pc-autoupdate/win/x64/release/rishiqing-win-x64-release-3.1.6.exe
所属栏目
标题
下载地址
详细内容
下载
Windows 下载
void(0)
上传图片对应要展示的图片即可
下载
MAC 下载
https://rishiqing-client.oss-cn-shenzhen.aliyuncs.com/pc-autoupdate/mac/release/rishiqing-mac-release-3.1.4.dmg
下载
网页版
上传图片对应要展示的图片即可
下载
Android 下载
void(0)
上传图片对应要展示的图片即可
下载
iOS 下载
void(0)
上传图片对应要展示的图片即可
下载
微信公众号
void(0)
上传图片对应要展示的图片即可
解决方案页`news_list_page`
-----
* 1.内容
* 点击内容，右上角选择解决方案--互联网--相应三级栏目，添加内容，设置文章标题/详细内容即可。
使用方法页`news_list_page`
-----
* 1.内容
* 点击内容，右上角选择使用方法--使用方法1--相应三级栏目，添加内容，设置文章标题/详细内容即可。
企业微信页`news_list_page`
-----
* 1.内容
* 点击内容，右上角选择企业微信，添加内容，设置标题--轻应用,轻办公/展示图片/详细内容--任务实时分配、随时发起讨论；标题--安装到企业微信/展示图片/详细内容--立即安装日事清到企业微信/链接至--安装链接；标题--注册企业微信/展示图片/详细内容--还没有企业微信？立即注册企业微信和日事清/链接至--注册地址，依次添加三条内容，回到内容页面，将三个排序按照3-2-1进行排序，即第一个添加的排序在最前面。
支持--帮助中心页第一部分
-----
* 1.设置
* 调用栏目，选择 帮助中心第一部分
* 2.内容
* 点击内容，右上角选择 帮助中心第一部分，添加内容，分别设置标题--使用手册，展示图片--上传对应图片，详细内容--探索每个功能来了解日事清的基础用法。链接至--对应产品手册的链接地址。
* 添加完之后，回到内容页面，按照大号排序在前，自定义排序即可。
支持--帮助中心页第二部分/第三部分
-----
* 同上面帮助中心第一部分的设置，进行同理设置。
支持--产品手册
-----
* 左侧标题是在栏目中进行设置的，添加栏目时，按照标题顺序添加即可，需要特殊设置的是子级标题部分栏目标识设置为1
* 内容部分，就点击左侧标题，右侧对应点击内容，添加文章内容即可。
支持--培训课程
-----
* 1.设置
* 点击设置，按钮文字--报名，区块背景色--#ffffff
* 2.内容
* 点击内容，右上角选择培训课程，同上一样，添加内容
支持--官方博客页`news_list_page`
-----
1.设置
列表展示
图文
新闻头条
关闭
区块背景色
#ffffff
标题字体颜色
#3d3d3d
描述字体颜色
#8c8c8c
点缀颜色
#b1b1b1
2.内容
* 点击 内容，右上角选择 官方博客--官方公告，然后点击 添加内容，按照文章标题--详细内容--封面图上传设置即可
* 依次按上面操作给几个部分添加文章
3.点击任何一篇博客，进入博客详情页也可进行单独具体设置和内容
支持--更新日志页`news_list_page`
* 同上面 官方博客 操作
自定义ui组件
-----
* 自定义ui组件，有几个需要关注的点
1. ui.json文件，这个文件非常重要，记录着哪些页面用到了哪些ui组件，对应的配置信息，每次在安装模板的时候，系统都会解析这个文件，把ui组件的默认配置信息给写的到数据库
2. id, 这个id是指一个页面里，使用的一个组件，对应的id
3. page, 是页面的名称，如`./agency.php`这个文件，里面有个page属性，这个值需要和php文件名一样，这样才能正常读取和解析页面下面的ui组件和配置
4. config.json文件，这个文件在ui组件的文件夹下，如`ui/contact/met_16_3/config.json`，这个文件目前我了解到的是和组件的css和js代码的打包有很大关系
5. `met_`开头的一个值，它和组件名一起决定组件的唯一性
* 在使用自定义组件的时候，需要确定id，需要根据ui.json里用到的id来确定一个还没有用到的id，保证这个新id在ui.json里的唯一性
* 确定组件需要哪些参数的时候，可以参考ui.json里已有的一些参数，来写新的参数