Textpattern CMS

#1 2009-10-10 18:52:01

tbJohnson

Member

Registered: 2009-10-02

Posts: 10

Changing Gallery from txp:acticle_custom to article category

So I am using Textpattern 4.2.0 in a pretty simple way, I am using it as a CMS site with a totally stripped down custom template. It is my company’s business site, so I built it so every time I have a new project I can just add it as a new article.

My pages are built like this.

<tr>
    <td valign="top"><txp:article_custom id="#" form="work_list" limit="1"/></td>
    <td valign="top"><txp:article_custom id="#" form="work_list" limit="1"/></td>
    <td valign="top"><txp:article_custom id="#" form="work_list" limit="1"/></td>
  </tr>
<tr>
   <td colspan="3"><img src="/pics/clear.gif" width="" height="20"> </td>
</tr>
  <tr>
    <td valign="top"><txp:article_custom id="#" form="work_list" limit="1"/></td>
    <td valign="top"><txp:article_custom id="#" form="work_list" limit="1"/></td>
    <td valign="top"><txp:article_custom id="#" form="work_list" limit="1"/></td>
  </tr>

This gives me a nice grid with 3 Articles across, and as long as I want, but I have to insert the id # manually, I want to figure out a way to use the article category to be able to build a nice grid like the one I have now, but do it using the article categories.

Anyone know where to start? I have tried it a few different ways, but I am not a textpattern master, so I never got far. Also I have about 70 Articles, with about 5 different categories, so 1 category might have 10 articles, 1 category my have just 5 etc..

Any help or any tutorials would be really helpful, thanks!

#2 2009-10-10 20:32:01

jakob

Admin

From: Germany

Registered: 2005-01-20

Posts: 4,732

Website

Re: Changing Gallery from txp:acticle_custom to article category

Hi tbJohnson and welcome!

You can achieve this more simply than you are at the moment. In principle you only need to call txp:article or txp:article_custom once to achieve what you want. Both tags collect the relevant articles and then outputs them one by one according a pattern you define in a form. In your case it’s a td cell, though there are better ways for that too.

You can use txp:article_custom together with the category="my-category" attribute to show all the relevant articles from your article category but here you need to still specify the category. Even better in this case, though, is txp:article as it is context-sensitive. This means when a category page is showing in the address bar it will do a list of all articles in that category, on the section page it will do a list of all articles from all categories in that section and on the address of the article in question it will show only the individual article.

You will also find it easier to do the layout you are looking for using div elements, an unordered list or similar because, unlike a table, you can make it wrap where you want with css and you don’t have any problems when you have 5 articles but need a blank sixth cell.

A code example:

<div id="container">
  <txp:article listform="my-article-preview" form="my-full-article" limit="99">
</div>

And your “my-article-preview” listform might be:

  <div class="item_preview">
     <h3><txp:permlink><txp:title /></txp:permlink></h3>
     <txp:article_image />
     <txp:excerpt />
  </div>

In your css define a set width for the container div and a set size for the item-preview and float the divs, they will wrap automatically. Add some margins to the item-preview to pad them apart, a deeper margin for the bottom instead of your clear.gif and you end up with something like this:

#container {
  width: 820px;
  overflow:auto;
  }

.item_preview {
  display:block;
  float:left;
  width:250px;
  height:200px;
  margin-right:20px;
  margin-bottom:40px;
  overflow:hidden;
  }

---

TXP Builders – finely-crafted code, design and txp