A blog post from danboe.net

My Textpattern form templates

Posted Jun 6, 2005 at 06:27 PM

In the last set of articles, I identified the Textpattern plugins I use, and explained how I created the root structure of my site using sections and page templates.

As you may have noticed, all of my page templates are rather small, simple and basic. Their size is small because I take a standards-based approach to my markup, so the templates are not littered with a bunch of presentational or layout markup. I may nest a div tag here or there, but I don’t use tables and other more intrusive techniques.

The page templates are also small because they refer to a collection of Textpattern form templates, which in turn contain more markup and processing instructions for the task at hand.

What follows is a brief overview of my Textpattern forms at this point in time, for your enjoyment. If anything is unclear, please feel free to leave a comment, and I’ll try my best to elaborate.

Before proceeding, however, I think it’s helpful to understand that Textpattern supports different types of form templates, each type intended for a specific task.

Article form templates

Article form templates are processed against the content of articles.

about

This template is responsible for rendering the main content area of my about section.

  1. <div>
  2. <h1><txp:title /></h1>
  3. <txp:body />
  4. </div>
  5. Download this code: /code/textpattern/forms/about.txt

article_summary

This template renders a summarized version of the article, as seen on my home page.

  1. <div class="articlesummary">
  2. <h2><txp:permlink><txp:title /></txp:permlink></h2>
  3. <p class="posted"><txp:posted /></p>
  4. <div class="excerpt">
  5. <txp:kgr_safe_excerpt words="100" linktext="Full article &amp; comments" />
  6. <span class="more">
  7. <txp:permlink>Full article &amp; comments</txp:permlink>
  8. </span>
  9. </div>
  10. </div>
  11. Download this code: /code/textpattern/forms/article_summary.txt

default

This template is used for rendering complete versions of articles.

  1. <!--txptype:article-->
  2. <div class="articlecomplete">
  3. <h1 class="article"><txp:permlink><txp:title /></txp:permlink></h1>
  4. <p class="posted"><txp:posted /></p>
  5. <txp:body />
  6. </div>
  7. Download this code: /code/textpattern/forms/default.txt

search_results

This template renders each search result found in a site search.

  1. <dt class="article">
  2. <txp:search_result_title />
  3. </dt>
  4. <dd class="posted">
  5. <txp:search_result_date />
  6. </dd>
  7. <dd class="excerpt">
  8. <txp:search_result_excerpt />
  9. </dd>
  10. Download this code: /code/textpattern/forms/search_results.txt

Comment form Templates

Comment form templates are processed against the content of comments.

comment_form

This template contains the form used by users when they leave a new comment. Textpattern also supports a comment_popup form that opens a new window for this, but I dislike opening new windows, and I have deleted that form from my Textpattern installation.

  1. <div id="newcomment">
  2. <fieldset>
  3. <legend>Leave your comments</legend>
  4. <div class="input">
  5. name:<br /><txp:comment_name_input />
  6. </div>
  7. <div class="input">
  8. email:<br /><txp:comment_email_input />
  9. </div>
  10. <div class="input">
  11. http://<br /><txp:comment_web_input />
  12. </div>
  13. <div class="input">
  14. Comment:<br /><txp:comment_message_input />
  15. <p>Note:<a href="http://textism.com/tools/textile/">Textile</a> is available for use with your message, but all <abbr
  16. title="Hypertext Mark-up Language">HTML</abbr> will be removed.</p>
  17. </div>
  18. <div class="persist">
  19. <txp:comment_remember />
  20. </div>
  21. <div class="buttons">
  22. <txp:comment_preview />
  23. <txp:comment_submit />
  24. </div>
  25. </fieldset>
  26. </div>
  27. Download this code: /code/textpattern/forms/comment_form.txt

comments

This template is used for rendering each individual comment received.

  1. <h3>
  2. <a href="http://<txp:comment_web_input />" title="<txp:comment_web_input />">
  3. <txp:comment_name />
  4. </a>
  5. </h3>
  6. <p class="posted">
  7. <txp:comment_permlink><txp:comment_time /></txp:comment_permlink>
  8. </p>
  9. <div class="message">
  10. <txp:message />
  11. </div>
  12. Download this code: /code/textpattern/forms/comments.txt

File form templates

I don’t have much of a need for these, so I haven’t investigated them much.

files

This template is provided by Textpattern, and I don’t use it yet. I don’t really have a need at this point in time for it, and I don’t know if it’s supported yet.

  1. <txp:text item="file" />:
  2. <txp:file_download_link>
  3. <txp:file_download_name /> [<txp:file_download_size format="auto" decimals="2" />]
  4. </txp:file_download_link>
  5. <br />
  6. <txp:text item="category" />: <txp:file_download_category />
  7. <br />
  8. <txp:text item="download" />: <txp:file_download_downloads />
  9. Download this code: /code/textpattern/forms/files.txt

