WordPress Jetpack Infinite Scroll

I just looked at my Console in Google Chrome and this is what I get:

Uncaught TypeError: Cannot read property 'top' of undefined                 infinity.js?ver=20130523:85
Uncaught TypeError: Cannot call method 'apply' of undefined                 jquery.masonry.min.js?ver=2.1.05:10

So, that means that there’s something wrong on Jetpack’s end and not mine? Because that would be Jetpack’s JavaScript files. Hrm.

I see the error you mention. I wonder if it’s related to your theme? Can you try switching to the TwentyTwelve or TwentyThirteen theme temporarily to see if the errors are still there?

Everything works when I switch it over to TwentyThirteen. So, that means it’s my theme. Hmm. I’m using Starkers. Any suggestions on how to fix this? I like Starkers because it has everything stripped out and you can start from scratch, but I’ve had to add a lot of things into my functions.php file to get some functionality.

It’s really tough for me to say. I can’t actually code it for you, but if I had a look at your functions.php I may be able to spot the issue. Maybe you could post it to pastebin.com or another such service, and I can take a look?

Here ya go.

So I don’t see anything outright wrong, but I did notice that your theme uses Masonry (which I should have clued in on when I saw your site). Maybe this will help you:

https://wptheming.com/2013/04/jetpack-infinite-scroll-masonry/

Try that and let me know how it goes!

I tried using the code on the page you suggested, but something is wrong with my PHP. I’m good with CSS and HTML, but I don’t have much understanding for PHP. When I throw this…

jQuery( document ).ready( function( $ ) {
	setInterval( function() {
     	$( '#content' ).masonry( 'reload' );
     }, 300 );
});

…into my functions.php file, I get this: Parse error: syntax error, unexpected ‘$’, expecting ‘&’ or T_VARIABLE in /home/content/38/10423038/html/wp-content/themes/starkers/functions.php on line 143. What am I missing?

I’m sorry for being such an idiot right now. Been up for quite some time. I just placed the jQuery code in its proper place, the html-header.php rather than functions.php. Nothing seems to be affected though.

well, the jQuery is javascript. You should probably place it in the footer.php and make sure to surround it with <script> tags

Okay, moved my JavaScript and jQuery to html-footer.php and I made sure each one is wrapped by <script> tags. It’s still not working though. U_U

Here is my html-header.php and here is my html-footer.php. Anything amiss?

Ok, a few things:

1) you are calling jQuery twice, on lines 17 and 20 of the html-header.php file. Remove line 20.
2) you should place your scripts before the </body> tag, not after (the scripts should still run fine, but this is better)

You also seem to have mixed a few different methods there on your html-footer.php; you should try only the “Final Method” mentioned in the tutorial I pointed you to.