How to override (replace, alter) JavaScript file used by Drupal module with your own version

This is the scenario: I have edited friendly_register.js file belonging to the Friendly register module in order to make a better CSS sprint (less http requests == site loads faster). I did it using hook_js_alter function in my custom module called "Customer". I placed an updated version of JS file right into the Customer's folder.

NOTE: Here you can learn how to create an ultra simple custom module for Drupal.

This is how the result hook looks like:

/**
 * Path to friendly_register.js override. I have added <span class="icon_check"></span>
 * into default /js/friendly_register.js in order to make better css sprint.
 */
function  customer_js_alter(&$javascript) {
  $javascript[drupal_get_path('module', 'friendly_register') . '/js/friendly_register.js']['data'] = drupal_get_path('module', 'customer') . '/friendly_register.js';
}

Advertisement

If you want to place overriden JavaScript file into your theme folder ("js" subfolder), the code doing the job will be:

/**
 * Path to friendly_register.js override. I have added <span class="icon_check"></span>
 * into default /js/friendly_register.js in order to make better css sprint.
 */
function  customer_js_alter(&$javascript) {
  $javascript[drupal_get_path('module', 'friendly_register') . '/js/friendly_register.js']['data'] = path_to_theme() . '/js/friendly_register.js';
}

This post is based on the solution from this answer.

Advertisement

Post is listed in the Drupal category and marked with the following tag(s): JavaScript, Custom module.