drupal themes: how do I include several css files / js files on my theme's .info file?

Question

I'm creating a new Drupal theme.

Until now, I only needed to include a single css file and a single js file. So my theme.info file had something like this:

stylesheets[all][] = css/style.css
scripts[] = js/script.js

Now I must include jquery and jquery-ui in order to use a calendar date. These come with 2 new javascript files, and 1 additonal css file that I must add to the site.

The calendar input form is going to be used in all pages (on a side block) so it is ok for me to load the extra css/javascript on all pages. I think the easiest thing would be to reference them on the .info file itself.

At first I tried to just put them there with separate spaces:

stylesheets[all][] = css/style.css css/ui-lightness/jquery-ui-1.8.1.custom.css
scripts[] = js/script.js js/jquery-1.4.2.min.js js/jquery-ui-1.8.1.custom.min.js

I emptied drupal's cache and... none of them loaded.

I then tried separating each file with a comma, and flushing the cache again. Same result.

I've browsed some drupal pages, but could not find how to add several javascript/css files on one theme (they always seem to add just 1 of each).

So, how do I include several css/javascript files on the .info file?

Answer 1

Each file needs it own line like so:

stylesheets[all][] = css/style.css 
stylesheets[all][] = css/ui-lightness/jquery-ui-1.8.1.custom.css
scripts[] = js/jquery-1.4.2.min.js 
scripts[] = js/reservations.js
scripts[] = js/jquery-ui-1.8.1.custom.min.js