jQuery UI ThemeRoller - Installing themes
I'm trying to install jQuery UI with a ThemeRoller theme for the first time. I've downloaded jquery 1.4.2... I've downloaded jQuery UI with a couple of themes. I've tried to follow the instructions but they seem contradictory and don't seem to related to the downloaded files.
When I try to use a datepicker... the datepicker functionality works, but it has the default (grey) style.
This page refers to a folder/sub-folder/css files that don't exist. This page refers to a ui.theme.css file that doesn't exist.
The downloads I received included the following:
--development-bundle
---demos
----docs
----external
----themes
------base
------Redmond
----ui
------i8n
------minified
--js
So what do you put where? I've copied the js to the appropriate directory and linked it into my page. And I copied the themes/base folder as well, and linked into the jquery.ui.all.css file. Even the included demos only display the default (grey) styling.
Where am I going wrong?
EDIT:
Sorry, I actually tried Redmond first, but when it didn't work, I tried Smoothness (a random selection -didn't realise it was the grey one). I get the same results for each - grey. [also corrected folder structure above]
EDIT 2: Well, I've figured it out.... neither of the initial Smoothness or Redmond downloads had a CSS folder (as could be seen from the structure I described above). Both of these themes were downloaded within minutes of each other and have different file sizes). I've just tried downloading Cupertino, which does have a CSS folder - when I copy this to my app, I get appropriate styling.
So I tried downloading Redmond again, and lo and behold - it also now has a CSS folder... I wondered if I might have downloaded the same theme twice, but they have different timestamps and different file sizes... I'm puzzled. Perhaps the jQuery server was just having a brain-fart!
Todays gold star goes to nick for putting me onto the trail of jquery-ui-1.8.custom.css, which eventually led to my epiphany!
EDIT 3:
I've just started downloading Start and Humanity - both zip files DO NOT have a CSS folder!
Digging further, it seems I might not be crazy after all.
Answer
You need to change this link in your head, it should be in this format:
<link rel="Stylesheet" href="/css/MY_THEME_HERE/jquery-ui-1.8.custom.css" />
For example, if you downloaded the redmond theme would be:
<link rel="Stylesheet" href="/css/redmond/jquery-ui-1.8.custom.css" />
Whatever theme you chose when downloaded should be included in the zip at this path. If you built a custom theme, it will be:
<link rel="Stylesheet" href="/css/custom-theme/jquery-ui-1.8.custom.css" />