Textpattern tips, tutorials and code snippets

Article category list with images

I posted a question on the TXP forum as I wished to create a list of categories along with a thumbnail. Els showed up with a perfect answer…

Creating the list

Let’s say we want to build a list of all article categories with one thumbnail right next to each category name. The thumbnail for the category is the one taken from the last image added in a last article belonging to that category.

In my example, the article categories are: monkeys, zebras and tigers.

I’ll have then this kind of list:

  • monkeys + last_monkey_image_added_in_an_article_in_that_category
  • zebras + last_zebras_image_added_in_an_article_in_that_category
  • tigers + last_tigers_image_added_in_an_article_in_that_category

Of course you can re-arrange the way images are pulled since they depend on your article order.

Empty categories with no articles will not appear.

In order to achieve this, we use the upm_image plugin which gives more options for displaying article images.

Well, enough blahs here’s the code you’ll need:

<txp:category_list wraptag="ul" break="li">
	<txp:article_custom category='<txp:category />'>
		<txp:variable name="art_img" value='<txp:article_image />' />
		       <txp:if_variable name="art_img" value="">
		       <txp:else />
			<txp:if_first_article>
                               <txp:category title="1" link="1" />
				<txp:category>
					<txp:upm_article_image limit="1" form="call_article_thumbnail" />
				</txp:category>
			</txp:if_first_article>
		</txp:if_variable>
	</txp:article_custom>
</txp:category_list>

Et voilà! Thanks to Els for posting the code!

Use Textile help to style your comments