Adding Custom Class to Post Thumbnail

  • iftekhar
  • Aug 14, 2015
  • 0 comment
  • 2104 Views
  • Print

Featured images are great way to display your posts with images, it does not only make your site look good but also can potentially attract visitors. By default whenever you are displaying post thumbnails with the following function, it automatically adds few classes.

<?php the_post_thumbnail(); ?>

Such pre-defined classes can be really useful in certain cases. However, if you want to add custom class to your thumbnail image to add additional features using CSS, you can easily do that. Here is a simple code demonstration.

<?php 
if (has_post_thumbnail()) { 
   the_post_thumbnail('small',array('class' => 'custom'));
}
?>

This snippet will add additional post “custom” class. If you want, you can definitely change the name with whatever you want. This is what you should see when you inspect your thumbnail element.

Post Thumbnail Custom ClassPost Thumbnail Custom Class.

You can use this snippet pretty much anywhere you want on your template pages (single.php, archive.php) within the loop.

  •  
  •  

Comment

Leave a Reply

Note: Convet HTML, PHP, JavaScripts from Postable, before posting from comment section.
License: By submitting a comment here you grant this site a perpetual license to reproduce your words and name/Web site in attribution. Please use your real name or a pseudonym (i.e., pen name, alias, nom de plume) when commenting. If you add your site name, company name, or something completely random, I'll likely change it to whatever I want.