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.

It seems that my contact form's ajax javascript and the custom.js that I'm using for my drop-down navigation are interfering with each other. The contact form's ajax fuction will only work properly if I won't call the "custom.js" in the header. Furthermore I've had troubles using some jquery sliders, too, because something seemed to be interfering and I think that custom.js might be the cause. I just copied it from another theme and tried to implement it into my theme, but apparently that wasn't such a good idea. This has been a problem for months now. If only I knew how to fix that conflict, I have to admit that I know nothing about javascript!

Here's my website and here's my current header.php: http://pastebin.com/XhwqAGBt This is the custom.js: http://pastebin.com/A9ZRySra

I need to get this sorted out no matter what, but I really can't do it on my own as my knowledge about javascript is non-existent, so please help me out a little! I'll try hard to figure things out on my own, but I need a little help here, please!

EDIT4: I deleted my previous edits as it's getting too much to read and it wasn't that relevant anymore. I've been working on this almost the whole night and I just don't get it. Somebody who knows a bit about javascript, PLEASE help me out a little here.

I'm trying to get rid of all the javascript calls in my header.php and put them into my function.php instead as I heard that's better to do?! So, what looked like this in my header.php:

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.form.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/cufon-yui.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/Century_Gothic_400-Century_Gothic_700.font.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/javascript/custom.js"></script>

I'm trying to put into my function.php which looks like this right now:

function my_scripts_method() {
 // Load jQuery
if ( !is_admin() ) {
   wp_deregister_script('jquery');
   wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"), false);
   wp_enqueue_script('jquery');
}
 wp_register_script('custom', get_template_directory_uri() . '/js/custom.js', array('jquery'));
 wp_register_script('cufon-yui', get_template_directory_uri() . '/js/cufon-yui.js', array('jquery'));
 wp_register_script('century_font', get_template_directory_uri() . '/js/Century_Gothic_400-Century_Gothic_700.font.js', array('jquery', 'cufon-yui'));

wp_enqueue_script('custom');
wp_enqueue_script('jquery.form');
wp_enqueue_script('cufon-yui');
wp_enqueue_script('century-font');

}
add_action('wp_enqueue_scripts', 'my_scripts_method');

Apart from the custom.js nothing else is working!! The cufon-yui etc.! Am I calling them incorrectly? I'm also not sure about the "jquery.form.js". Do I have to register it first? Should I call the WP "jquery-form" instead?!

EDIT: Additional information: When I leave the custom.js in the function.php and put the other scripts back into the header, both: the navigation dropdown menu (custom.js) and the contact form (jquery.form + jquery 1.4.2) work perfectly fine. I tried to put the javascript in the contact.php to "no.conflict" mode, but then the contact form stopped working properly again. I really don't get it!!

Thanks a lot in advance!

share|improve this question
1  
you have two versions of jQuery loading, and your lightbox js is using $ instead of jQuery. search this site for how to properly enqueue javascript in your theme. –  Milo Sep 8 '11 at 8:58
    
I read about it and I think I kind of got it but there's still a problem (see my edit). –  japanworm Sep 8 '11 at 12:24
    
I did everything I could. I tried various code snippets, always the same outcome. I don't know what's still going wrong. I also checked the .js files and they both call jquery in no-conflict mode. –  japanworm Sep 8 '11 at 14:32
    
Please do not put things like "unresolved" in title, it is messy and not in line with site's mechanics. –  Rarst Sep 9 '11 at 9:09
    
I see, didn't know that. Thanks for pointing it out. –  japanworm Sep 9 '11 at 9:11
add comment

2 Answers

up vote 1 down vote accepted

By default, the jQuery script is loaded in no conflict mode. I noticed that you have in you header.php the following code:

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

Adding jQuery like this, will override (if the page works) the wp_enqueue_script('jquery').

If you load jQuery like this, you need to activate the noConflict mode, as explained here.

My suggestion is to load your scripts one way, or via wp_enqueue_script or by including in the html header tag. Using both is tricky.

Hope it helps.

Domingos

share|improve this answer
    
Hello. Like I said when I take out the "jquery-1.4.2.js" of the header, then the contact form stops working for some strange reason. I don't get it. –  japanworm Sep 8 '11 at 15:29
    
I'm trying to get rid of all the javascript in my header.php at least the ones that call scripts and try to put them in my function.php instead - just like you suggested. However, it seems I'm not implementing the cufon-yui.js correctlz. This is not based on jquery, right? So, I tried the following: wp_enqueue_script('cufon-yui'); –  japanworm Sep 9 '11 at 1:20
    
The following doesn't work either. I really don't get what I'm doing wrong. Somebody who knows a bit more willing to help? wp_register_script('custom', get_template_directory_uri() . '/javascript/custom.js', array('jquery')); wp_register_script('cufon-yui', get_template_directory_uri() . '/js/cufon-yui.js', array('jquery')); wp_register_script('century_font', get_template_directory_uri() . '/js/Century_Gothic_400-Century_Gothic_700.font.js', array('jquery', 'cufon-yui')); wp_enqueue_script('custom'); wp_enqueue_script('cufon-yui'); wp_enqueue_script('century-font'); –  japanworm Sep 9 '11 at 1:40
    
Hi, I don't know the cufon-yui but I look it on google and I found that cufon isn't playing nicely with jQuery. You could look into it in themocracy.com/2010/01/jquery-cufon-and-wordpress and in forum.jquery.com/topic/…. I really hope that helps. –  Domingos Freitas Sep 13 '11 at 11:29
add comment

This should work fine. You may have some basic syntax issues ( - vs _ vs .), ensuring the correct path/location of the javascript files (have put all the scripts under the 'template_folder/javascript/' and remove all the calls from header.php

Try this.

function my_scripts_method() {
    // Load jQuery
    if ( !is_admin() ) {
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js', false);
        wp_enqueue_script('jquery');
    }
    wp_register_script('custom', get_template_directory_uri() . '/javascript/custom.js', array('jquery')); wp_register_script('cufon-yui', get_template_directory_uri() . '/javascript/cufon-yui.js', array('jquery')); wp_register_script('century-font', get_template_directory_uri() . '/javascript/Century_Gothic_400-Century_Gothic_700.font.js', array('jquery', 'cufon-yui'));
    wp_enqueue_script('custom');
    wp_enqueue_script('jquery-form');
    wp_enqueue_script('cufon-yui');
    wp_enqueue_script('century-font');
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
share|improve this answer
    
Hello. I had my js files in two different folders earlier. One was called "js", the other one "javascript", thus the confusion. I put them all into the "js" folder now and also modified the code accordingly. It didn't change a thing. –  japanworm Sep 9 '11 at 8:32
add comment

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.