Support » Fixing WordPress » Conditional Tags: How to Run a Different JS Script for Different Pages

  • I want to run a different external JavaScript file for each WordPress page, depending on the page ID.

    If Page ID is [1], run somescript.js
    if Page ID is [15], run someotherscript.js
    if Page ID is [195], run yetanotherscript.js
    in all other cases, by default, run defaultscript.js

    I assume, this has to be coded inside functions.php file – but I may be wrong.

    Could someone please show me how this is done in WordPress with Conditional Tags?

    Best regards,

    Dimitri Vorontzov

Viewing 15 replies - 1 through 15 (of 18 total)
  • No one really knows the answer?

    Anybody?

    Moderator keesiemeijer

    (@keesiemeijer)

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

    try it with something like this in your theme’s functions.php: example

    This seems to be a correct script, keesiemeijer – thank you very much for writing the example – but unfortunately it doesn’t work. I’m not quite sure why because the scripts are all in the correct directories and they work if placed in the header. Somehow this code doesn’t invoke them properly. Do you know what may be the issue? Does it depend on the location of the script in the functions.php file?

    Moderator keesiemeijer

    (@keesiemeijer)

    Does it depend on the location of the script in the functions.php file
    No it doesn’t depend on where it is placed but don’t place it inside another function.

    try it with another example

    This example only loads the scripts on the frontend of your website.

    Nope. 🙁

    Thank you for your effort keesiemeijer.

    I double-checked all the directories and custom JS files. All correct, all works if added directly to the header, nothing works if added as conditionals to the functions.php.

    I would appreciate more ideas from you.

    Moderator keesiemeijer

    (@keesiemeijer)

    can we see the wp_register_script code.
    wp_register_script( 'somescript', get_bloginfo( 'template_directory' ). '/js/somescript.js');

    do you have <?php wp_head(); ?> in your theme’s header.php?

    Here’s what I have in the header:

    [Code moderated as per the Forum Rules. Please use the pastebin]

    After I cut and paste into functions.php file the snippet of code that you suggested, I edit the directory paths in it to point to /supersized/js/homescript,js and to /supersized/js/defaultscript.js correspondingly.

    I then remove this code from the header:

    <!--ADD SUPERSIZED jQUERY SCRIPT-->
    
    <script type="text/javascript">  
    
    			jQuery(document).ready(function($) {
    
    				$.supersized({
    					//Background image
    					slides	:  [ { image : '/supersized/backgrounds/bg.jpg' } ]
    				});
    			});
    
    		</script>

    — save everything, and reload the page. And voila! – the background image is gone.

    Help please?

    Moderator keesiemeijer

    (@keesiemeijer)

    So the script is here:
    /wp-content/themes/yourtheme/supersized/js/homescript.js

    you don’t have to remove the code from the header. because you use jquery you should register like so:

    wp_register_script( 'homescript', get_bloginfo( 'template_directory' ). '/supersized/js/somescript.js',array('jquery'));
    wp_enqueue_script( 'homescript' );

    The if WordPress can find the scripts wp_head() will show the links to the scripts in the header.

    Do I understand it correctly that I should place the main code in the functions.php file, and then also place this code in the header:

    wp_register_script( 'homescript', get_bloginfo( 'template_directory' ). '/js/somescript.js',array('jquery'));
    wp_enqueue_script( 'homescript' );

    Moderator keesiemeijer

    (@keesiemeijer)

    Register and enqueue is done in your theme’s functions.php
    this will put the links to jquery and your javascript files in the <head>. If you want to place javascript in the head that is dependent on jquery or your javascript file you put this after the wp_head().

    if you place this in your browser (replace yoursite and yourtheme):
    http://yoursite.com/wp-content/themes/yourtheme/js/somescript.js

    Do you you see the javascript file ?

    OK, so I do NOT need to put that code in the header, because putting it in the functions.php puts in in the header, correct?

    I do not see this code:

    http://mysite.com/wp-content/themes/mytheme/js/somescript.js

    but I do see this one when I check it:

    http://mysite.com/wp-content/themes/mytheme/supersized/js/homescript.js

    Am I supposed to see the first one, too?

    Moderator keesiemeijer

    (@keesiemeijer)

    then this should work (in functions.php):

    wp_register_script( 'homescript', get_bloginfo('template_directory') .  '/supersized/js/homescript.js',array('jquery'));
    wp_enqueue_script( 'homescript' );

    But alas, it does not.

    Is there any way to add conditionals to the header directly, under

    <?php
    	wp_head();
    ?>

    ?

    I’m beginning to suspect that for some reason supersized script only works when added under wp_head directly to the header. If I absolutely had to add conditional statements in the header below wp-head(), how would I do that?

    esmi

    (@esmi)

    Forum Moderator

    The conditionals should be in your function – not in your theme’s header.php template file.

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Conditional Tags: How to Run a Different JS Script for Different Pages’ is closed to new replies.