Categories in Grid View on Page

does your theme allows you to do that? if your theme is not suposed to do that, you will not be able to do what you want without knowing php

No, that’s not part of my theme, hence me asking. I was just assuming that there would be some sort of template tag that might be able to be rigged for this involving wp_list_categories.

try to search for other themes that allows you to do what you want. you will find something…

Thanks, but I need to use the theme I’m using ??

well, good luck then:). Come back when you have modified it to show us your work.

Thank you ??

Anyone else know if the wp_list_categories template tag can be made to do something like this?

Not much to say here but add this:

https://www.google.com/search?q=wordpress+display+categories+in+columns

Ah, I hadn’t thought to use the term “columns”, thanks ??

Thanks for the Google, but unless I’m missing something (which is entirely possible), everything there is still about displaying categories as list items. I’d actually like to strip the list styling, add an image to represent each category, and display them 3 or 4 across :/

The issue is associating an image with a particular category.

Some things to consider:

https://www.google.com/search?q=wordpress+list+categories+with+images

https://www.ads-software.com/extend/plugins/category-icons/

https://wordpresshero.com/hacks/category-images-hack.html/

https://www.doc4design.com/articles/wordpress-list-categories-next-to-descriptions/

Thanks again…I’ll have to play with the Category Image(s) plugin later tonight to see what I can make of that. The rest of the info linked seems to be focused more on displaying an image that represents a category with a post (or do they mean any category that CONTAINS a post??)

seems to be focused more on displaying an image that represents a category with a post

That’s true, but will want to use get_categories instead of get_the_category.

Thanks for the help so far! I really do appreciate it ??

I’m a php doofus, so please bear with me…THIS is looking like it may be the way to go, but I just want to make sure that I’m on the right track.

So I’d just make a file called “my-hacks.php” and paste the following into it (and of course the template tag into my page template used to display the category grid)? I’ve made the “get_categories” change as well as the folder I’d like it to pull images from and the file extention (to jpg). Please advise if this is incorrect:

function category_images($seperator = '', $image_type = 'jpg', $image_directory = '/wp-content/uploads/') {
    $categories = get_categories();
        $image_directory = preg_replace('|/+$|', '', $image_directory);
    if ('' == $seperator) {
                echo '<span>';
                foreach ($categories as $category) {
                        $category->cat_name = stripslashes($category->cat_name);
                        echo "<a href='" . get_category_link(0, $category->category_id, $category->category_nicename) . "' title='View all posts in $category->cat_name'><img src='$image_directory/$category->category_nicename.$image_type' alt='$category->cat_name' /></a>";
                }
                echo "\n</span>";
    } else {
                $i = 0;
                foreach ($categories as $category) {
                        $category->cat_name = stripslashes($category->cat_name);
                        if (0 < $i) echo $seperator . ' ';
                        echo "<a href='" . get_category_link(0, $category->category_id, $category->category_nicename) . "' title='View all posts in $category->cat_name'><img src='$image_directory/$category->category_nicename.$image_type' alt='$category->cat_name' /></a>";
                }
                ++$i;
        }
}

Ok, here’s what I put in a file I created called “my-hacks.php” and uploaded to my root WP folder (are the php open/close tags right??):

<?php

function category_images($seperator = '', $image_type = 'jpg', $image_directory = '/wp-content/uploads/') {
    $categories = get_categories();
        $image_directory = preg_replace('|/+$|', '', $image_directory);
    if ('' == $seperator) {
                echo '<span>';
                foreach ($categories as $category) {
                        $category->cat_name = stripslashes($category->cat_name);
                        echo "<a href='" . get_category_link(0, $category->category_id, $category->category_nicename) . "' title='View all posts in $category->cat_name'><img src='$image_directory/$category->category_nicename.$image_type' alt='$category->cat_name' /></a>";
                }
                echo "\n</span>";
    } else {
                $i = 0;
                foreach ($categories as $category) {
                        $category->cat_name = stripslashes($category->cat_name);
                        if (0 < $i) echo $seperator . ' ';
                        echo "<a href='" . get_category_link(0, $category->category_id, $category->category_nicename) . "' title='View all posts in $category->cat_name'><img src='$image_directory/$category->category_nicename.$image_type' alt='$category->cat_name' /></a>";
                }
                ++$i;
        }
}

?>

And here’s the template tag I added to a new page template:

<?php
category_images(' ');  ?>

And here’s the error it gives me:

“Fatal error: Call to undefined function category_images() in /home/*******/public_html/knitsandwhatknot/wp-content/themes/fixed-blix/shop.php on line 21”

I’m lost ??

Nevermind, I did it using THIS link instead!! I’ve got my categories auto-displaying with scaled down category representative pix! I know it’s silly but I’m pretty d*mn proud of myself ??

And thanks again for the help, MichaelH!!

However, I have a new issue…I want a grid display, 4 columns across and a dynamic amount of rows, depending on how many categories are added in the future. I figured a straight HTML table would be the way to go here (rather than a ton of complicated CSS), but am REALLY lost on how to get the code to only display 4 cells across and then add a new row. Right now I’ve got 5 test categories set up, and they’re all displaying on the same row together. Here’s my template code for retrieving the categories. I know it’s silly and wrong, but I just don’t know where to go from here:

<table border="0" width="100%">

<?php $categories = get_categories('hide_empty=0');
echo '<tr>';
foreach ($categories as $cat) {
echo "<td width=\"25%\" align=\"center\"><a href=\"" . get_category_link( $cat->term_id ) . "\"><div class=\"description\"><img src=\"wp-content/uploads/". $cat->description .".jpg\" width=\"100px\"></div>" . $cat->cat_name . "</a></td>";
}
echo '<tr>';
?>

</table>

Use the modulus (%) operator:

<table border="0" width="100%">

<?php $categories = get_categories('hide_empty=0');
echo '<tr>';
$count=0;
foreach ($categories as $cat) {
echo "<td width=\"25%\" align=\"center\"><a href=\"" . get_category_link( $cat->term_id ) . "\"><div class=\"description\"><img src=\"wp-content/uploads/". $cat->description .".jpg\" width=\"100px\"></div>" . $cat->cat_name . "</a></td>";
$count++;
if ($count % 4 == 0)
{
echo '<tr>';
}
}
echo '<tr>';

?>

</table>