Grow your CSS skills. Land your dream job.

Can’t seem to get any jscript to work in WP

  • # July 4, 2009 at 3:41 pm

    Ok, so I had a previous post that was just a false alarm. The real issue I think it’s boiled down to is that I can’t seem to get WP to execute any jquery or javascript from the header.php to any of my custom pages.

    I have an index page setup as a custom page (http://www.citrusbunny.com) it’s the main one you are looking at.

    Granted I’m fairly new to jquery, but I’ve successfully got it to work in a normal html page. This is the same issue I was having with the simplemodal contact form – the action doesn’t do anything on the page itself.

    I used Chris’ "proper way" to include jscript into a WP template through the header.php, but that doesn’t seem to have helped.

    Just an FYI – when I load any plugins that include jquery or anything else, it works just fine. I’d really like the ability to do some custom stuff, too though.

    So what I have right now is:

    header.php

    Code:

    … blah blah blah …

    < ?php wp_head(); ?>

    in the stylesheet I have #contactslide defined as a 250px x 350px box with a black background just for testing. It’s supposed to slide up or down when you click the link "Contact Slide".

    On the custom index page, I have:

    Code:
    < ?php

    /*

    Template Name: index

    */

    ?>

    < ?php get_header(); ?>

    < ?php get_sidebar(); ?>

    < ?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    Read the rest of this page »‘); ?>

    < ?php wp_link_pages(array('before' => ‘

    Pages: ‘, ‘after’ => ‘

    ‘, ‘next_or_number’ => ‘number’)); ?>

    < ?php endwhile; endif; ?>

    < ?php edit_post_link('Edit this entry.', '

    ‘, ‘‘); ?>

    < ?php get_footer(); ?>

    So, I’m not sure what’s causing it to not function. My goal is that if I can figure out why this isn’t working, it will solve why I can’t get any jquery or foreign to WP scripts to work.

    Does anyone have an immediate idea what I’m doing wrong?

    # July 4, 2009 at 4:37 pm

    Try changing $ to jQuery in your slide function.

    # July 4, 2009 at 7:00 pm

    No dice – still doesn’t do anything when you click it.

    # July 5, 2009 at 2:27 am

    So your script says

    Code:
    jQuery(“#contactslide”).slideDown();

    but nowhere in your markup is there an element with the id of contactslide.

    # July 5, 2009 at 1:19 pm

    You can’t "wp_enqueue_script" from a theme’s template. wp_enqueue_script is more for plugins really, but if you really want to use it you must call it from functions.php before the header has been output.

    # July 6, 2009 at 1:24 am
    "apostrophe" wrote:
    So your script says

    Code:
    jQuery(“#contactslide”).slideDown();

    but nowhere in your markup is there an element with the id of contactslide.

    It’s the in stylesheet.css file. I figured it would be easier than posting the entire thing :P

    So… dave, should I be using the same script to bring in the elements from the functions.php? Or is it better to do it in the header but in a different way?

    # July 6, 2009 at 5:54 am
    Quote:
    It’s the in stylesheet.css file. I figured it would be easier than posting the entire thing :P

    What? :?
    I’m looking at the page in the link you provided and nowhere on that page is there an element with the id of contactslide.

    Oh, and the page is loading jQuery fine.

    # July 6, 2009 at 10:59 am

    Firstly, to clarify what I said before you can use wp_enqueue_script but only if it appears before wp_head in the header. Sorry, I thought you were calling it from further down in the template, which was my mistake.

    Secondly, Apostrophe is completely right you have no element with an id of contactslide, so this code will do nothing. You should create a contactslide div somewhere on the page for this to have any effect.

    Code:

    contact slide contents

    # July 6, 2009 at 6:00 pm

    Well, now I feel like an idiot lol :)

    Thanks for the replies, I really do appreciate it.

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".