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've been working on updating a site which was running on an old version of WordPress, I've had to update the theme, most of the plugins and finally got the WordPress up to date. I've had to do a few customisations including using plugins to replace old theme functions that the site used which are not present/working in the updated theme. The theme is now not supported by the developer.

The only thing stopping the site going live is that a scroll up button doesn't work properly on the Home page. The scroll up button appears after a user scrolls down a page and when clicked on smooth scrolls to the top of the page and disappears. This is acheived using a bit of jQuery that has been added to the theme's custom.js file.

The custom.js file starts with the line:

jQuery(document).ready(function($) {

The button script works fine on all the other pages but not on the front page where it seems the jQuery script has not been loaded. Here's the bit of jQuery:

    /* --------------------------------------------------------------------------- */
/*  13. Back to Top
/* --------------------------------------------------------------------------- */

$("#back-top").hide();

$(window).scroll(function () {
    if ($(this).scrollTop() > 100) {
        $('#back-top').fadeIn();
    } else {
        $('#back-top').fadeOut();
    }
});

$('#back-top a').click(function () {
    $('body,html').animate({
        scrollTop: 0
    }, 600);
    return false;
});

});

I'm at the point where I'm just going to wpenqueue the required script to make it work anyway but I'd rather fix the problem which may be obvious to some but now has me going in circles.

The site can be seen at http://just7.co.uk/latinlink/

UPDATE 28/10/2013:

I've copied the jQuery code and put it into its own script and enqueued the script via functions.php. I can see the script (backtotop.js) loading but it still isn't working on the home page but works on all others.

Here's the script:

jQuery(document).ready(function() {
    jQuery("#back-top").hide();

    jQuery(window).scroll(function () {
        if (jQuery(this).scrollTop() > 100) {
            jQuery('#back-top').fadeIn();
        } else {
            jQuery('#back-top').fadeOut();
        }
    });

    jQuery('#back-top a').click(function () {
        jQuery('body,html').animate({
            scrollTop: 0
        }, 600);
        return false;
    });

});

The site is at http://www.just7.co.uk/latinlink

share|improve this question
    
Please search the site for "noconflict" –  Chip Bennett Oct 14 '13 at 11:44
    
The code above is part of a longer file which starts with the line: As it works on the other pages of the site I don't think it is the "noconflict" issue. –  paultp Oct 15 '13 at 10:53
    
.. starts with the line: jQuery(document).ready(function($) { I've edited the original question now as well to make this obvious –  paultp Oct 15 '13 at 11:00
    
"I'm at the point where I'm just going to wpenqueue the required script to make it work anyway ..." - if not enqueued, how are scripts being added? That may be part of the problem. –  Chip Bennett Oct 15 '13 at 12:13
    
Don't know I'm afraid, I haven't got access to the theme support forum and the theme developer has stopped supporting it anyway. I'm going to have to have a rummage about I think and see if I can find where the jQuery etc is loaded. I think I could just add the enqueue to the functions.php (either for the full custom.js or drop the code into a separate script) but I just think that would be a bodge. –  paultp Oct 15 '13 at 17:48

2 Answers 2

Wordpress uses jQuery noConflict wrappers so the dollar sign will not work unless it is used as an alias. Either wrap your code in:

 jQuery(document).ready(function($) {
// Inside of this function, $() will work as an alias for jQuery()
// and other libraries also using $ will not be accessible under this shortcut
});

Or just change all the dollar signs to "jQuery". Also you should alway enqueue your scripts even if they are tiny.

More about it here: http://codex.wordpress.org/Function_Reference/wp_enqueue_script

share|improve this answer
    
See comment above. Also, the theme itself is loading the scripts including the custom.js file but I don't know how it is doing it. I know how to enqueue scripts so I can get round the problem (as I said) but I'd rather fix it. –  paultp Oct 15 '13 at 10:56
    
You could probably put your script in the custom.js file then. You have to enqueue them one way or another or it won't (or shouldn't) work. –  mantis Oct 15 '13 at 13:04
    
As I said: the code is already part of the custom.js. The theme is loading the scripts but I haven't worked out how yet. The problem is it doesn't seem to load on the home page. –  paultp Oct 15 '13 at 17:44
    
So it loads on the other frontend pages of the site but not on the homepage? I suggest looking to see how the script in enqueued to see if there are any conditionals in it that exclude the homepage. It may be better in that case to take it out of custom.js and put it say in my-custom.js and enqueue that seperately. –  mantis Oct 15 '13 at 18:09
1  
Good luck then :) –  mantis Oct 15 '13 at 19:02
up vote 0 down vote accepted

This turned out to be a javascript security error on the home page only that was preventing any other scripts running. The error was coming from one of the theme's minified js files so couldn't be fixed and the theme is no longer supported.

Time for the site owner to get a new theme :-)

share|improve this answer

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.