The following is an example of how you could achieve this (I am assuming the_field
is a result of Advanced Custom Fields)…
Please note that it is incredibly inefficient, there are other ways to do this that may improve performance and reduce the need for repetitive code.
<?php
$query = new WP_Query( array(
'post_type' => 'fixtures',
'posts_per_page' => -1,
'meta_key' => 'date',
'orderby' => 'meta_value_num',
'order' => 'ASC',
));
if ( $query->have_posts() ) { ?>
<?php while ( $query->have_posts() ) : $query->the_post(); ?>
<p class="team-name"><?php the_field('team_home'); ?></p>
<?php
$team_home = get_posts(array(
'post_type' => 'fixtures_teams',
'posts_per_page' => 1,
'meta_query' => array(
array(
'key' => 'team_home',
'value' => get_field('team_home'), //assuming ACF here so change the_field to get_field
),
),
));
$team_away = get_posts(array(
'post_type' => 'fixtures_teams',
'posts_per_page' => 1,
'meta_query' => array(
array(
'key' => 'team_away',
'value' => get_field('team_away'), //assuming ACF here so change the_field to get_field
),
),
));
// replace "large" with the particular size you want
// see https://developer.wordpress.org/reference/functions/get_the_post_thumbnail/
$image_home = get_the_post_thumbnail($team_home, 'large' );
$image_away = get_the_post_thumbnail($team_away, 'large' );
?>
<!-- print your image here and markup as desired -->
<?php echo $image_home; ?>
<p><span class="versus">V</span></p>
<!-- print your image here and markup as desired -->
<?php echo $image_away; ?>
<p class="team-name"><?php the_field('team_away'); ?></p>
<?php endwhile; wp_reset_postdata(); ?>