基于Bootstrap简洁而清新的后台管理模板“LightYearAdmin”

介绍

光年后台管理模板(Light Year Admin)是一个基于Bootstrap v3.3.7的后台HTML模板。作为后端开发人员,自己在做一些简单系统时,经常为了后台的模板烦恼,因此今天向大家介绍一个对后端开发人员比较友好的管理模板,模板的作者本人也是一名开发人员,因此结合后端人员一些特点而开发的一套基于Bootstrap的管理模板,界面真的非常漂亮,而且功能也能满足大多数人需求!

作者考虑到不同人群的开发习惯和方式,一共分为两个版本,一种是自带tab标签页的iframe版,另一种则是单页面版,可根据自己需要和业务需求选择不同的版本。

模板说明

网站主题切换,有默认白色,黑色,和渐变蓝绿色的半透明三种。另外:logo、顶部和侧边栏可单独调整颜色(黑色和半透明主题时选择白色不变)。

增加主题切换,增加了很多css,如果你不需要有主题切换功能,可将多余的内容删除掉。

  • HTML页面中删除掉<!--切换主题配色-->之间的内容
  • js中删除 line 137 – line 146
  • css中删除 line 2937 – line 3946

主题切换并没有存到cookie中,大家根据自己实际情况,做cookie存储或者其他方式。

jquery-cookie保存设置示例

// 读取cookie中的主题设置
	var the_logo_bg = $.cookie('the_logo_bg'),
	 the_header_bg = $.cookie('the_header_bg'),
	 the_sidebar_bg = $.cookie('the_sidebar_bg'),
	 the_site_theme = $.cookie('the_site_theme');
	console.log(the_logo_bg);
	if (the_logo_bg) $('body').attr('data-logobg', the_logo_bg);
	if (the_header_bg) $('body').attr('data-headerbg', the_header_bg);
	if (the_sidebar_bg) $('body').attr('data-sidebarbg', the_sidebar_bg);
	if (the_site_theme) $('body').attr('data-theme', the_site_theme);
	
	// 设置主题配色
	setTheme = function(input_name, data_name) {
	 $("input[name='"+input_name+"']").click(function(){
	 $('body').attr(data_name, $(this).val());
	 $.cookie('the_'+input_name, $(this).val());
	 });
	}
	setTheme('site_theme', 'data-theme');
	setTheme('logo_bg', 'data-logobg');
	setTheme('header_bg', 'data-headerbg');
	setTheme('sidebar_bg', 'data-sidebarbg');

引用的第三方插件

  • Bootstrap(去掉了自带的字体图标)
  • JQuery
  • bootstrap-colorpicker
  • bootstrap-datepicker
  • bootstrap-datetimepicker
  • ion-rangeslider
  • jquery-confirm
  • jquery-tags-input
  • bootstrap-notify
  • Chart.js
  • chosen.jquery.js
  • perfect-scrollbar

项目地址

https://gitee.com/yinqi/Light-Year-Admin-Template

为TA充电
共{{data.count}}人
人已赞赏
网站源码

OKAdmin一款基于Layui框架的轻量级扁平化后台系统模板

2020-1-30 10:22:23

网站源码

WordPress主题导航系统模板源码分享

2020-2-26 21:57:41

资源下载说明

请使用百度网盘下载资源,请不要在线解压!

1、请记住本站永久网址发布页:http://www.di4.top
2、本站资源大多存储在云盘,如发现链接失效请在下方评论留言,作者看到后会第一时间更新补链。
3、关于解压密码错误或者资源损坏,请查看解压教程:[必看]关于资源教程及常见问题
4、如果有资源想投稿的会员请仔细阅读:投稿指南教程
5、本站大部分资源解压密码均为: di4.top 如密码有误,请查看原帖的资源说明!

个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索