WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] [Plugin: Infinite Scroll] not working? (24 posts)

  1. sarasavage
    Member
    Posted 2 years ago #

    Hi there,

    I'm using the Infinite Scroll plug-in (http://wordpress.org/extend/plugins/infinite-scroll/) for my website http://nopantsnopants.com

    But it doesn't seem to be working. Can anyone help me?

    The theme I'm using is Paragrams from WP Shower, and the selectors I have currently are:

    Content CSS Selector: #content
    Post CSS Selector: #content div.post
    Navigation Links CSS Selector: div.navigation
    Previous posts CSS Selector: div.navigation a:contains(Previous)

    I currently have the plugin only viewable for admin as it hasn't been working, I also made all posts viewable on the front page (we're a new site) for the mean time. Any tips?

  2. alturnwall
    Member
    Posted 2 years ago #

    Hi sarasavage,

    You can't make all the posts viewable for use with this plugin. You have to limit the number of posts shown from the Settings > Reading page so that you actually have paged archives. The navigation links CSS selector has to be generated in order for the plugin to work.

    Try only making three or four posts show in the "blog pages show at most" on the Settings > Reading page and see what happens.

    Also, your CSS might be wrong:
    div.navigation a:contains(Previous)

    On your site, it looks like it starts with "div.nav", but I'd need to see the page with fewer posts being displayed to actually see the CSS for the links...

    Good luck.

  3. sarasavage
    Member
    Posted 2 years ago #

    Hi alturnwall, thanks for the quick reply. I've changed the settings so that 9 posts show (3 rows of posts) on the front page. It still doesn't work - but perhaps it's easier for you to see now what I need to do? Any more advice?

    Thanks in advance

    Sara

  4. alturnwall
    Member
    Posted 2 years ago #

    Try making these the values for the selectors:

    Content CSS Selector: .li_container
    Post CSS Selector: .article
    Navigation Links CSS Selector: #nav
    Previous posts CSS Selector: #nav #navleft a

    (note the "." period which precedes the names for the classes)

  5. sarasavage
    Member
    Posted 2 years ago #

    I made those the values and it still doesn't work! :(

    Any other ideas?

  6. alturnwall
    Member
    Posted 2 years ago #

    Maybe try

    Post CSS Selector: li.article div

    Also, did you change the "Infinite Scroll State" to "ON" and "scrolling behavior" to "automatic"?

  7. sarasavage
    Member
    Posted 2 years ago #

    Hmmm yep, those settings are as you mentioned!

    I just changed the Post CSS Selector as per your suggestion and still nothing :(

  8. sarasavage
    Member
    Posted 2 years ago #

    Any other ideas...?

  9. Ptremblay
    Member
    Posted 2 years ago #

    Did you ever get it to work? I'm having the same issue right now

  10. alturnwall
    Member
    Posted 2 years ago #

    Hmm. I can't really think of anything else to diagnose unless I were to really dig into your specific code.

    But, have a look here.

    Although that's the non-WordPress plugin version, it might shed some light on the settings you may need to change to get it working. I suspect it might be an issue with the Panagrams theme here. You may look into changing the "bufferPx" setting in the .js file to be a larger number, since that will fire the script sooner on the page.

    Good luck :)

  11. beaver6813
    Member
    Posted 2 years ago #

    @sarasavage Could you turn on Debug mode please? (That way it prints in console what the problem is ;) ) Its loading on the page which is a good start (normally the harder issue to fix).

    Content CSS Selector: .li_container
    Post CSS Selector: .mcol
    Navigation Links CSS Selector: #nav
    Previous posts CSS Selector: #nav #navleft a:first

    Almost the same as what @alturnwall made it but I've chosen to select the three columns you're using as posts instead, hopefully they'll stack nicely when it loads them..
    Though it should have worked with the previously suggested selectors anyways... I think we need Debug set to On to help further :)

  12. Ptremblay
    Member
    Posted 2 years ago #

    If I may chime in :)

    I'm using the same theme as sarasavage, I made the corrections you suggested beaver and alas it's still not working.

    I've turned on my debug mode, but the java console is not logging anything (?).

    Oh yeah my site is depensesfolles(.)com (it's in French)

  13. beaver6813
    Member
    Posted 2 years ago #

    @Ptremblay Hmm, very weird, I don't see any initialization messages. Could you email me a list/screenshot of the WP plugins you're running please? I'll try install the theme/same setup on the weekend to try and fix.

    http://beaver6813.com/contactsi_contact_form/

  14. Ptremblay
    Member
    Posted 2 years ago #

    That's very nice of you! Just sent you a screenshot

  15. sarasavage
    Member
    Posted 2 years ago #

    hi beaver6813, thanks for the reply! i have turned debug mode ON like you said, and changed the selectors to what you suggested but to no avail - it's still not working :(

    i have also sent you a screenshot of the plugins i'm using via your contact form.

  16. beaver6813
    Member
    Posted 2 years ago #

    You guys sure know how to pick the hard themes! The "columnizer" javascript the site uses makes it really difficult to implement infinite-scroll but it can be done:

    1. First, set the following selectors:
      • Content Selector: #outer > .li_container:first
      • Posts Selector: .li_container > .mcol, #outer > ul.mcol
      • Navigation Selector: #nav
      • Next Page Selector: #nav #navleft a:first
    2. Next add the following to the "Javascript to be called after posts load" box
      jQuery(newElements).makeacolumnlists({cols: 3, colWidth: 0, equalHeight: 'ul', startN: 1});
    3. Finally, because columinzer is determined to muck up the markup, we have to delay initiating infinite-scroll slightly (100ms). I don't want to introduce the delay into the main plugin (really its the themes problem) but you can use this patched file:
      http://beaver6813.com/dev/inf-custombrew/infinitescroll.init.js.php.zip
      Just download, remove the .zip extension and upload to wp-content/plugins/infinite-scroll (overwrite the existing file).
    4. Hopefully it should start working!

    I tested on my mockup at http://beaver6813.com/infwp/

    Let me know how it goes.
    -Sam

  17. Ptremblay
    Member
    Posted 2 years ago #

    Sam you are a genius!

    I can't thank you enough for your dedication and hard work, it is truly appreciated!!! :)

  18. sarasavage
    Member
    Posted 2 years ago #

    It worked for me too! Thank you so much Sam!

    Kindness of strangers = amazing

    Thanks again.

  19. themoju
    Member
    Posted 2 years ago #

    Hello, I am having the same issue. I have tried all of the configurations you ahve provided in this post but I cannot get it to work.

    Here is my set-up:

    Theme: monochrome 2.0

    Selectors:

    Content Selector: #content #colLeft
    Posts Selector: #content #colLeft .postBox
    Navigation Selector: .emm-paginate
    Next Page Selector: .emm-paginate a:first

    Those are my current settings, however I did try all of the selectors you proposed and none worked.

    Hopefully you can find a solution to this!

  20. spaceuniverse
    Member
    Posted 2 years ago #

    Hi beaver6813,

    I'm using Paragrams theme with Infinite Scroll plug-in too ( http://thematter.org ), I did follow your latest advise but It still don't work for me. It do loading but seem couldn't find page 2 ( http://thematter.org/page/2/ ). Please help me.

  21. kimberwyn
    Member
    Posted 1 year ago #

    This doesn't work.

  22. oneandtheother
    Member
    Posted 1 year ago #

    Hi there, I'm using the rustik theme and can't get infinite scrolling to work. Does it work with my theme?

  23. thedisabledcubicle
    Member
    Posted 1 year ago #

    Following Beaver's post 8 months ago, does anyone have an updated guide for Infinite Scroll's use in the WPShower Paragrams theme?

    I had it working using his selectors and an adapted file, but following their update I just can't get it to work again.

    ■Content Selector: #outer > .li_container:first
    ■Posts Selector: .li_container > .mcol, #outer > ul.mcol
    ■Navigation Selector: #nav
    ■Next Page Selector: #nav #navleft a:first

    I'd really appreciate some assistance because I love the plugin and my site feels broken without it.

  24. markwells
    Member
    Posted 1 year ago #

    Hi,

    The easiest (cheating) way around this is to download the previous version of the plugin that this topic is referring to (ver 2.0). This worked for me using the paragrams template - just don't update the plugin.

    http://wordpress.org/extend/plugins/infinite-scroll/developers/

Topic Closed

This topic has been closed to new replies.

About this Topic