Featured image per tag or category

  • Unknown's avatar
    leoceasar18 · Member ·

    Is there a way to assign a specific featured image/header per category or tag? Like for example there will be a specific featured image/header for “https://blaineislost.com/category/travel/” and for “https://blaineislost.com/tag/benguet/”. Can we do that through CSS? Thanks

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    Hi there, yes we can. What we have to do is to specifically target the category pages using the category CSS class in the opening body html tag for each of the categories on which you wish to change the image. If you use your web inspector on the Travel category page, in the opening body html tag, you will see the following.
    <body class="archive category category-travel category-200 ...
    To change the image on this page, we would do this (I randomly chose an image from your Media Library). You can change the URL and insert the image URL you want to use. 

    .category-travel .feature-img {
  background-image: url('https://blaineislostph.files.wordpress.com/2017/02/new-stobosa-mural-header.jpg') !important;
}

    Let me know how things go and if you run into any problems.

  • Unknown's avatar
    leoceasar18 · Member ·

    Hey man! Thanks a lot! It worked big time :) Now I can fully customize the header images of every tag or category. Thank you so much! :D

  • Unknown's avatar
    thesacredpath · Member ·

    Awesome, and you are welcome!

  • The topic ‘Featured image per tag or category’ is closed to new replies.