adding class featured image on posts

[eric]

Hi there,

I would like to add a customized class to the featured images to blog pages through the elements module.

I’m deciding against the header module because I want to have more control over the wrappers and the ability to do things like reposition the title relative to the banner for mobile devices.

Based on an earlier support request, I adapted the below code to add the style-svg class to the image (this is to have it work with support-svg plugin). I notice this doesn’t work with the posts header. Is there a way to modify it so that it does? Please let me know. Thank you in advance.

add_filter( 'generate_featured_image_output', function( $output ) {
    return sprintf( // WPCS: XSS ok.
        '<div class="post-image CUSTOM-CLASS">
					<a href="%1$s">
						%2$s
					</a>
				</div>',
				esc_url( get_permalink() ),
				get_the_post_thumbnail(
					get_the_ID(),
					apply_filters( 'generate_page_header_default_size', 'full' ),
					array(
						'itemprop' => 'image',
                                                 'class'=> 'style-svg'
             )
         )
    );
} );

[Tom]

Hi there,

What do you mean by “the posts header”, exactly? The featured image on single posts? Or the background image in a Hero element?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[eric]

I’m sorry. I should have been more clear. I meant the featured image on single posts. I was able to resolve this by adding a new element but a solution that similar to the one listed above would be preferable. Please let me know if that is easily possible. Thank you.

[Tom]

Any chance you can link me to your page? The standard single featured image in the free theme isn’t filterable (for some reason, noted), but it might be if you have the Blog module activated.

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts