1. Open Mondree child theme functions.php ,add the following code and save.
add_post_type_support( ‘session’, ‘thumbnail’ );
2. Copy /wp-content/themes/mondree/single-session.php and paste to /wp-content/themes/mondree-child and open the pasted file for editing.
3. Search for the following code:
<div class=”schedule-inner__speakers”>
<!– meet –>
<div class=”meet”>
<!– meet__title –>
<h2 class=”meet__title”>
<?php echo get_post_meta($post_id, ‘session_speakers_title’, true); ?>
</h2>
<!– /meet__title –>
<!– meet__content –>
<div class=”meet__content”>
<?php if (!empty($session_speakers_list)): ?>
<!– meet__item –>
<?php
foreach ($session_speakers_list as $speaker):
$postdata = get_post($speaker);
setup_postdata($postdata);
$speaker_name = get_post_meta($postdata->ID, ‘speaker_title’, true);
$thumbnail = wp_get_attachment_image_src(get_post_thumbnail_id($postdata->ID), ‘mondree-speaker’);
?>
<a href=”<?php echo get_permalink($postdata->ID); ?>” class=”meet__item meet__item2″>
<!– meet__item-f1 –>
<div class=”meet__item-f1″ style=”background: url(‘<?php echo $thumbnail[0]; ?>’)”></div>
<!– /meet__item-f1 –>
<!– meet__item-f1 –>
<div class=”meet__item-f2″>
<h3><i class=”fa fa-star”></i><?php echo get_the_title($postdata->ID); ?></h3>
<p><?php echo $speaker_name; ?></p>
<i class=”fa fa-long-arrow-right”></i>
</div>
<!– /meet__item-f1 –>
</a>
<?php
endforeach;
wp_reset_postdata();
?>
<!– /meet__item –>
<?php endif; ?>
</div>
<!– /meet__content –>
</div>
<!– /meet –>
</div>
Replace it with following code and save:
<div class=”schedule-inner__speakers session_img”>
<?php
$thumb_id = get_post_thumbnail_id();
$thumb_url = wp_get_attachment_image_src($thumb_id,’thumbnail-size’, true);
?>
<img src=”<?php echo $thumb_url[0]; ?>” alt=”image”>
</div>
4. Navigate through Appearance -> Editor,add following css in style.css and save.
@media (max-width:1023px) {
.session_img img {
display: block;
margin: 0 auto;
max-width: 100%;
width: auto;
}
}
5. Save Changes.