Link form templates

Link form templates are processed against the content of links managed by Textpattern.

links

This template is renders individual links within link lists.

  1. <txp:link />
  2. <p><txp:link_description /></p>
  3. Download this code: /code/textpattern/forms/links.txt

Miscellaneous form templates

Miscellaneous form templates can be used as holders for centralized snippets of HTML as well as for interacting with various plugins.

about_area2

This template contains the sidebar that appears in my about section.

  1. <div>
  2. <hr class="hide" />
  3. <h3>Contact Me</h3>
  4. <p>Did something I say strike a chord, miss the mark or make you smile? Perhaps you just want to get in touch, share a recipe or stop by and listen to records? Well, for the love of Pete, let me know!</p>
  5. <dl>
  6. <dt>Work:</dt>
  7. <dd>(425) 706-8064</dd>
  8. <dd><a href="mailto:danboe@microsoft.com">danboe@microsoft.com</a></dd>
  9. <dt>Home:</dt>
  10. <dd>(425) 301-0720</dd>
  11. <dd><a href="mailto:danboe@mac.com">danboe@mac.com</a></dd>
  12. <dd>Seattle (Eastlake), WA</dd>
  13. <dd class="deprecated">Seattle (Ballard), WA</dd>
  14. <dd class="deprecated">Kirkland, WA</dd>
  15. <dd class="deprecated">St. Paul, MN</dd>
  16. <dd class="deprecated">Minneapolis, MN</dd>
  17. <dd class="deprecated">West Bend, WI</dd>
  18. <dd class="deprecated">Wauwatosa, WI</dd>
  19. <dt>MSN Messenger:</dt>
  20. <dd><a href="mailto:danielboerner@hotmail.com">danielboerner@hotmail.com</a></dd>
  21. <dt>GMail:</dt>
  22. <dd><a href="mailto:danboe@gmail.com">danboe@gmail.com</a></dd>
  23. </dl>
  24. <hr class="hide" />
  25. <h3>The Bizarro Danboe</h3>
  26. <p>I guess I was too late to the party; when I went to get my preferred domain name, it was already taken.Same with my preferred hotmail account. Not one to hold a grudge, I generously link to the <a href="http://www.danboe.com">Bizarro danboe</a>. If you're here hoping to get your Houston, TX insurance needs satisfied, or you're planning to hit the fairways while in Texas, you're a click away. Like a good neighbor, Bizarro danboe is there.</p>
  27. </div>
  28. Download this code: /code/textpattern/forms/about_area2.txt

archives

This template is used to render the list of articles as appearing in the archives section.

  1. <div class="archives articles">
  2. <h1>Articles Archive</h1>
  3. <p>Read through all articles ever posted on danboe.net, or use the filter links to show articles by date or category.</p>
  4. <txp:rss_suparchive section="articles" dateformat="F Y" subdatesep=": " showsubdate="1" subdateformat="d" showcats="0" />
  5. </div>
  6. Download this code: /code/textpattern/forms/archives.txt

content_head

This template contains my standard site header, which is repeated across all pages.

  1. <txp:ob1_if_section section="about">
  2. <body id="about">
  3. </txp:ob1_if_section>
  4. <txp:ob1_if_section section="archives">
  5. <body id="archives">
  6. </txp:ob1_if_section>
  7. <txp:ob1_if_section section="articles">
  8. <body id="article">
  9. </txp:ob1_if_section>
  10. <txp:ob1_if_section section="bookmarks">
  11. <body id="bookmarks">
  12. </txp:ob1_if_section>
  13. <txp:ob1_if_section section="default">
  14. <body id="default">
  15. </txp:ob1_if_section>
  16. <txp:ob1_if_section section="search">
  17. <body id="search">
  18. </txp:ob1_if_section>
  19. <div id="wrapper">
  20. <div id="head">
  21. <p><txp:sitename />: <q><txp:site_slogan /></q></p>
  22. <div id="nav">
  23. <h2 class="hidden">Site Navigation</h2>
  24. <p class="hidden">Navigation for every section of this site.</p>
  25. <txp:mdp_sectionmenu wrap="ul" break="li" class="sections" noshow="article" home="1" order="home,archives,bookmarks,about" />
  26. <h2 class="hidden">Page Navigation</h2>
  27. <p class="hidden">Navigation for major regions of this page.</p>
  28. <ul class="hidden">
  29. <li><a href="#head">Top of page</a></li>
  30. <li><a href="#nav" title="Main site navigation">Navigation</a></li>
  31. <li><a href="#area1" title="Primary content">Primary content</a></li>
  32. <li><a href="#area2" title="Secondary content and search form">Secondary content and search form</a></li>
  33. <li><a href="#foot">Bottom of page</a></li>
  34. </ul>
  35. </div>
  36. </div>
  37. <!-- note: closing div#wrapper in different form -->
  38. Download this code: /code/textpattern/forms/content_head.txt

