Support » Theme: Neve » Add Class to Neve Post Thumbnail

  • Resolved Aditya Agarwal

    (@adityamilyin)


    Hi, I have a plugin that requires me to specify the class of a IMG itself and not the wrapper for its functioning.

    I am using Neve theme, and in order to make that plugin work with Neve, I need to somehow add a particular class to the thumbnail tag itself.

    Please help me with that

    I tried editing neve/inc/views/post_layout.php and added array('class' => 'Milyin-Thumbnail-IMG-URL') to make it work properly, but the issue is that upon updating the theme in future I shall have to rewrite that line.

    Please support me with a direct way of adding a class to neve post thumbnail, or if possible some way to override that specific file, I tried override through Child Theme but couldn’t rewrite as it is not a template file.

    previously my IMG tag looked as follows

    <img width="674" height="450" src="https://mlqatgay8yj9.i.optimole.com/1WIRvMI.Nhkc~18988/w:674/h:450/q:89/https://milyin.com/wp-content/uploads/2020/10/21-Proven-Ways-to-Earn-Money-From-Home-in-2020-5-is-a-new-Way.png" class="attachment-neve-blog size-neve-blog wp-post-image" alt="21 Proven Ways To Earn Money From Home In 2020 (#5 Is A New Way)" loading="lazy">

    now I want it to be

    <img width="674" height="450" src="https://mlqatgay8yj9.i.optimole.com/1WIRvMI.Nhkc~18988/w:674/h:450/q:89/https://milyin.com/wp-content/uploads/2020/10/21-Proven-Ways-to-Earn-Money-From-Home-in-2020-5-is-a-new-Way.png" class="Milyin-Thumbnail-IMG-URL attachment-neve-blog size-neve-blog wp-post-image" alt="21 Proven Ways To Earn Money From Home In 2020 (#5 Is A New Way)" loading="lazy">

    Notice the extra class in the tag…

    I could achieve this my editin theme files, which is not best practice so please help me with some better way..

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Hi @adityamilyin,

    As it’s not a template file it cannot be modified via child theme, however, you can try to follow a similar logic as described in this thread: https://stackoverflow.com/questions/20473004/how-to-add-automatic-class-in-image-for-wordpress-post

    I hope it helps!

    Thread Starter Aditya Agarwal

    (@adityamilyin)

    hey @bvytis,

    Thanks for Reply.

    I am aware that only Template files can be overriden by Child Themes.

    The above mentioned solution by you only allows adding class to each and every image on the page by IMG tag. Which again is not suitable.

    I wanted to add CSS class to just the Featured Image on a given page.

    While I appreciate you for your support, this solution would be creating a lot of other problems for me.

    Could you please advice on how can I add a class only to the featured image

    Hi @adityamilyin,

    Yes, I understand that but the guide was shared to understand the logic of how it could be used. As you need to make the change only for featured image code should, of course, be adapted. We do not have a pre-made code for this specific scenario.

    I hope you’ll find a way to change the code as needed or someone from Neve’s community will share some code examples of a similar solution that they built before.

    Thread Starter Aditya Agarwal

    (@adityamilyin)

    Thanks, A lot I did some workaround with the theme file itself, untill I find something good enough, but anyways thanks.

    The possibility to override files inside “inc/views” folder is FUNDAMENTAL in order to do customization in child theme. I had to use an other theme after lots of working :/

    I solved overriding the get_the_post_thumbnail function:

    add_filter('post_thumbnail_html', 'workaround_post_thumbnail', 99, 5);
    function workaround_post_thumbnail( $html, $post_id, $post_thumbnail_id, $size, $attr )
    {
    	if( $size == 'neve-blog' )
    	{
    		$html = get_the_post_thumbnail( $post_id, $post_thumbnail_id, 'full', $attr );
    	}
    	return $html;
    }

    In my case I needed to change the size of the thumbnail, but you can adapt the snippet to your needs.

    Hope this help.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Add Class to Neve Post Thumbnail’ is closed to new replies.