How to make Infinite Scroll work with my theme (shaken grid)? WordPress
- SOLVED
http://support.shakenandstirredweb.com/shaken-grid/faq/
I tried following the manual plugin install instructions there with no luck.
Currently, my site loads all the posts at once, and as more are added my page load time is getting more and more awful. I want to load 20 at a time and auto load more when the user scrolls down with the infinite scroll jquery plugin.
When I've made the modifications and have the plugin enabled and scroll down, nothing happens. Nothing pops up or loads and I haven't been able to get it to do anything really.
Answers (4)
Christianto answers:
Hi,
your problem similar with other question [[LINK href="http://wpquestions.com/question/showLoggedIn/id/2835"]]here[[/LINK]].
On that question, I put what inside infinite_scroll_callback() directly without wrap it on setTimeout function:
$('#wrap').infinitescroll({
debug : false,
loading : {
img : "http://dowant.net/wp-content/plugins/infinite-scroll/ajax-loader.gif",
msgText : "<em>Loading the next set of posts...</em>",
finishedMsg : "<em>Congratulations, you've reached the end of the internet.</em>"
},
state : {
currPage : "1"
},
nextSelector : "div.nav-previous a",
navSelector : "div.navigation",
contentSelector : "#wrap",
itemSelector : "#wrap div.box",
pathParse : ["http://dowant.net/page/", "/"]
}, <strong>function() { window.setTimeout(infinite_scroll_callback(), 1);</strong> } );
to
$('#wrap').infinitescroll({
debug : false,
loading : {
img : "http://dowant.net/wp-content/plugins/infinite-scroll/ajax-loader.gif",
msgText : "<em>Loading the next set of posts...</em>",
finishedMsg : "<em>Congratulations, you've reached the end of the internet.</em>"
},
state : {
currPage : "1"
},
nextSelector : "div.nav-previous a",
navSelector : "div.navigation",
contentSelector : "#wrap",
itemSelector : "#wrap div.box",
pathParse : ["http://dowant.net/page/", "/"]
},<strong> function() { jQuery('.sort').isotope( 'appended', jQuery( arguments[0] ));</strong> } );
The file to edit is wp_infinite_scroll.php
thebeefytaco comments:
Still nothing.
FYI, his problem seemed to be that it wasn't loading properly. Nothing happens for me at all.
Christianto comments:
Ok, now the selector is not correct..
on your site there is no div class="sort"
<strong>$('.sort')</strong>.infinitescroll({
debug : false,
loading : {
img : "http://dowant.net/wp-content/plugins/infinite-scroll/ajax-loader.gif",
msgText : "<em>Loading the next set of posts...</em>",
finishedMsg : "<em>Congratulations, you've reached the end of the internet.</em>"
},
state : {
currPage : "1"
},
nextSelector : ".nav-previous a",
navSelector : ".navigation",
contentSelector : ".sort",
itemSelector : ".all",
pathParse : ["http://dowant.net/page/", "/"]
}, function() { <strong>jQuery('.sort')</strong>.isotope( 'appended', jQuery( arguments[0] )); } );
});
Only element div id="sort" that exist.
on working site like http://challenge.ronenbekerman.com/citylife/
there is div class="sort"
you can change div id="sort" to class="sort", maybe it's located on index.php / home.php.
Other issue, you still have to add jquery isotope plugin to plugin.js
themes/shaken-grid-free/js/plugins.js
I attach isotope plugin to be add.