2

I've made a cost calculator script and want to use it on my Drupal 7 site.

I heard to use drupal_add_js, but I don't know in what context.

6

Use a function in the template.php file: yoursite.com/sites/all/themes/YOUR_THEME/template.php

Add JS file in a block:

function YOUR_THEME_preprocess_block(&$variables) {  
    drupal_add_js(drupal_get_path('theme', 'MYTHEME') .'/scripts/path');
} 

Add JS file to one page or node:

function YOUR_THEME_preprocess_page(&$variables) {
  if ($variables['nid'] == 'INSERT_NODE_ID') {
     drupal_add_js(drupal_get_path('theme', 'MYTHEME') .'/scripts/path');
  }
}

Add JS file to a content type:

function YOUR_THEME_preprocess_node(&$variables) {
  if ($variables['type'] == 'INSERT_CONTENT_TYPE') {
       drupal_add_js(drupal_get_path('theme', 'MYTHEME') . '/scripts/path');
  }
}

Add JS file to a view:

function YOUR_THEME_preprocess_views_view(&$variables){
  if ($variables['name'] == 'INSERT_VIEW_MACHINE_NAME') {
    // include javascript
    drupal_add_js(drupal_get_path('theme', 'MYTHEME') . '/scripts/path');
  }
}

As mentioned by @Pierpaolo Cira, you could always replace MY_THEME with MY_MOUDLE. To get the path to your module you would have to use drupal_get_path('module', 'my_module').

Note: MY_THEME and MY_MODULE needs to be lowered case if your module or theme name is lowercased. (E.g. MY_THEME would be replaced with zen if zen)

Source

  • This reply should be the accepted one – Pierpaolo Cira Dec 13 '16 at 18:03
  • 1
    I would add (this is not evident from the reply) that these hooks work also for modules that provides JS behaviours in the visualisation... so (e.g.) YOUR_THEME_preprocess_node(&$variables) can also be YOUR_MODULE_preprocess_node(&$variables). – Pierpaolo Cira Dec 13 '16 at 18:08
3

You can add the js inside a module :

Create the module and put inside the mymodule.module

drupal_add_js(drupal_get_path('module', 'mymodule') . '/mymodule.js');

or in the theme:

in the .info file

name = My theme
description = Theme developed by me.
core = 7.x
engine = phptemplate

scripts[] = mytheme.js

or in a preprocess_page function

function mytheme_preprocess_page(&$vars, $hook) {
  if (true) {
    drupal_add_js(drupal_get_path('theme', 'mytheme') . '/mytheme.js');
    $vars['scripts'] = drupal_get_js(); // necessary in D7?
  }
}
2

A better approach would be to get the path from Drupal, and you have to put the code in the form function;

function mymodule_form($form, &$form_state) {

... some of your forms goes here

    $form['#attached']['js'][] = drupal_get_path('module', 'mymodule') . '/myscript.js';

  return $form;

Also add your javascript between the code below

(function($)  {
  function mymodule_function(context)  {

  // from here

  // paste your code in here

  // till here

  }

  Drupal.behaviors.custommodule = {
    attach: function(context)  {
      mymodule_function(context);
    }
  }
})(jQuery);
2

Use function in template.php

Add JS file in block:

function MYTHEME_preprocess_block(&$variables) {  
    drupal_add_js(drupal_get_path('theme', 'MYTHEME') .'/mytheme.js', 'file');
} 

Add JS file in page or node:

function MYTHEME_preprocess_page(&$variables) {  
     drupal_add_js(drupal_get_path('theme', 'MYTHEME') .'/mytheme.js', 'file');

}
  • Adding the js in hook_init() in custom module will also make it available elsewhere to use, as example function mymodulename_init() { drupal_add_js(drupal_get_path('module', 'mymodulename') .'/mytheme.js'); } – arpitr Sep 12 '13 at 3:40
-1

if your script is saved as .js you can add it like that in html.tpl.php:

<?php drupal_add_js('location/of/my/script/my_script.js'); ?>

more info here

OR

<script src="location/of/my/script/my_script.js"></script> 

in your block or node body (make sure that you select format that does not filter JavaScript i.e. "PHP code")

  • Do I insert this in the node edit form? Is it fine to put the .js file in the sites folder? – user16277 Apr 8 '13 at 0:10
  • yes - you can put it in node edit form if you wish. just remember to enable in "PHP filter" in modules' core section and set "text format" to "PHP code" in node edit form; and yes - you can put .js in sites folder. – sylwester Apr 8 '13 at 10:09
  • Followed your instructions and this did not work for me. – user16277 Apr 8 '13 at 16:38
  • did you clear cache? another solution which I do not recommend but it probably will work is rather than using drupal_add_js is simply [link]<script src="location/of/my/script/my_script.js"></script> – sylwester Apr 9 '13 at 11:46
  • I need to correct myself: By the time Drupal reaches the block data, the contents of <head> have already been generated, this means that calling drupal_add_js through the block's body field will have no effect. Please use <script> as described above or put drupal_add_js in html.tpl.php of your theme – sylwester Apr 9 '13 at 11:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.