dtd

This template is simply a convenience if I ever wish to switch from XHTML 1.0 Strict to another schema for my markup.

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. Download this code: /code/textpattern/forms/dtd.txt

filter_archives

This template generates the “filter by date” area of the archives.

  1. <div class="filter date">
  2. <h2>Filter the Archives</h2>
  3. <p>Use the links below to filter the articles shown on this archive page to help you to find what you are looking for.Of course, you're welcome to browse the complete list as well.</p>
  4. <h3>By Month Posted</h3>
  5. <txp:rss_suparchive_menu section="articles" showcount="0" />
  6. </div>
  7. Download this code: /code/textpattern/forms/filter_archives.txt

filter_bookmarks

This template contains a list of links to my article categories. Note that I link within my bookmarks section in the hope to (one day) filter the bookmarks. Wish there was a better way that did not require me to keep this updated as categories are created or deleted, but I haven’t figured it out yet. At the time of this writing, I don’t have enough bookmarks online to worry much about it.

  1. <div class="filter category">
  2. <h3>By Category</h3>
  3. <ul>
  4. <li><a href="/bookmarks/">all</a></li>
  5. <li><a href="/bookmarks/?c=css">css</a></li>
  6. <li><a href="/bookmarks/?c=life">life</a></li>
  7. <li><a href="/bookmarks/?c=markup">markup</a></li>
  8. <li><a href="/bookmarks/?c=movies">movies</a></li>
  9. <li><a href="/bookmarks/?c=music">music</a></li>
  10. <li><a href="/bookmarks/?c=recipes">recipes</a></li>
  11. <li><a href="/bookmarks/?c=textpattern">textpattern</a></li>
  12. </ul>
  13. </div>
  14. Download this code: /code/textpattern/forms/filter_bookmarks.txt

filter_categories

This template contains a list of links to my article categories. Note that I link within my archives section to filter the archives. Wish there was a better way that did not require me to keep this updated as categories are created or delelted, but I haven’t figured it out yet.

  1. <div class="filter category">
  2. <txp:ob1_if_section section="archives,bookmarks">
  3. <h3>By Category</h3>
  4. </txp:ob1_if_section>
  5. <txp:ob1_if_section section="search">
  6. <h3>Can't Find It?</h3>
  7. <p>You can also access all articles by their category using the following links:</p>
  8. </txp:ob1_if_section>
  9. <ul>
  10. <li><a href="/archives/">all</a></li>
  11. <li><a href="/archives/?c=css">css</a></li>
  12. <li><a href="/archives/?c=life">life</a></li>
  13. <li><a href="/archives/?c=mac">mac</a></li>
  14. <li><a href="/archives/?c=markup">markup</a></li>
  15. <li><a href="/archives/?c=movies">movies</a></li>
  16. <li><a href="/archives/?c=music">music</a></li>
  17. <li><a href="/archives/?c=recipes">recipes</a></li>
  18. <li><a href="/archives/?c=textpattern">textpattern</a></li>
  19. </ul>
  20. </div>
  21. Download this code: /code/textpattern/forms/filter_categories.txt

foot

This template contains my site footer HTML, which is used on all pages. By using a form template, updating all instances is simple.

  1. <div id="foot">
  2. <h2 class="hidden">Page Navigation</h2>
  3. <p class="hidden">Navigation for major regions of this page.</p>
  4. <ul class="hidden">
  5. <li><a href="#head">Top of page</a></li>
  6. <li><a href="#nav" title="Main site navigation">Navigation</a></li>
  7. <li><a href="#area1" title="Primary content">Primary content</a></li>
  8. <li><a href="#area2" title="Secondary content and search form">Secondary content and search form</a></li>
  9. <li><a href="#foot">Bottom of page</a></li>
  10. </ul>
  11. <h2 class="hidden">Page Footer</h2>
  12. <p>This site and all content contained here is provided <q>as is</q> with no warranties, and confers no rights.</p>
  13. <p>danboe.net strives for <a href="http://validator.w3.org/check/referer" title="validates this markup of this page">XHTML 1.0 Strict</a>, <a href="http://jigsaw.w3.org/css-validator/check/referer" title="validates the CSS of this page">CSS</a> &amp;
  14. <a href="http://bobby.watchfire.com/bobby/bobbyServlet?URL=http%3A%2F%2Fwww.danboe.net&amp;output=Submit&amp;gl=sec508" title="validates the accessibility of this page">Section 508</a> validity; site is powered by <a href="http://www.textpattern.com/">TextPattern</a> and hosted by <a href="http://www.textdrive.com">TextDrive</a>.</p>
  15. </div>
  16. </div><!-- note: opening div in different form -->
  17. </body>
  18. </html>
  19. Download this code: /code/textpattern/forms/foot.txt

