WP – How to add a script to a specific page

[taxicss]

Hi, I’m looking for a good practice on adding a jQuery script to a specific page on WordPress.

I have a custom single-*.php template that needs this jQuery script to render a marker using the Google Maps API.

What I’m looking for is the best possible way of adding this script so that it will only get loaded for this specific page. Right now I just put it inline inside this single-*.php page.

Thanks.

[chrisburton]

http://codex.wordpress.org/Function_Reference/is_page_template

[chrisburton]

Therefore, wherever you are calling your jQuery scripts, use is_page_template($templateName). The jQuery will then only load when a page is using that template.

Example:

if (is_page_template($templateName) ) {
    echo '<script src="something.js"></script>';
}

[taxicss]

Ok thanks. So I will put that code inside my single-*.php file? Is jQuery loaded all the time in WordPress, because my script depends on jQuery?

[Alen]

I don’t see anything wrong with creating specific template to handle this functionality. So the way you have it, there’s nothing wrong with it.

If you want to delete that specific file, then the conditional code would be inserted into single.php file.

<?php

  if ( is_page( 'my-page-slug' )) { ?>
    <script src="gmap.js"></script>
  <?php
  }
?>

[chrisburton]

So I will put that code inside my single-*.php file?

wherever you are calling your jQuery scripts, use is_page_template($templateName).

In WordPress, jQuery is usually called in the footer. So footer.php?

jQuery loaded all the time in WordPress, because my script depends on jQuery?

Yes but it’s cached. I’m sure you are running other jQuery scripts elsewhere as well. View source to find out.

[taxicss]

Thank you, one last though. I believe the script doesn’t depend on the DOM so should i put it at the lowest part of the page just before calling the footer or what? I was just thinking if its ok so it won’t block the rest of page on rendering.

Again, thank you so much.

[chrisburton]

should i put it at the lowest part of the page just before calling the footer

If the jQuery library is being called in the footer, calling your maps script before that would not work. The maps script would have to come after jQuery is called.

[taxicss]

I’m confused right now. So I cannot put it inside my single-slug.php because it will have to be added after the jQuery which is in the footer. Adding it after the get_footer() in single-slug.php is I believe an error because it will be added outside the closing body/html tag????

Is it OK if I put the conditional tag in the footer?

[chrisburton]

@taxicss Post your template file and footer.php file on pastebin (separately).

[taxicss]

footer
Your text to link here…

single-branches.php
Your text to link here…

[chrisburton]

@taxicss can you post header.php?

[taxicss]

@chrisburton

header

[chrisburton]

@taxicss Where exactly is jQuery being called? I assume within the wp_header() function.

[taxicss]

@chrisburton

It is added under functions.php

// smart jquery inclusion
if (!is_admin()) {
wp_deregister_script('jquery');
wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"), false);
wp_enqueue_script('jquery');
}
<code></code>

[Author]

Posts