Hi Ric,

Well, you need a bit Custom CSS on this one to add icons. https://prnt.sc/psrkxz

#filters li:before {
  padding-right: 10px;
  font-family: "Font Awesome 5 Free"; 
  font-weight: 900; 
}
#filters li:nth-child(1):before {
  content: "\f007";
}
#filters li:nth-child(2):before {
  content: "\f1ea";
}
#filters li:nth-child(3):before {
  font-family: "Font Awesome 5 Brands";
  content: '\f099';
}

So, nth-child(1) represents the first list item and so on. To check icons: 

- https://fontawesome.com/icons

2) In this you need a bit of Custom jQuery, first install the following plugin which will allow you to add custom scripts.

- https://wordpress.org/plugins/insert-headers-and-footers/

So, in the following directory at: Settings > Insert Headers and Footer you add the following script.

<script>
    jQuery(document).ready(function($) {
        $('.o-post-navigation__link.next .o-post-navigation__title').html('<i class="fa fa-next"></i>');
        $('.o-post-navigation__link.prev .o-post-navigation__title').html('<i class="fa fa-prev"></i>');
    });
</script>

Feel free to ask for anything you need.

Kind Regards

Hi Ric,

Good to know, feel free to ask for anything you need

Yes, of course. Simply remove the old CSS that I've send you in the last reply, because it's easier if you use only jQuery.

<script>
    jQuery(document).ready(function($) {
        $('#filters li:nth-child(1) a').html('<img src="https://placehold.it/20x20">');
        $('#filters li:nth-child(2) a').html('<img src="https://placehold.it/20x20">');
        $('#filters li:nth-child(3) a').html('<img src="https://placehold.it/20x20">');
    });
</script>

Check inside .html('your_url'), it works easy, I would suggest you to use png images, that would work better on that case

Thank you for these kind words, feel free to ask for anything you need.

Kind Regards