w.donahue
w.donahue

Reputation: 10906

Jquery UI Theme Switcher Alternatives

I want to use the Jquery UI Theme Switcher Widget on my page. The problem is the Switcher is hosted via http and my page is a https page. So I get security errors including the switcher.

Does anyone know if I can get the source of the switcher so I can host it on my site? Or are there any third party switcher scripts that I could use?

Thanks!

Upvotes: 5

Views: 9426

Answers (5)

w.donahue
w.donahue

Reputation: 10906

For anyone that lands here. Here is what I found.

A list of 10 of them is here: (update link is dead now - Apr 2016) http://www.net-kit.com/10-practical-jquery-style-switchers/

A replacement for the jquery theme switcher that you can run locally is here: https://github.com/harborhoffer/Super-Theme-Switcher

Upvotes: 15

Skaman Sam
Skaman Sam

Reputation: 628

I don't want to sound like I am promoting a project I did, but I wrote a jQuery-UI theme switcher based on the themeswitchertool, in order to create one that actually works as advertised. Mine does not link to all the themes by default, but enables you to add any theme you want. Adding all the themes from the jQuery-UI site is trivial.

There is also Super Theme Switcher, which everyone else seems to be using, but it is not as feature-rich as mine, due to it being a port of the old themeswitchertool. This one DOES link all the jQuery UI themes by default.

Upvotes: 3

Carter Medlin
Carter Medlin

Reputation: 12495

You can simply set the src links to "https" and it will work fine.

<link rel="stylesheet" href="themes/MyTheme.min.css" />
<link rel="stylesheet" href="themes/jquery.mobile.icons.min.css" />
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.1/jquery.mobile.structure-1.4.1.min.css" />    
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>    
<script src="https://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script>

Upvotes: 1

woggles
woggles

Reputation: 7444

I had similar errors so I downloaded the js from http://jqueryui.com/themeroller/themeswitchertool/, saved it as jquery.themeswitcher.js and replaced all http jquery-ui urls with google apis https urls.

The only changes were in the var switcherpane where each link looks like:

<li><a href=
"http://jqueryui.com/themeroller/css/parseTheme.css.php?....">
<img src=
"http://jqueryui.com/themeroller/images/themeGallery/theme_90_ui_dark.png" alt=
"UI Darkness" title="UI Darkness" /> <span class="themeName">UI
darkness</span></a></li>

Which I replaced with:

<li><a href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/themes/ui-lightness/jquery-ui.css">
<img src="content/images/theme_90_ui_light.png" alt="UI Lightness" title=
"UI Lightness" /><span class="themeName">UI lightness</span></a></li>

If you search through the file there are a few other html images that are referenced further down.

You can find all the images here

Upvotes: 2

Emil Lundberg
Emil Lundberg

Reputation: 7380

I don't know about any other third party implementations, but it's easy to do yourself too. Just set an id on a link element and use jQuery to change the src attribute when a select box changes. Abstracting it into a plugin is pretty easy as well.

Upvotes: 4

Related Questions