[Plugin: Infinite-Scroll] How to know CSS selector values (Infinite Scroll)

totally not working for me.

im using this theme https://www.elegantthemes.com/demo/?theme=TheStyle

Pls let me know what’s the correct selector that i should put.

Thanks ??

Buddy it works. I have spent few hours finding the correct selectors and the I succeeded. I got a great help from this example.

<div id="content">
<div class="post">This is my post 1, it has a lot of content in it about Bananas...</div>
<div class="post">This is my post 2, it has a lot of content in it about Bananas...</div>
<div class="post">This is my post 3, it has a lot of content in it about Bananas...</div>
<div class="post">This is my post 4, it has a lot of content in it about Bananas...</div>
</div>
<div id="navigation">
<div class='next'>
<a href='/page/2/'>Next Page</a>
</div>
</div>

[Moderator Note: Please post code or markup snippets between backticks or use the code button.]

In this example
nextSelector: #navigation .next a:first
navSelector: #navigation
contentSelector: #content
itemSelector: #content .post

Thanks a lot beaver. I am enjoying the plugin now…….

where to see that code? Page Template?

Try looking inside ‘index.php’ or ‘home.php’…

Hi, my “home.php” is like below

<?php get_header(); ?>
<?php $show_sidebar = (get_option(‘thestyle_sidebar_home’) == ‘on’) ? true : false; ?>

<div id=”content” class=”clearfix<?php if ($show_sidebar && get_option(‘thestyle_blog_style’) == ‘false’) echo(‘ sidebar-fixedwidth’); ?>”>
<div id=”boxes” class=”<?php if (!$show_sidebar) echo(‘fullwidth’); if (get_option(‘thestyle_blog_style’) == ‘on’) echo(‘ blogstyle-entries’); ?>”>
<?php get_template_part(‘includes/entry’,’home’); ?>
<div id=”content-bottom-bg”></div>

<?php get_footer(); ?>

So how to know which selector? Appreciate if u all can guide me. Thanks ??

Can you tell us what theme are you using now…

From the thread you started, you mentioned you’re using Elegant Theme – TheStyle…
If that’s the one, I’ll try to assume your selectors would like these based on the examples shown earlier by Abdul877…

Content Selector: #content
Posts Selector: #content div#boxes
Navigation Selector: .wp-pagenavi
Next Page Selector: .wp-pagenavi #right-arrow a:First

Give it a try…all the best
Den

denicocc,

No, it’s not working ??

hmm…should have work…I only see those selectors on your template…
I don’t get it to work coz my template has an option that can turn off Javascript/Ajax scripts…
that’s pretty much what I did…
I wish I have your theme so I can give it a test but it’s paid theme…

i copy & paste exactly what you type. after filled up the selectors. my blog Category & Pages words missing from the top of my blog.

Am i did something wrong?

does this happened before?
if it doesn’t, somehow the plugin is somewhat working but with errors that’s why you’ll noticed strange behavior/abnormality with your theme…

this is first time happen.
so i have to re-install the plugin & try again?

i’m not sure…
it could be the plugin or it could be other plugins clashing with it…
does your theme has it own option/settings?
you need to check that also…

I change the “First” to “first” e.g
Next Page Selector: .wp-pagenavi #right-arrow a:First
Next Page Selector: .wp-pagenavi #right-arrow a:first

the Category & Pages at the top back to normal but infinite scroll still not working.
Yes it does has it own option but i can’t see anything wrong with it.
I already re-installed the plugin but still can’t make it.

have you tried this:

.wp-pagenavi #right-arrow a:first

to

div.wp-pagenavi div#right-arrow a:first

there are lot of variations, just need to experiment with it…
have you tried turning off other plugins?
just used Infinite-Scroll plugin only…