How can I add JavaScript and CSS to my site?
Add a comment
|
2 Answers
The Managing JavaScript in Drupal 7 guide provides the information to add JavaScript to Drupal. The techniques presented there apply to both themes and (custom) modules:
- Add a
scripts[] = somescript.jsto your module or theme's.infofile - Use
drupal_add_js()in your module or theme's code - Use the
#attached['js']property in a Form API or renderable array.
Note that Drupal already include jQuery, jQuery UI and a bunch of other libraries so you don't, and shouldn't, add them yourself. Instead you should use drupal_add_library() or the #attached['library'] property.
The Working with CSS guide provides the information to add CSS to Drupal. Again, the techniques presented there apply to both themes and (custom) modules. With an exception: addition of style sheets from an .info files only works for a theme and not a module.
- Add
stylesheets[all][] = somestylesheet.cssto a theme's.infofile. - Use drupal_add_css() from module or theme's code.
- Use
#attached[css]property in a From API or renderable array.
-
do I need to enable php filter? And where do I add the js. Is it the body section with script tag? like <script></script> I need a simple example to get started. Very basic. Pls– kinkajouOct 9, 2011 at 13:14
-
1You don't add CSS or JavaScript as content of your site, so you don't do it when editing your content. If you need page specific JavaScript or CSS, you can do it from your theme's page preprocess hook. Adding styles (CSS) or behaviors (JavaScript) to your site should be done from code, not from the Web UI. This is way more maintenable and scalable and avoid you, or others, many headaches when updating the site later. Oct 10, 2011 at 8:53
You can place your js file in your theme folder and add this js file to drupal by using drupal_add_js() in template.php preprocess functions.
