帝国模板之家为广大用户提供专业、一站式建站服务。

网站模板

网站模板栏目提供大量精品企业网站模板,个人博客网站模板,html网站模板,手机网站模板免费下载。

当前位置:首页 > 资源 > 网站模板 > 正文

Bootstrap v3.3.7纯HTML后台管理系统模板

帝国模板之家 2021-04-11 网站模板 评论

模板说明

网站主题切换,有默认白色,黑色,和渐变蓝绿色的半透明三种。另外:logo、顶部和侧边栏可单独调整颜色(黑色和半透明主题时选择白色不变)。增加主题切换,增加了很多css,如果你不需要有主题切换功能,可将多余的内容删除掉。

HTML页面中删除掉<!--切换主题配色-->之间的内容
js中删除 line 137 - line 146
css中删除 line 2937 - line 3946
主题切换并没有存到cookie中,大家根据自己实际情况,做cookie存储或者其他方式。

jquery-cookie保存设置示例
    // 使用时,请自行引入jquery.cookie.js
    // 读取cookie中的主题设置
    var the_logo_bg    = $.cookie('the_logo_bg'),
        the_header_bg  = $.cookie('the_header_bg'),
        the_sidebar_bg = $.cookie('the_sidebar_bg'), // iframe版本如果删除了下面一行,请把这一行的逗号改成分号
        the_site_theme = $.cookie('the_site_theme'); // iframe版本可不需要这行
    
    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); // iframe版本可不需要这行
        
        // 处理主题配色下拉选中
        $(".dropdown-skin :radio").each(function(){
            var $this = $(this),
                radioName = $this.attr('name');
            switch (radioName) {
                case 'site_theme':
                    $this.val() == the_site_theme && $this.prop("checked", true);
                    break;  // iframe版中不需要这个case
                case 'logo_bg':
                    $this.val() == the_logo_bg && $this.prop("checked", true);
                    break;
                case 'header_bg':
                    $this.val() == the_header_bg && $this.prop("checked", true);
                    break;
                case 'sidebar_bg':
                    $this.val() == the_sidebar_bg && $this.prop("checked", true);
            }
        });
    
    // 设置主题配色
    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'); // iframe版本可不需要这行
    setTheme('logo_bg', 'data-logobg');
    setTheme('header_bg', 'data-headerbg');
    setTheme('sidebar_bg', 'data-sidebarbg');

模板效果图

后台首页

后台登陆模板

后台文档列表

后台新增页面模板

这世上无忧无虑的人,反而相对寿命会长点。

已有 位小伙伴发表了看法

欢迎 发表评论

  • 匿名发表

关于

帝国cms模板

网页插件

帝国模板之家 | www.moyouyouw.cn

本站所有模板/文章除标明原创外,均来自网络转载,版权归原作者所有,如果有侵犯到您的权益,请联系站长删除,谢谢! 寻找帝国cms模板首选帝国模板之家,用心做站,上线至今广受好评,值得信赖!

  • 交流群1:帝国cms交流群1
  • 交流群2:帝国cms交流群2
在线QQ 给我留言