Joomla Category List With Images.
Star InactiveStar InactiveStar InactiveStar InactiveStar Inactive

Joomla Category List With Images.

The out of the box category list in Joomla is pretty basic, it simply lists articles in table format.  You can control what's displayed in the table, like dates and hit counts, but it just seemed like a rather bland way to list the articles.   I wanted something that wasn't limited to just listing articles in a table, it would be nice if it were laid out better with an image and in div's that were responsive.  I chose a side by side layout with an image on top and the title and other information below the image (see below).  When viewed on smaller devices the div's are stacked on top of each other to keep things readable.

Having just finished a responsive 2-column Joomla template, I decided to just add the nicely formatted list to the template.  To make things easier an override was created for category and I copied the files to my local computer for editing and testing on my Virtual Machine.  Most of the changes were make to the default_children.php file in the category directory.  It needed quite a bit of restructuring and CSS to get it to look the way I wanted it to.  

The image that's displayed for each article in the list is the intro image of the article.  If the intro image isn't set, the image div is currently set to a blue color and the text "No Image" is displayed.  In the clip below, all of the list information has been enabled. I don't particularly care for the styling of the "Hits" counter so I might change that in a future revision.

Category list with image, date, author, hits and short description.

There are a few more changes I'd like to make, but for now this is quite useful.


* indicates required

Powered by MailChimp