Search code examples
jqueryjquery-uithemerollerfile-structure

Downloading jQuery UI: Ok, so what part of this mess do I copy to the server?

From the "should be simple, but..." files: Trying to get started with jQuery UI. Went to the site, used their custom builder thingy to assemble the parts I need, made myself a custom theme using the Theme Roller, downloaded the zip file thus produced, unzipped it on my local drive. Ok, so I have 37 folders, 311 files, and a total of 2.4 MB. Ain't no way in hell all this is going on the server. What parts do I need to put there?

  • 'css'
    • 'custom-theme': jquery-ui-1.8.custom.css, 'images' subfolder with 12 .png images
  • 'development-bundle'
    • 'demos': demos.css, index.html, plus 18 subfolders, but I'm guessing "not needed"
    • 'docs': 17 .html files, but again, I'm guessing "not needed"
    • 'external': 4 .js files, one .css
    • 'themes': 'base' and 'custom-theme' subfolders, each with 8 or 9 .css files and an 'images' subfolder with about a dozen images
    • 'ui': 25 .js files, an 'i18n' subfolder with 53 .js files, and a 'minified' subfolder with 24 .js files
  • 'js': jquery-1.4.2.min.js and jquery-ui-1.8.custom.min.js


Also, the file structure. Our server is set up something like this:

  • root
    • admin (administrative tools)
    • css
    • forms (the gist of the site lives here)
    • images
    • include (asp code snippets that are used by multiple pages)
    • js (just a few things right now, like an ancient wheezing spelling checker)

As far as I can tell, the jQuery css files assume that (1) each theme is in its own folder, and (2) each folder has its own images subfolder. How can I convince it otherwise? i.e. put the necessary .js files in the 'js' folder, the .css files in the 'css' folder, and the images in the 'images' folder?

Solution

  • I usually copy jquery-ui-1.8.custom.css and jquery-ui-1.8.custom.min.js along with the images to my server. You'll also need the jquery-1.4.2.min.js file if you do not already have it on your server. The rest I do not use.

    If you put the images within your images directory you do not need to change anything.

    You really do not need anything in development bundle. It contains a bunch of demos and all the pre-built themes if you want to experiment with them.

    This link contains more info on getting started with jQuery UI: http://learn.jquery.com/jquery-ui/getting-started/