Wordpress - Include static image after every X post through wp_query - php

Question

I have a somewhat complicated design.
I want to use a CPT to output it. This is my CPT in the wp_query:
/**
* Management Team Shortcode
**/
function team_query() {
$args = array(
'posts_per_page' => -1,
'post_type' => 'management-team',
'order' => 'DESC',
);
$posts = get_posts( $args );
if ( !empty( $posts ) ) {
$flag = 0;
foreach ($posts as $counter => $p) {
$counter++;
if ( $flag <= 2 ) {
$flag++;
}
$role = get_field( "role" );
$name = get_field( "team_member_name" );
$bio = get_field( "bio" );
$profile = get_the_post_thumbnail_url( $p->ID, 'full' );
$flip = get_field( "flip_content" );
$html_out = '<article class="team-member">';
// Do stuff with each post here
if ( $flag % 2 == 0 ) {
//add image after second post like
$html_out .= '<img src="http://www.ankitdesigns.com/demo/rawafid/wp-content/themes/rawafid-systems/assets/img/mt-1.jpg" alt="Safety Whistle" />';
}
if ( $counter % 6 == 0 ) {
$flag = 0;
//add image after sixth post like
$html_out .= '<img src="http://www.ankitdesigns.com/demo/rawafid/wp-content/themes/rawafid-systems/assets/img/mt-2.jpg" alt="Safety Whistle" />';
}
$html_out .= '<div class="meta-team"><h6>' . $role . '</h6>' . '<h4>' . $name . '</h4>' . '<p>' . $bio . '</p></div>';
$html_out .= '</article>';
}
} else {
// No results
$html_out = 'No Management Team Members Found.';
}
return $html_out;
}
add_shortcode( 'show_management_team', 'team_query' );
After 2 posts I'd like to add a static img and after 4 posts another static and after 2 more posts another static img, etc.
I'm open to suggestions on a better approach.
I'm trying to think of an alternative method. Maybe using Visual composer to build a grid?

Answer 1

Hey Darren here is the logic, I think that you can modify my functions and implement it in your code.
/**
* Management Team Shortcode
**/
function team_query() {
$args = array(
'posts_per_page' => -1,
'post_type' => 'management-team',
'order' => 'ASC',
);
$posts = get_posts( $args );
if ( !empty( $posts ) ) {
$flag = 0;
foreach ($posts as $counter => $p) {
$counter++;
if ( $flag <= 2 ) {
$flag++;
}
$title = get_the_title($p->ID);
$link = get_the_permalink($p->ID);
$featured_img = get_the_post_thumbnail_url( $p->ID, 'full' );
$html_out = '<article class="recent-project" style="background: url(' . $featured_img . ') no-repeat center center; background-size: cover;">';
// Do stuff with each post here
if ( $flag % 2 == 0 ) {
//add image after second post like
// $html .= <img src="css/images/myimage1.png" alt="" />
}
if ( $counter % 6 == 0 ) {
$flag = 0;
//add image after sixth post like
// $html .= <img src="css/images/myimage2.png" alt="" />
}
$html_out .= '<div class="container"><div class="meta-project"><h6>Latest Project</h6>' . '<h2>' . $title . '</h2>' . '<a class="btn btn-lg btn-tertiary" href="' . $link . '">' . 'Discover' . '</a></div></div>';
$html_out .= '</article>';
}
} else {
// No results
echo "Nothing to show";
}
return $html_out;
}
Cheers :)