Premium Theme Support › Array › Designer

Infinite scroll doesn't work

  • Author
    Posts
  • #73241
    zhengziying
    Member

    In Setting->Reading, the “To infinity and beyond” row shows “We’ve changed this option to a click-to-scroll version for you since you have footer widgets in Appearance → Widgets, or your theme uses click-to-scroll as the default behavior.“

    But I don’t have any footer widgets in “Appearance → Widgets”. I only see “Sidebar” there.

    To make it works, there is no “More Posts” button on the category page (e.g. http://zhengziying.com/category/life/). Although there is a “More Posts” button at the bottom of the home page (http://zhengziying.com/).

    I’m Ok with either way:
    1. I can enable infinite scroll on home page and category pages, or
    2. There is a “More Posts” button on both Home page and category pages.

    Can you help me figure it out?

    Thanks!
    -eric

    The blog I need help with is: (visible only to logged in users)

    #73394
    mmcalister
    Theme Author

    Hi Eric,

    It looks like maybe there is some Custom CSS hiding the navs. This is what I see in the page:

    .nav-links {
  display: none;
}

    Try going to Appearance -> Customize -> CSS and removing this CSS if it’s in there.

    #73395
    zhengziying
    Member
    Original poster

    Thanks mmcalister for looking into it promptly!

    To report what I have tried and seen:

    1. I removed the .nav-links section from the custom CSS. It doesn’t seem to change: still no “More Posts” button in category page, nor infinite scroll.

    2. I found that the “Most Posts” button is in a different div: <div id=”infinite-handle”>, rather than <div class=”nav-links”>. On home page, there is both <div class=”nav-links”> and <div id=”infinite-handle”>. But there is no <div id=”infinite-handle”> on category page. I guess that’s why removing .nav-links from custom CSS didn’t change anything.

    3. I found that in the category page (example), the entire <nav class=”navigation paging-navigation” role=”navigation”> section has “display: none”: 

    media="all"
.infinite-scroll .paging-navigation, .infinite-scroll.neverending .site-footer {
  display: block;
}

    I guess that’s why regardless whether I put “display: none” on .nav-links in custom CSS or not, there is never a “Older Posts” button on category page.
    In F12, I changed it to “display: block” and now can see the “Older Posts” and “Newer Posts” button at the bottom of category page.

    Any recommendation what I should do?

    To clarify what I want: I want to have infinite scroll, but I’m also OK with either way, the old-school navigation (“Older Posts” and “Newer Posts” buttons).

    #73396
    zhengziying
    Member
    Original poster

    Btw, I tried to put the following in custom CSS:

    .infinite-scroll .paging-navigation,
.infinite-scroll.neverending .site-footer {
  display: block !important;
}

#infinite-handle {
	display: none !important;
}

    That will suppress the “More Posts” button (#infinite-handle) on the home page, and show “Older Posts” and “Newer Posts” on home, category and monthly archive pages.

    I guess that will be my last resort — it will just give me the old school navigation across the board.

    Still looking for a way to have infinite scroll on home, category and monthly archive pages.

    #73463
    mmcalister
    Theme Author

    Hi there,

    We just released an update for this bug and it should be available on your site shortly!

  • The topic ‘Infinite scroll doesn't work’ is closed to new replies.