其他分享
首页 > 其他分享> > 魔方财务前端主题模板开发教程来啦!看完记得报名参加魔方财务主题开发大赛哦~

魔方财务前端主题模板开发教程来啦!看完记得报名参加魔方财务主题开发大赛哦~

作者:互联网

魔方财务是一套集客户、产品、订单、账单管理于一体的自动化管理系统。满足客户自主下单、自助交付及自主管理目的无需人工干预,提高业务自动化水平

虽然智简魔方官方自带了一套模板,但往往有时候有人就喜欢其他的类型
很多的人会选择去购买他人已经开发好的模板,但也有很多人会选择自己开发
当我们去查看官方文档时,我*,为什么就一点点教程,我去群里问问,群友一号“万能debug”,群友二号“给一箱红牛我告诉你”,群友三号“我也不会”
此时此刻,你萌生了放弃的想法,别急,看看我的教程!

 

第一步:
你肯定要有开发思路和大概样式,并且懂一些html技巧
首先我们需要有一个能够直接访问的html页面(如果你只是自己用,那就别看了)
如:

 

但是这个页面他不能跟着魔方财务后台的修改而变化
那么这个时候我们就需要用到变量了(我是这么理解的)


我们需要把文件解刨成四部分:样式文件、头部文件、页面文件、底部文件


样式文件,我推荐放在assets文件夹中分成css、js、img、svg四个文件夹,以便于使用
头部文件,也就是<!doctype html><html><head></head>这个部分的代码片段
页面文件,就是<body></body>里面的所有代码片段
底部文件,位于</body>结束后的代码片段


如何存放文件呢?
样式文件存放于assets文件夹、头部文件跟底部文件存放于common文件夹,并分别命名为header.html和footer.html,页面文件就放在你模板的目录(/public/themes/web/模板名字)
按照上面的教程,我们把文件解刨之后,把首页文件命令index.html,接下来我们要把头部跟底部文件引入到页面里
头部引入:{include file="common/header" /}
底部引入:{include file="common/footer" /}
大概是这样子
<ignore_js_op>

当你访问,你可能会发现css这些样式全部404,这是因为我们要修改文件的路径(大部分在头部跟底部,少部分在页面)
比如我的
<link rel="stylesheet" href="assets/css/theme.min.css">
我们只需要在assets前面加上{$setting.web_view}/就行了
也就是
<link rel="stylesheet" href="{$setting.web_view}/assets/css/theme.min.css">
把全部需要引入样式文件的路径全部修改一遍,大功告成
首页就写完了,快去欣赏一下你的杰作吧!
emmm,进阶教程等我有空再更新~最后的最后,可以加入{debug}让你看到系统的一些变量,也可以去参考官方模板!

注:以上内容转自魔方论坛

 

怎么样,看完你是否已经学会了如何开发一个魔方财务前端的主题首页呢?看完就赶紧动起手来开发,现在行动,还可参与智简魔方财务系统主题开发大赛哦~

最后,附上智简魔方官方开发文档链接:  https://www.idcsmart.com/wiki_list/739.html

 

关于大赛

 

魔方财务系统是一款IDC主机销售管理系统,拥有web前端展示平台。为了让用户更好地了解我们的平台,收集更多的优秀平台主题,因此举办了此次大赛,希望感兴趣的朋友能够踊跃报名参加,丰厚奖品等着你。

本次大赛设立最佳设计奖(1名)、优秀设计奖(2名)、入围设计奖(3名),奖金总价值超过上万元。优胜者作品除了会获得现金奖励外,其获奖作品还将会上架到智简魔方应用商店进行售卖,所得所有收益均归开发者所有。同时,即日起微信扫码进入智简魔方官方活动群,参与本次大赛互动环节,还将有机会赢得重庆2日游大奖、魔方财务专业版和魔方大礼包等多种丰厚礼。福利多多,确定不来看看?

 

 

大赛官网:https://www.idcsmart.com/activity.html
参赛指南:https://www.idcsmart.com/news_cont/623.html
报名要求:有一定的开发技术基础;会简单的html 技术即可
报名截止时间:2021年7月6日——2021年9月15日24点整
报名方式:微信扫码,添加客服微信了解

 

标签:文件,财务,魔方,主题,大赛,html,模板,页面
来源: https://www.cnblogs.com/idcsmart/p/15185393.html