head

This template contains my complete HTML <head> element, which is used on all pages. By using a form template, updating all instances is simplified.

  1. <head>
  2. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  3. <title>
  4. <txp:ob1_title order="article" showsection="1" showcategory="1" separator=" | " changecase="lower" casewhere="all" searchcriteria="1" searchword="on" />
  5. </title>
  6. <meta name="description" content="danboe.net: the online journal and website for Daniel Boerner, a web developer residing in the Pacific Northwest." />
  7. <txp:if_individual_article>
  8. <txp:meta_keywords />
  9. <txp:meta_author />
  10. </txp:if_individual_article>
  11. <link rel="stylesheet"type="text/css" media="screen" href="/css/screen.css"/>
  12. <link rel="stylesheet"type="text/css" media="screen" href="/css/default/_styles.css"/>
  13. <link rel="alternate stylesheet" type="text/css" media="screen" href="/css/theme1/_styles.css" title="Theme 1" />
  14. <link rel="stylesheet"type="text/css" media="print" href="/css/print.css"/>
  15. <link rel="stylesheet"type="text/css" media="handheld" href="/css/handheld.css"/>
  16. <link rel="alternate" type="application/rss+xml" title="danboe.net articles" href="/?rss=1" />
  17. </head>
  18. Download this code: /code/textpattern/forms/head.txt

search_form

This template contains the my site search form, which I use on various pages. By using a form template, updating all instances is simple.

  1. <div class="search">
  2. <h2 class="hide">Site Search</h2>
  3. <form action="/search" method="get">
  4. <fieldset>
  5. <legend class="hide">Search danboe.net</legend>
  6. <label accesskey="s" for="q" title="Search (accesskey: s)"><em>S</em>earch:</label>
  7. <input type="text" name="q" id="q" />
  8. <input type="hidden" name="s" value="search" />
  9. </fieldset>
  10. </form>
  11. </div>
  12. Download this code: /code/textpattern/forms/search_form.txt

site_overview

This template contains a brief welcome and overview of my site’s organization, beneficial for new users.

  1. <div>
  2. <h2>First time here?</h2>
  3. <p>Welcome!danboe.net is the online home and journal for <strong>Daniel P. Boerner</strong>, a web developer currently residing in Seattle, WA and affectionately known to some as danboe.</p>
  4. <p>This site is organized in the following sections:</p>
  5. <dl>
  6. <dt><a href="/">Home page</a></dt>
  7. <dd>This page, containing excerpts of the most recent articles posted to my blog.<a href="http://en.wikipedia.org/wiki/Blog" title="Read the Wikipedia entry for blog">What is a blog?</a></dd>
  8. <dt><a href="/archives/">Articles archive</a></dt>
  9. <dd>Discover all of the articles I've ever written for this site.</dd>
  10. <dt><a href="/bookmarks/">Bookmarks</a></dt>
  11. <dd>A selection of sites, services and content I tend to visit frequently.</dd>
  12. <dt><a href="/about/">About and contact</a></dt>
  13. <dd>All about me, this website and how to get in touch.</dd>
  14. </dl>
  15. </div>
  16. Download this code: /code/textpattern/forms/site_overview.txt

syndication

This template contains my feed syndication HTML, which I use on various pages. By using a form template, updating all instances is simple.

  1. <div id="syndication">
  2. <h2>Syndication</h2>
  3. <p>Stay up to date with all of my latest articles... fresh!</p>
  4. <dl>
  5. <dt>Subscribe to my blog</dt>
  6. <dd>
  7. <a href="/?rss=1"><acronym title="Really Simple Syndication">RSS</acronym></a> and
  8. <a href="/?atom=1">Atom</a> feeds are available
  9. </dd>
  10. </dl>
  11. </div>
  12. Download this code: /code/textpattern/forms/syndication.txt

Visitor comments

1 comments

Thanks for your great articles on Textpattern. I am struggling to learn more about forms and templates. This has made it easier!

» by debbie T on Jan 21, 2006 at 01:01 PM | #

This post is closed to new comments. Thanks to everyone who commented.

About this page

This page contains a single post from Daniel Boerner's blog, of which Boot Camp + Windows Vista = no more Airport Extreme reboots is the latest post.

Are there more posts like this one?

Possibly. Within this blog, this post is categorized under danboenet and it was posted on June 6, 2005. Those would be good places to start looking for related posts.

Next post (newer)

Previous post (older)