Help Calling for a Function in the Loop

I found that this works:

The Loop:

<?php
$the_categories = get_the_category();
get_cats_icon($the_categories);
?>

However I have no idea how to remove the border around the image or resize it to fit.

However I have no idea how to remove the border around the image or resize it to fit

difficult to tell without seeing the problem.

link to your site, to a post/page showing the cat icons?

https://bunchofanime.com/

The Latest Posts area shows the first icon code not working, then the second code is the one with the border that wont disappear.

I previously used Category Icons which seemed to mess up the database tables somehow.

I appreciate any help.

The Functions:

that posted code doesn’t make much sense;

what is the real code in the function?

and how is the code integrated in the full template?
(please paste the code of the template into a https://pastebin.com/ and post the link to it here)

can you describe where the individual icons are coming from, and where they are supposed to link to?

This is how it looks in the Functions.php:

https://pastebin.com/P3e5wb0L

function get_cats_icon($the_categories) {
foreach( $the_categories as $category) {

if ($category->cat_name == "Bleach") {
echo '<a href="https://www.yoursite.com/category/bleach"><img src="https://bunchofanime.com/wp-content/uploads/bleach.png" /></a>';
} elseif ($category->cat_name == "One Piece") {
echo '<a href="https://www.yoursite.com/category/one-piece"><img src="https://bunchofanime.com/wp-content/uploads/One-Piece.png" /></a>';
}
}
}

This is how it looks in the Index.php currently with both icons showing:

https://pastebin.com/M4b5pCQc

[code moderated as per forum rules - the pastebin is enough]

all icons are literally linking to ‘https://www.yoursite.com/category/bleach’ or ‘https://www.yoursite.com/category/one-piece’ which does not seem to be intended.

assuming that each icon is supposed to link to the episode, try:

function get_cats_icon($the_categories) {
global $post;
foreach( $the_categories as $category) {

if ($category->cat_name == "Bleach") {
echo '<a href="' . get_permalink($post->ID) . '"><img src="https://bunchofanime.com/wp-content/uploads/bleach.png" /></a>';
} elseif ($category->cat_name == "One Piece") {
echo '<a href="' . get_permalink($post->ID) . '"><img src="https://bunchofanime.com/wp-content/uploads/One-Piece.png" /></a>';
}
}
}

from index.php, you can remove the following section:

<?php
$the_categories = get_the_category();
if(function_exists('get_cats_icon($the_categories)')) {
$screen = get_cats_icon();
$screen = $screen[0];
} ?>
<img src="<?php echo ($screen); ?>" width="32" height="32" alt=""  />

The $screen still shows up blank though…

It use to be: https://pastebin.com/uLHUsUaZ

Before the plugin that went with it stopped working.

The $screen still shows up blank though…

the $screen cannot show anything with the existing code.
that is the reason i suggested to remove/delete the corresponding code.
(this section:

<?php
$the_categories = get_the_category();
if(function_exists('get_cats_icon($the_categories)')) {
$screen = get_cats_icon();
$screen = $screen[0];
} ?>
<img src="<?php echo ($screen); ?>" width="32" height="32" alt=""  />

as it is, it is useless)

———————
what do you expect that the $screen should show?
i.e what did the $screen show before?

what more than one icon do you want in your post list?

Well I had in mind it displaying individual icons for specific categories. If the category is, say, category 1, then it would display the corresponding icon for category 1 when called for. Something such as that. It’s easy to apply an icon for individual posts, but adding an icon for each one of a thousands of posts would be very time consuming.

The way I look at it the function code almost works, it works with this code just fine:

<?php
$the_categories = get_the_category();
get_cats_icon($the_categories);
?>

The only drawback is that there’s a big border around it that doesn’t seem to want to disappear despite whatever I try, and I do not know how to resize it to fit.

On the other hand the code that doesn’t display the icon would work perfectly if it actually displayed the icon.

in style.css, this style is generating the border:

.post img{
	float:left;
	margin: 0px 5px 5px 9px;
	padding: 2px 2px;
	border:1px solid #222;
	background:#070D17;

}

actually in two ways:
a:
border:1px solid #222;
b:

padding: 2px 2px;
background:#070D17;

if you remove all this from the style, there should be no border any more.

That worked perfectly! I’m surprised I didn’t notice that before..

Thanks for the help.