Use filter to edit HTML around featured image

[Ken Charity]

Can I use a filter to change the default HTML output around a featured image on a single-event page?

Here is the code from the template:

<!-- Event featured image, but exclude link -->
			<?php echo tribe_event_featured_image( $event_id, 'full', false ); ?>

This is the code in the general.php file:

	function tribe_event_featured_image( $post_id = null, $size = 'full', $link = true ) {
		if ( is_null( $post_id ) ) {
			$post_id = get_the_ID();
		}

		/**
		 * Provides an opportunity to modify the featured image size.
		 *
		 * @param string $size
		 * @param int    $post_id
		 */
		$image_html     = get_the_post_thumbnail( $post_id, apply_filters( 'tribe_event_featured_image_size', $size, $post_id ) );
		$featured_image = '';

		/**
		 * Controls whether the featured image should be wrapped in a link
		 * or not.
		 *
		 * @param bool $link
		 */
		if ( ! empty( $image_html ) && apply_filters( 'tribe_event_featured_image_link', $link ) ) {
			$featured_image .= '<div class="tribe-events-event-image"><a href="' . esc_url( tribe_get_event_link() ) . '">' . $image_html . '</a></div>';
		} elseif ( ! empty( $image_html ) ) {
			$featured_image .= '<div class="tribe-events-event-image">' . $image_html . '</div>';
		}

		/**
		 * Provides an opportunity to modify the featured image HTML.
		 *
		 * @param string $featured_image
		 * @param int    $post_id
		 * @param string $size
		 */
		return apply_filters( 'tribe_event_featured_image', $featured_image, $post_id, $size );
	}

[Josh]

Hey Ken,

Thanks for reaching out to us!

You can use something like the following as a starting point for filtering the output there to be what you would like:

https://gist.github.com/BeardedGinger/3c6fc6b01cb92e378f652486cfa53d4c

Let me know if this helps.

Thanks!

[Ken Charity]

Hi Josh

Thanks for that starter code! So I added that to my function.php file and then in my single-event.php file I added in this

<div class="entry-featured">
	<div class="entry-thumb">
		<!-- Event featured image, but exclude link -->
		<?php echo custom_event_featured_image( $event_id, 'full', false ); ?>
	</div>
</div>

But no image is output on that page now. The last bit that is there is the comment abut the image.

[Josh]

Hey Ken,

The last line of the function attached to the filter should be “return $featured_image;” Sorry I missed that in the original suggestion there.

Thanks!

[Ken Charity]

This is just tripping me up still.

So I have this in the Functions file:

add_filter( 'tribe_event_featured_image', 'custom_event_featured_image', 10, 3 );
function custom_event_featured_image( $featured_image, $post_id, $size ) {
	$link = true;
	$image_html     = get_the_post_thumbnail( $post_id, apply_filters( 'tribe_event_featured_image_size', $size, $post_id ) );
	if ( ! empty( $image_html ) && apply_filters( 'tribe_event_featured_image_link', $link ) ) {
		$featured_image .= '<div class="event-image"><a href="' . esc_url( tribe_get_event_link() ) . '">' . $image_html . '</a></div>';
	} elseif ( ! empty( $image_html ) ) {
		$featured_image .= '<div class="event-image">' . $image_html . '</div>';
	}
	return $featured_image;
}

And this in the single-event file:

<!-- Event featured image, but exclude link -->
    <?php echo tribe_event_featured_image( $event_id, 'full', false ); ?>

But now I am getting 2 images one with no link, and one below it with my new HTML in it but it is also linked. So why two images now, and why is it now linked?

[Josh]

Hey Ken,

Try changing the “$link = true” at the top of the function to be “$link = false” and let me know if that gets you what you’re after here.

Thanks!

[Support Droid]

Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

Thanks so much!
The Events Calendar Support Team

[Author]

Posts