JQuery Mobile default data-theme

Question

Does anyone know how to set a default data-theme for jquery-mobile?

It looks like it´s necessary to set the data-theme for every component.

Even when you set the data-theme for the page data-role it is not respected by loaded lists and other components.

Am I missing some page of the manual?

Answer 1

Like Joel said, you have to overwrite the default values. At the moment it seems like there is no other way.

Take Joel's sample code:

<script src="jquery.js"></script> <script src="custom-scripting.js"></script> <script src="jquery-mobile.js"></script> 

Customize your custom-scripting.js

This is a sample code with a few more options you can configure:

$(document).bind("mobileinit", function () {      // Navigation     $.mobile.page.prototype.options.backBtnText = "Go back";     $.mobile.page.prototype.options.addBackBtn      = true;     $.mobile.page.prototype.options.backBtnTheme    = "d";      // Page     $.mobile.page.prototype.options.headerTheme = "a";  // Page header only     $.mobile.page.prototype.options.contentTheme    = "c";     $.mobile.page.prototype.options.footerTheme = "a";      // Listviews     $.mobile.listview.prototype.options.headerTheme = "a";  // Header for nested lists     $.mobile.listview.prototype.options.theme           = "c";  // List items / content     $.mobile.listview.prototype.options.dividerTheme    = "d";  // List divider      $.mobile.listview.prototype.options.splitTheme   = "c";     $.mobile.listview.prototype.options.countTheme   = "c";     $.mobile.listview.prototype.options.filterTheme = "c";     $.mobile.listview.prototype.options.filterPlaceholder = "Filter data..."; }); 

There should be also other options like:

$.mobile.dialog.prototype.options.theme $.mobile.selectmenu.prototype.options.menuPageTheme $.mobile.selectmenu.prototype.options.overlayTheme 

You might be able to find more settings here: http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.js