WordPress.org

Support

Support » How-To and Troubleshooting » adding Javascript to a single page

adding Javascript to a single page

  • jnascarb

    @jnascarb

    Hi

    I’m a webdev, but not a WordPress user & I’m completely confused by http://codex.wordpress.org/Using_Javascript .. it assumes too much that I don’t know.

    I’m working on an existing WordPress blog and there’s a page that contains a Javascript calculator that doesn’t work now we’ve moved to WP. The Javascript is on the page, and not required elsewhere.

    Here’s how much I don’t know .. I’ve edited the page and put in an wp_enqueue_script() call, and also one in <php ?> and both were published to the page.

    Would anyone care to walk me through it or give me a hint? Tbh, wp_enqueue_script() seems overkill, it’s just one-off script on the one page.

Viewing 15 replies - 1 through 15 (of 24 total)
  • hi,

    you said that you Js is “on the page”, do you mean the js code or the include to a .js file ?
    is it called/included into the header ? or in the page template (and is it a spécific page template) ?

    i’m agree with the fact that wp_enqueue_script() seems overkill, you could also use you js the old way, if it depends from others scripts (like jquery ?) you should add it after your wp_head() call (in case the others dependencies would be loaded with the wp_enqueue_script() method).

    if youre adding it from the header.php, you could do this to use it for this specific page you want, where “the_page_slug” is your page slug id from the admin, and js/ is your js/ folder in your template :

    <?php if( $post->post_name == “the_page_slug” ) { ?>

    <script type=”text/javascript” src=”<?php echo get_template_directory_uri(); ?>/js/”></script>
    or
    <script> … the js code … </script>

    <?php } ?>

    hope this could help..

    jnascarb

    @jnascarb

    Thanks reghyz,

    The js code is on the page, it’s basically where the text content goes, so no, not in the header, nor in the template.

    It doesn’t depend on anything else, it’s not JQuery or anything.

    I’ll try the header php and I’ll let you know how far I get 🙂

    All the best
    J

    you could write your own javascript shortcode.

    Here is one basic example you can add to your functions.php file in the current theme directory:

    //[myjavascript]
    function myjavascript_func( $atts ){
     return "<script>alert('hello world');</script>";
    }
    add_shortcode( 'myjavascript', 'myjavascript_func' );

    add the shortcode [myjavascript] into your post/page editor content box, and you should get “hello world” only on that post/page.

    More about shortcodes here:
    http://codex.wordpress.org/Shortcode_API

    Hope this helps.

    another version:

    if you want the javascript in the head tags for only one post (id=123), you could add this into your functions.php :

    function myjavascript_in_wp_head($pid){
       if (is_single()) {
           global $post;
           if($post->ID=="123"){ // only for post Id = 123
                echo "<script>alert('hello world');</script>";
           }
       }
    }
    add_action( 'wp_head', 'myjavascript_in_wp_head' );

    (untested)

    ps: you can also check for $post->post_name or $post->post_title instead of $post->ID.

    jnascarb

    @jnascarb

    Seems I need FTP access for all this, and I haven’t got that. I’ll go seek it, but if there’s a way to do it without FTP access, do spill. (Thanks for your help so far)

    jnascarb

    @jnascarb

    In
    function myjavascript_in_wp_head($pid)
    why am I asking for $pid?

    sorry, it should not have been there 😉

    have you also tried to paste the javascript into the editor (html view) for this particular post/page?

    For example:

    <script>alert('hello world');</script>

    (I don’t recommend it, I would rather use the other methods)

    jnascarb

    @jnascarb

    Sorry birgire :-), I posted it into functions.php and the blog fell over, so I was just wondering why that was.

    Actually, you’re right, that Hello World works (dammit, embarassed 🙂 ) .. yeah, maybe I jumped too early to conclude that the code that was working in a different platform and now wasn’t in WP was because JS was blocked. It’s not. Thanks for your help, I’ll delve into that. No doubt I’ll be back with another question.

    ok good luck with your project

    cheers

    Ah, OK, not so fast.

    So Javascript runs if I say <script>alert(‘hello world’);</script> but the Javascript comprises functions called from form fields (onchange, etc). The functions don’t work.

    They are defined above the HTML.

    What’s wrong?

    Does WordPress somehow prevent functions but allow single Javascript lines? Makes no sense ..

    esmi

    @esmi

    Forum Moderator

    I have been looking for an answer to this for a long time and have reading and re-reading ‘Using_Java script’ and many other suggestions but no matter what I do I still can’t make it work.

    As jnascarb mentioned above… my javascript is not a simple ‘hello world’. The Hello World works fine.

    The javascript gets executed within a form that has onfocus, onkeyup, etc.. How do you make it work? I only need this javascript in one page and only one page. I even created a page template; I used the enqueue…and many other suggestions and none of them work. Obviously I’m doing something wrong… but what am I doing wrong?

    My page displays.. my form displays but yet the java script does not appear to be working. The whole purpose of the javascript is to inform the user of the number of allowed characters they have left (based on a hardcoded maximum character) as they type in the input form. Similar how twitter counts the characters entered for a tweet. The java script works when I use plain HTML but it does not work with WP.

    Perhaps jnascarb found the answer?

    Thanks in advance

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    If you require support on your issue, create your own thread.

Viewing 15 replies - 1 through 15 (of 24 total)
  • The topic ‘adding Javascript to a single page’ is closed to new replies.
Skip to toolbar