Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have been trying and trying to fix jquery issues. i have in my header lots of jquery. I use it for slider and other things that are built into this premade theme. I am unable to add anything that uses jquery because of conflict. i need some help. The board is www.cgwhat.com. The forgot password is jquery and the slider is controlled by jquery also. I wanted to add another plugin but can not because of the conflict. Also with the forgot password that is jquery. I need to know what is wrong and how to fix it . If i remove calls to javascript in header it is fixed. The forgot password works but everything else breaks.

<?php wp_enqueue_script("jquery"); ?>
<?php wp_head(); ?>

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.equalHeight.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/flashobject.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.jcarousel.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.actions.js"></script>
<script type="text/javascript">
 jQuery(document).ready(function($){
var fC=$('#features-nav .features-nav-item').length;
curS=1;
var cInt=0;
    cInt=setInterval(function(){
        $('#features-nav .features-nav-item:eq('+curS+')').addClass('current').trigger('click');
        curS++;
        if(curS>=fC) curS=0;
    },10000);});

</script> 



</head>
share|improve this question

2 Answers 2

up vote 3 down vote accepted

At least one issue I can see is that you're including the jQuery framework at least twice. The first line

<?php wp_enqueue_script("jquery"); ?>

Is the preferred method of including jQuery. Your installation of WordPress happens to include jQuery version 1.4.2. This allows good plugin and theme developers to leverage jQuery and not accidentally include it manually several times.

But you also have (on line 6)

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.js"></script>

Which includes jQuery 1.2.6. Maybe one of your plugins is trying to inject this? Or perhaps this is generated in your theme (in which case you can delete it, assuming your plugins are compatible with the built in version of jQuery which is version 1.4.2.

After you resolve that issue, any further javascript errors can be isolated to a specific script or plugin.

EDIT: Addition info...

Now that you've removed the extra jquery include, a different error has surfaced. Using Firebug or Chrome's debugger or your other favorite JavaScript debugger, you can see that the new error is:

$ is not a function (jquery.actions.js, line 18)

This means that you are attempting to use the jQuery shorthand selector but have wrapped your document ready using the full "jQuery" object name syntax.

In jquery.actions.js, replace each "$" reference with "jQuery".

This will get your slider working. But you'll also notice that you have other errors in your JavaScript...

pos is null (undo.js, line 367)

threads[x] is undefined (_display, line 915)

You may or may not care about those errors depending on how they affect your site. I tend to like to eliminate any and all errors for performance and stability. Some browsers will crash worse than others.

share|improve this answer
    
yes I remove that line and my forgot password works. I found that out earlier but then my slider stops working. I am trying to get both to work. Your thoughts ? –  mmoore5553 Aug 2 '11 at 19:24
    
Added some more info in the answer... –  Jared Cobb Aug 2 '11 at 19:48
    
yeah i am unsure how to find out that info with firebug as this is my first time with javascript. You might want to check now i was trying to solve some stuff and changed code that is maybe why you seen taht ... –  mmoore5553 Aug 2 '11 at 19:57
    
OMG it is working . Can you explain to me how you found that out with firebug and how you knew what path to go. I been working on this all day. Also how would i fix the others ..man i wish i could contract you out for this. I can code all day in WP and html and css but javascript i do not understand –  mmoore5553 Aug 2 '11 at 20:01
    
Also i wanted to try this other plugin which i know uses javascript and once i enable it. It breaks the slider ...forgot password and more. How would i troubleshoot this ? also do you know where i can find more info on how to solve stuff like this. Thanks so much –  mmoore5553 Aug 2 '11 at 20:08

Two things:

  1. The call to wp_head() must come immediately before the closing </head> tag.
  2. Instead of hard-coding your script links, you should be enqueueing all scripts, including any necessary dependencies.
  3. Instead of hard-coding your custom script, put it in a script file, e.g. custom.js, and enqueue it also
  4. Cascade your enqueued scripts as necessary, using the $deps argument, to ensure that all load in the correct order.

e.g. remove all your script calls from the document head, and then add the following in functions.php:

function mytheme_enqueue_scripts() {
    $scriptsrc = get_template_directory_uri() . '/js/';
    wp_enqueue_script( 'jquery' );
    wp_enqueue_script(
        'flashobject',
        $scriptsrc . 'flashobject.js'
    }
    wp_enqueue_script(
        'equalheight',
        $scriptsrc . 'jquery.equalHeight.js',
        array( 'jquery' )
    }
    wp_enqueue_script(
        'jquerycarousel',
        $scriptsrc . 'jquery.carousel.js',
        array( 'equalheight' )
    }
    wp_enqueue_script(
        'jqueryactions',
        $scriptsrc . 'jquery.actions.js',
        array( 'carousel' )
    }
    wp_enqueue_script(
        'custom',
        $scriptsrc . 'custom.js',
        array( 'actions' )
    }
}
add_action( 'wp_head', 'mytheme_enqueue_scripts' );

That should resolve any issues you're having with script/library conflicts.

Then, you'll need to ensure that you're using jquery no-conflict wrappers properly.

share|improve this answer
    
thank you. I am new to javascript and going to code it better than the theme i bought. Your script makes sense. Curious is there any place i can learn more on how to code correctly like that as this was a premade theme and i did changes to suit my needs. –  mmoore5553 Aug 2 '11 at 20:04

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.