I really hope you can help me! I'm building a site as a favour to a charity (I am only a beginner with Joomla. I'm alright with html and css but crap with php).

My problem is on a category blog page. There is an open div in the first item so the column for the next item is appearing inside that column and so on, so each column is smaller and smaller and further to the left. I can find the problem line when I inspect the element and view the page source, but I cannot figure out how to fix it in my template files.

The page is here. This is just my dev site on my own domain. You can see the cats are all to the left instead of columns and if you inspect it you can see the columns fitted inside each other. FF and Chrome display it slightly differently, but both have the problem.

The line in the page source is 254. That background-color div should be closed on the next line, but it's not. I have enough experience with Joomla to figure out how to move things and change colors and stuff, but I really don't understand where this div would be created and therefore where I go to add the closing tag. This template has given me some grief - it's not well written, but other than this I've managed to sort it. If you can give me some advice about where to look, or how to trace the code back, or if some kind soul is willing to work with me to sort it out I would be much obliged. Thank you!


The Category Blog view is (by default) generated by the files components\com_content\views\category\tmpl\blog.php (layout for the blog page) and components\com_content\views\category\tmpl\blog_item.php (layout for each item on the blog page).

But your template almost certainly uses overrides in order to change the output. (Never edit any core Joomla files, always try to use overrides.)

I'm not sure if you're familiar with overrides, but basically it's a file within your template directory that is used for rendering instead of the core Joomla file. This is a very powerful function in Joomla, and you might want to read this introduction, and take a look at other posts tagged on JSE.

So, back to your question. The code you're looking for is probably located in the file /templates/grab/html/com_content/category/blog.php or /templates/grab/html/com_content/category/blog_item.php. Edit the file as needed (add your closing </div>), save and reload your page.

Hope that helps, and welcome to Joomla StackExchange.

  • 1
    Thank you so much for your help. Those are the files I suspected would be the problem, but I've gone through them and they seem to be fine. I'm not much of a php person, but there are certainly no unclosed divs in those files. More testing shows that the problem only happens when I have a readmore at the beginning of the article. I've tried a readlesstext extension, but it seems to only apply before I run my filtering app, which means as soon as you filter results all the article text comes back. Feeling a little catch 22 right now! Thanks again, I really appreciate you sharing your advice! – user2117 Oct 30 '14 at 13:07
  • 1
    Oh man, I just solved it looking in the article source itself! The code for the readmore was cutting the html for the article up and leaving the open div above and the close below. Such a stupid problem haha and it's been torturing me! So happy now, I might cry :). Thank you! You put me on the right path to success! – user2117 Oct 30 '14 at 13:18
  • 1
    Oh, that's an easy mistake to make, and could be hard to find. I'm glad you fixed it. – johanpw Oct 30 '14 at 19:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.