Need help getting Infinite Scroll to work on my site WordPress
Hey guys, another <em>Infinite Scroll</em> query.
LINK: http://www.basedonbirds.com/iath/
Have followed the plugin install documentation but cant manage to get anything happening on the homepage. I have a custom theme and also have masonry.min.js running.
Plugin Settings are as follows:
Infinite Scroll State is: ON
Debug mode is: ON
Content Selector: #content
Posts Selector: #content div.home_post
Navigation Selector: #nav-below
Next Page Selector: #nav-below .nav-previous a:first
Chur
Answers (5)
Fahad Murtaza answers:
easy
I did it on http://www.universalcoders.com/adip/
I will get the code from here and hep you out.
Giri answers:
Did you try this one?
Next Page Selector: #nav-below .nav-previous
I mean remove a:first
twigg massive comments:
unfortunately yes viruth, i tried this but no change.
Arnav Joy answers:
try this
Content Selector: div#content
Posts Selector: #content div.home_post
or
Content Selector: #content
Posts Selector: #content .home_post
twigg massive comments:
thanks Mr Joy, but this didnt have an effect either.
Christianto answers:
Hi,
Could be the same problem that I solved on previous questions
[[LINK href="http://wpquestions.com/question/showLoggedIn/id/3617"]]http://wpquestions.com/question/showLoggedIn/id/3617[[/LINK]]
[[LINK href="http://wpquestions.com/question/showLoggedIn/id/2835"]]http://wpquestions.com/question/showLoggedIn/id/2835[[/LINK]].
since you use masonry the solution can be different but still with same principle.
Could you post here what code you use to initialize infinitescroll plugin, or did you use wordpress plugin?
I couldn't found any code of infinitescroll plugin on your site, did you remove it?
twigg massive comments:
Hey Christianto, i had a look at both of those questions before i posted up, however i couldn't work out a solution for this issue.
I am using the infinite scroll wordpress plugin, and the Infinite Scroll State has been set to ON. Strange that you couldn't see any code from the plugin?
Mike Gertrudes answers:
Hey man, after comparing a working version of this I have on my portfolio site with yours (and knowing I ran into some problems with mine originally), may I suggest that you add an "olderpostslink" class to your "Older Posts" anchor and change your Infinite Scroll plugin settings to the following:
Navigation Selector: div.navigation_home
Next Page Selector: div.navigation_home a.olderpostslink
A similar setup worked for me. Good luck.
twigg massive comments:
Hey Mike, thanks for the suggestion.
As my code skills are pretty meger i'm just a bit unsure as to how to implement this. Here is html and php which then generates the dynamic code for the homepage naivgation:
<div id="nav-below" class="navigation_home">
<div class="nav-previous"><?php next_posts_link( __( '<div class="meta-nav-previous">« Older posts</div>', 'twentyten' ) ); ?></div>
<div class="nav-next"><?php previous_posts_link( __( '<div class="meta-nav-next">Newer posts »</div>', 'twentyten' ) ); ?></div>
</div>
any help would be appreciated, cheers
Mike Gertrudes comments:
Twigg, look through the template of your front page (maybe it's page.php or maybe it's index.php or home.php) and find where you have that navigation code you pasted and replace it with this:
<div id="nav-below" class="navigation_home">
<div class="nav-previous"><?php previous_posts_link('Newer »') ?></div>
<div class="nav-next"><?php next_posts_link('« Older') ?></div>
</div>
Then on your Infinite Scroll plugin settings change those two settings to this:
Navigation Selector: div.navigation_home
Next Page Selector: div.navigation_home a.olderpostslink
There may be a better way to do this with your TwentyTen theme, but this way is using the default Wordpress pagination functions but that code I just gave you should automatically create the "olderpostslink" class on your anchor (essentially on your "Older Posts" link. Hopefully your theme (TwentyTen) doesn't add anything you don't want in there (or override it). Let me know if it works.
twigg massive comments:
Mike i have replaced the nav code with what you posted, please take a look when you get a chance, however unfortunately it looks like it hasn't added an 'olderpostslink' class to the anchor for some reason, so the infinite scroll plugin is still not happening?