Dashboard dynamic themes

we can create dynamic themes  using bootswatch  themes .


http://bootswatch.com/cyborg/


we have to add  reference : bootstrap css /jquery js /bootstrap js  -

var themes = {

// "default": "http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css",

"amelia" : "http://bootswatch.com/amelia/bootstrap.min.css",

"cerulean" : "http://bootswatch.com/cerulean/bootstrap.min.css",

"cosmo" : "http://bootswatch.com/cosmo/bootstrap.min.css",

"cyborg" : "http://bootswatch.com/cyborg/bootstrap.min.css",

"flatly" : "http://bootswatch.com/flatly/bootstrap.min.css",

"journal" : "http://bootswatch.com/journal/bootstrap.min.css",

"readable" : "http://bootswatch.com/readable/bootstrap.min.css",

"simplex" : "http://bootswatch.com/simplex/bootstrap.min.css",

"slate" : "http://bootswatch.com/slate/bootstrap.min.css",

"spacelab" : "http://bootswatch.com/spacelab/bootstrap.min.css",

"united" : "http://bootswatch.com/united/bootstrap.min.css"

}

$(function(){

var themesheet = $('<link href="'+themes['default']+'" rel="stylesheet" />');

themesheet.appendTo('head');

$('.theme-link').click(function(){

var themeurl = themes[$(this).attr('data-theme')];

themesheet.attr('href',themeurl);

});

});

Reference from :


http://jsfiddle.net/82AsF/






http://jqwidgets.com/themebuilder/#active