Jared Christensen, Web and Graphic Designer

Wednesday January 19, 2005

Textpattern: Flexible Article Placement.

This article assumes that the reader has a general understanding of Textpattern semantics and building blocks, such as forms and page templates. Tested only on Textpattern 1.0rc1. See end of article for updates to Textpattern 4.0.

I have been wrestling with the implementation of static pages in Textpattern since I began working with it over 3 months ago. I read some tutorials, but they didn’t give me the ammunition I needed to resolve my particular issues.

Up until today, my About page was 100% hardcoded; that is, there wasn’t a stitch of Textpattern code in the template used for that page. I simply wrote straight HTML to fill in my content so that I could get it placed in the precise order I wished. As I have had some correspondence with people interested in using Textpattern for their business websites, I began realizing that while hardcoding might work swell for me, it could be endlessly confusing for someone with little or no knowledge of HTML. The answer, then, was to take all the content on my About page and move them into Textpattern articles. Articles don’t require any real HTML knowledge and are easily organized and editable by the average person through the Admin panel.

Looking at my About page, you can see that there are multiple articles. For example, the title “What Follows Is A Riveting Biography” and the text that accompanys it is an article. So is “Contacting Jared”, and so on down the line. The only exception is the Contact Form, and we’ll get to that later¹.

I started transitioning my hardcoded content into articles by simply cutting and pasting each hardcoded title and its accompanying text from my page template and pasting them into a new article (Admin panel: content » write). Under the Section dropdown menu, I selected about so that each article would be assigned to the About section. Well that was easy.

Now I was at the mercy of Textpattern. As you see, I have 7 articles on that page and 1 Contact form. The Contact form is not an article, but rather a Textpattern form. As such, my dilemma was this: I could easily edit each article’s timestamp to force the articles to display in the correct order, but I wanted to insert the Contact form somewhere inbetween the end of the page (Why? I like to make things hard, that’s why). I didn’t want it to be the last item on the page. That being the case, using the standard <txp:article /> tag wasn’t going to work. That tag would simply output a list of articles assigned to the About section, allowing nothing to be easily inserted in the midst of those articles. My Contact form would have no choice but to end up either at the top or the bottom of the column.

I harrassed the fine folks at the Textpattern Forums, complaining ad nauseum about being unable to insert each individual article into a specific place on my page template. I wanted to be able to arrange the order of the articles regardless of date, section or category.

Rob came to my rescue (again) with a stunning tag: <txp:doArticle id="">. That’s right, id as in identification. Each time you create an article, it is assigned a number. You can see that number in the URL address of this very page. See? It’s 74. You can find out the article’s ID by going to your article list (Admin panel: content » articles) and rolling your mouse over the article titles.

The <txp:doArticle id=""> tag finally answered the question: How do I just plug in a single article anywhere I want? With this tag in my bag, I could now arrange my About section’s articles in any order I wished, as well as insert the Contact form inbetween any article on the page.

My hardcoded markup has now been replaced with this²:

<div id="center">
<h2>Name, Rank & Serial Number</h2>
<txp:doArticle id="67" form="static" />
<txp:doArticle id="68" form="static" />
<txp:doArticle id="69" form="static" />
<txp:doArticle id="70" form="static" />
<txp:doArticle id="71" form="static" />
<txp:doArticle id="72" form="static" />
<txp:article form="contact_form" limit="1" />
<txp:doArticle id="73" form="static" />
</div>

And there you have it. The page’s content is now stored in easily editable articles, and the order of the articles can be easily rearranged. It’s the perfect solution for my “static” pages, since
<txp:doArticle> is a tag I can use numerous times on the same page, and even transition sidebar content into articles.

i ain’t much of th’ teachin’ kind, but I hope this little discovery of mine helps others out in the way it helped me. Textpattern rocks.

Appendix

¹ The Contact form is not an article because articles are automatically wrapped in <p> tags, thus invalidating the page. Instead, I created a form (Admin panel: presentation » forms) called contact_form and pasted my Contact form’s HTML right into the form. I then inserted the block of HTML into the About page template with <txp:article form="contact_form" limit="1" />. In this case, the form variable defines the content block and limit="1" makes sure the content block only appears once. ² form="static" controls the way the article displays. By default, each article will display with a permalinked title and comments. I wanted to eliminate those two items, so I created form="static" as a new form (Admin panel: presentation » forms) and defined it like so: <h3><txp:title /></h3>
<txp:body />
<hr />

This form outputs a title with no permalink, the text body, and an <hr /> to divide the article entries.

Update, 8.19.05 – Please note that with the release of Textpattern 4.0, the <txp:doArticle /> tag has been removed. <txp:article /> will now accept the id attribute. So, <txp:doArticle id="67" form="static" /> should now be presented as <txp:article id="67" form="static" />.

Commentary

« Older writing is available in the Archives.

Side Notes

You're reading an entry from my Weblogue. My most recent writing is on the Weblogue landing page, and a full listing of all my writing is available in the Archives.

← Previous Article

Passage.

Next Article →

Neglect.

-->