Placing Ads after every 10th Post with Infinite Scroll

3 Views

I have to load a couple of ads, some normal html and two are java script. I’ve tried the PHP method of this: 

<?php $postnum++; if($postnum%10 == 0) { ?>
 <div id="topset">
  <ul id="top_ad_list">
      <?php dynamic_sidebar('botad'); ?>
  </ul>
 </div> 
<?php } ?>

What occurs is for the first pagination from the infinite scroll it will load the add, on the new loaded pages it will no longer load the ads.

Read More

The Infinite Scroll I am using as follows: Infinite Ajax Scroll

Post Views: 3

Related posts

Leave a Reply

2 comments

  1. See this: http://infiniteajaxscroll.com/docs/events.html#rendered

    So, place all the ad code in an ajax function (http://codex.wordpress.org/Plugin_API/Action_Reference/wp_ajax_%28action%29)

    add_action( 'wp_ajax_your_ad_fn', 'your_ad_fn');
add_action( 'wp_ajax_nopriv_your_ad_fn', 'your_ad_fn');

function your_ad_fn(){
    // your ad code here
    // if sending js, set Content-type header to application/javascript
    // if sending html, text/html
}

    https://stackoverflow.com/questions/9664282/difference-between-application-x-javascript-and-text-javascript-content-types

    Then in your custom js,

    ias.on('rendered', function(items) {
    var $items = $(items);
    jQuery.get(
        'http://yoursite.com/wp-admin/admin-ajax.php', // I've just illustrated, don't write the url directly, do it via wp_localize_script
    ).done( function( data ) ){
         $items.after(data); // append ad after all the loaded posts
    });        
})

    This is NOT the exact code, you have to work out some details, yourself.

  2. The solution to your problem is to add functionality using the onLoadItems event, whereby you inject an advert every time ten more items have been added, keeping track of the number of items loaded by adding the size of the items array passed when the event is triggered to a counter of some sort and when the counter hits 10, adding an advert and resetting your counter to 0.

    From your response I’m assuming your level of JavaScript knowledge isn’t that great? And also that you’d struggle to do this change even with the documentation provided with the script? Am I correct? Do you know what events are and how they work? If not, you could wait for someone to post a fully coded solution here, or raise your question as an issue on the GitHub issue tracker.