1

I've created a landing page in Drupal and now I would like to add some Javascript files that are specific to that page. I've looked in my template.php file to see some preprocess functions others have used but I'm confused as how to specifically target my page to use drupal_add_js().

The function THEME_preprocess_html(&$variables, $hook) is used quite a bit in my file. How can I figure out what is contained in $variables? Can I use that to target my page?

3 Answers 3

1

If your landing page is your front page, in $variables, you have a key named is_front. You can use that to see if you are currently on the home page and add your JS if the value is true.

function bartik_preprocess_html(&$variables) {
  if ($variables['is_front']) {
    drupal_add_js(...);
  }
}

If it's not your front page, you can set the theme_debug setting to TRUE in your settings.php to identify the name of a custom template file that you can use. Just duplicate page.tpl.php and add your custom js in the head or in the footer. Example of my front page when I use theme_debug (html commments) :

<!-- THEME DEBUG -->
<!-- CALL: theme('page') -->
<!-- FILE NAME SUGGESTIONS:
   * page--front.tpl.php
   * page--node--1.tpl.php
   * page--node--%.tpl.php
   * page--node.tpl.php
   x page.tpl.php
-->
<!-- BEGIN OUTPUT from 'themes/bartik/templates/page.tpl.php' -->

I can clone page.tpl.php to page--node--1.tpl.php to have my specific JS included for that page only.

Sign up to request clarification or add additional context in comments.

Comments

1

If you want to avoid messing with the template files entirely, a neat alternative is to put your JS code in a central JS file that's always available (such as in a custom module). Then wrap the JS functions in question with a test to see if you're on that page. My favorite jQuery way to do it is this:

if ($('.node-1234').length > 0) {
  // functions here
}

You can replace '.node-1234' with any style or ID that you know is present on that page but no others. Using a style with an NID is not always the best idea, as ID numbers can change if you transplant your implementation, so check the code. There's probably a view or some other element unique to that page that you can test for. If your page is the front page, you should have .page-front as a possibility, for example.

Comments

0

Depending on your situation it can be an option to:

  • enable node embed
  • create a new text format (admin/config/content/formats/add) that does not have any filters and is only available to your administrator role
  • create a new node containing your JavaScript, using the "unfiltered" format, then embed this node wherever you need the JavaScript

This worked well for me, when I needed to add a short JavaScript snippet to some pages.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.