Displaying Ads After a Certain Number of Posts

This tutorial shows you how to insert an ad in the post archive view and single post view dynamically.

1. Create a child theme and a functions.php file in the child theme folder. If you already have a child theme with a functions.php file, skip this step.

2. Paste the following code in the child theme functions.php:


<?php
/* Define post counters and flag to know when the ad is shown  */
global $themify_count_posts, $themify_index_ad_shown;
$themify_count_posts = 1;
$themify_index_ad_shown = false;
/**
 * Add an add in single post view and in 3rd post in index view
 */
function custom_themify_ad() {
	global $themify_count_posts, $themify_index_ad_shown;
	if( is_archive() || is_home() ) {
		if ( 0 == $themify_count_posts % 3 && !$themify_index_ad_shown ) {
			$themify_index_ad_shown = true;
		?>
			<div class="themify-custom-ad themify-index-ad">
				<p>THIS IS YOUR INDEX AD</p>
			</div>
		<?php }
		$themify_count_posts++;
	} elseif( is_single() ) {
		?>
			<div class="themify-custom-ad themify-single-ad">
				<p>THIS IS YOUR SINGLE AD</p>
			</div>
		<?php
	}
}
add_action( 'themify_post_end', 'custom_themify_ad');
?>

Themes with Infinite Scroll

In themes with infinite scroll (eg. Pinboard, Grido, Metro), it will still work, but for the ad placement to be reliable, the number of posts loaded each time must be divisible by the number of posts that will be skipped before adding the ad. Otherwise the ad position will be offset each time a new set of posts is loaded.

Example:

  • If you're displaying 10 posts per page, you can add an ad after 1, 2 or 5 posts
  • If you're displaying 8 posts per page, you can add an ad after 1, 2 or 4 posts
  • The following sample code works for both infinite and regular themes and displays an text cyclically after 4 posts.

<?php
/* Define post counter */
global $themify_count_posts;
$themify_count_posts = 1;
/**
 * Add an add in index view after 4 posts
 */
function custom_themify_ad() {
    global $themify_count_posts;
    if( is_archive() || is_home() ) {
        // The number 4 below is one that defines how many posts
        // will be skipped before adding the ad.
        if ( 0 == $themify_count_posts % 4 ) {
        ?>
            <div class="themify-custom-ad themify-index-ad">
                <p>THIS IS YOUR INDEX AD</p>
            </div>
        <?php }
        $themify_count_posts++;
    }
}
add_action( 'themify_post_end', 'custom_themify_ad');
?>

To give an example with the code above would be the opposite, since the ad will be added every 3 posts, the posts loaded each time should be 6, 9, 12, 15 and so on.

Fix Google Ads in InfiniteScroll

Then add the following code in Themify > Settings > General => Footer Code to fix the Google Ads scripts removed by InfiniteScroll script:


<script>
jQuery(document).on('newElements', function(){
    (adsbygoogle = window.adsbygoogle || []).push({});
});
</script>