Support » Plugin: Ajax Pagination and Infinite Scroll » Loading Two Column Bootstrap

Viewing 9 replies - 1 through 9 (of 9 total)
  • Thread Starter soulstatic

    (@soulstatic)

    One more thing. I seem to lose jquery functionality. Any way to get that back with the newly loaded posts?

    Plugin Author craigramsay

    (@malinkymedia)

    Hi. Unfortunately the plugin won’t work well with your current markup. The issue with the two column layout is that you have wrapping divs on each row. So on a desktop screen each row has two posts which are contained in the following markup:

    <div class="row">
    <div class="col-md-6" data-paginator-count="1"></div>
    <div class="col-md-6" data-paginator-count="1"></div>
    </div>

    The solution is to rework the html so that you don’t have the row wrapper and the posts just wrap round the page, using floats if necessary.

    The plugin when adding new posts targets the last post on the page and with your current setup this will always be in the right hand column hence why that gets filled up.

    Plugin Author craigramsay

    (@malinkymedia)

    If you struggle to make the amends please drop me an email and I’ll try and work through a solution with you.

    hello@wordpress-ajax-pagination.com

    Thanks.

    Plugin Author craigramsay

    (@malinkymedia)

    Hi again,

    I had a few minutes spare so I’ve made the adjustments to your template and the plugin should now work in the two columns layout for you.

    If you can email me please I’ll send it over to you with the explanation.

    Thanks

    Plugin Author craigramsay

    (@malinkymedia)

    Resolved directly with OP

    Most strange is it calculate right height (allow Bootstrap JS to do it) when plugin is using Ajax (native) pagination option.

    Is it possible to trick code to use Load more, or Infinite but display as in Pagination option ?
    I mean to leave last page visible and continue to scroll. Dont know if this would make conflict inside Bootstrap JS self.

    The other tweak, without ruining and changing template much, is with CSS ellipsis prevent Post Titles to go another line. And to give excerpt area constant min-height. Then it works fine, but as usual many devices, many screen sizes. Tweak to rather avoid if possible.

    • This reply was modified 4 years, 11 months ago by Stagger Lee.
    Plugin Author craigramsay

    (@malinkymedia)

    Hi, I don’t quite follow what you mean about tricking the code. If the problem is the same as the op then you need to rework the template as the pagination doesn’t know where to insert the new posts. Your post divs need to just wrap, which is better way to mark things up anyway the extra divs just aren’t required.

    I can’t help much more without seeing a demo if you have one.

    Thanks

    Difficult to rewrite all those free/commercial Themes with update option.

    I meant to “trick” code to work as with Pagination option active, but just dont hide Posts from previous site. Dont know how much plugin does there and how much WP, or if it is possible at all.

    This way it would work with all themes to 100%, and Infinite od Load more could be used.

    No, it cannot possibly work. Problem with URL rewrite and page numbers in URL.
    But still, if you get some idee with time just say.

    Sorry for demo, it is on localhost. Works all the way except when new set od grid Posts is loaded it cannot calculate right min-height anymore. I tried with jQuery equal height (different) snippet but seems cannot stick to Load More code and influence anything.

    • This reply was modified 4 years, 11 months ago by Stagger Lee.
Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Loading Two Column Bootstrap’ is closed to new replies.