Images as Categories

by

Okay, this will be a 3 step process;

  1. Add a meta field to store the image in the category edit page. (Easiest way: ACF plugin)
  2. Create a short code to output HTML that retrieves that field and show them as the design you want. (In functions.php) (Optional)
  3. Edit your theme’s post template; remove the current tags and place the short code. (Your single.php) OR you can completely skip the 2nd step and edit your post template’s html to take the meta field and show them as images.

Its easier if you install something like Advanced Custom Fields. If you don’t know how to do any of these, I’ll try to explain my best if you need.

Edit;
I’d do something like this. In functions.php, in the bottom;

function cusotm_category_html() { 
$terms = get_the_terms( get_the_ID(), 'category');
$imageUrls = [];
foreach($terms as $term){
    $imageId = get_field('category_image', $term ); //assuming you put "attachement ID as the return value in ACF"
    $imageUrls[] = wp_get_attachment_image_url($imageId);
}
foreach($imageUrls as $imageUrl){
    ?>
        <img src="<?= $imageUrl; ?>" class="category-icon"/>
    <?php
}
}

add_shortcode('categories', 'cusotm_category_html');

and in single.php where categories currently resides,

<div class="categories">
    <?= do_shortcode("categories") ?>
</div>