How Do I make My Template Work?

dada78 · 2005-11-06 22:27:40

How Do I make my custom designed templates work? I am new to textpattern and read through the textbook and manual but I am still not sure how to accomplish the following:

All I want to do is display is an excerpt of an article (where the dummy text is right now) on the index page (default template) and then set up the archive page so that it looks basically the same except that it shows the full article and comments and a comment form (as in the html structure).

What do I need to do to make these layouts work with textpattern? I am at a loss…

THIS IS THE DEFAULT PAGE CODE:

<code>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1” />
<title>Untitled Document</title>
<link href=“Templates/Hirschen/css/NewCSS/main.css” rel=“stylesheet” type=“text/css” />
</head>
<body>
<div id=“wrapper”> <div id=“container”> <div id=“header”> </div> <!— menu area begin —> <div id=“navi_area”> <div id=“navi_border”> <div id=“main_navicont”> <ul> <li><a href=“index.php?option=com_weblinks&Itemid=22”>Links</a></li> <li><a href=“index.php?option=com_contact&Itemid=3” >Contact Us</a></li> <li><a href=“index.php?option=com_content&task=section&id=1&Itemid=2”>News</a></li> <li><a href=“index.php”>Home</a></li> </ul> </div> </div> </div> <!— menu area end —> <!— post area begin —> <div id=“post”> <h1>Heading </h1> <div id=“date”>Friday, 09 September 2005</div> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum est eu mauris. In volutpat blandit felis. Suspendisse eget pede. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Quisque sed arcu. Aenean purus nulla, condimentum ac, pretium at, commodo sit amet, turpis. Aenean lacus. Utin justo. Ut viverra dui vel ante. Duis imperdiet porttitor mi. Maecenas at lectus eu justo porta tempus. Cras fermentum ligula non purus. Duis id orci non magna rutrum bibendum. Mauris tincidunt, massa in rhoncus consectetuer, lectus dui ornare enim, ut egestas ipsum purus id urna. Vestibulum volutpat porttitor metus.</p>
<!— post comment & continue reading start —>
<div class=“comment-box”>
<ul>
<div class=“comment-left”><li><a href=“http://www.hirschen-newyork.com/article/1/first-post#comment”>Comment</a></li></div>
<div class=“reading-right”><li><a href=“http://www.hirschen-newyork.com/article/1/first-post” title=“Permanent link to this article”>Continue Reading…</a></li>
</div>
</ul>
</div>
<!— post comment & continue reading end —>
</div>
<!— post area end —> <!— side navi start —> <div id=“sidebar”> <h2>Search this site</h2> <form action=“http://www.hirschen-newyork.com/” method=“get”> <input type=“text” name=“q” value=”“ size=“15” /><input type=“submit” value=“go” /></form> <div id=“categories”>
<h2>Categories</h2>
<ul>
<li><a href=“http://www.hirschen-newyork.com/category/hope-for-the-future/”>hope for the future</a></li>
<li><a href=“http://www.hirschen-newyork.com/category/meaningful-labor/”>meaningful labor</a></li>
<li><a href=“http://www.hirschen-newyork.com/category/reciprocal-affection/”>reciprocal affection</a></li>
</ul>
</div> <div id=“links”> <h2>Links</h2> <ul> <li><a href=“http://textpattern.net” title=”“>TextBook</a></li> <li><a href=“http://textpattern.com” title=”“>Textpattern</a></li> <li><a href=“http://textpattern.org” title=”“>Txp Resources</a></li> </ul> </div>
</div>
<!— side navi end —>
<!— footer start —>
<div id=“footer”>footer</div>
<!— footer end —>
</div>
</div>
</body>
</html>
</code>

AND THIS IS THE ARCHIVE PAGE CODE:

<code>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1” />
<title>: First Post</title>
<link href=“Templates/Hirschen/css/NewCSS/archive_w_form.css” rel=“stylesheet” type=“text/css” />
</head>
<body> <div id=“wrapper”> <div id=“container”> <div id=“header”> </div> <!— menu area begin —>
<div id=“navi_area”>
<div id=“navi_border”>
<div id=“main_navicont”> <ul> <li><a href=”#”>Home</a></li> <li><a href=”#”>News</a></li> <li><a href=”#”>Links</a></li> <li><a href=”#”>Contact</a></li> </ul> </div> </div> </div> <!— menu area end —>
<!— post area begin —>
<div id=“post”>
<h1><a href=“http://www.hirschen-newyork.com/article/1/first-post” title=“Permanent link to this article”>First Post</a></h1> <div id=“date”>Friday, 09 September 2005</div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec rutrum est eu mauris. In volutpat blandit felis. Suspendisse eget pede. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Quisque sed arcu. Aenean purus nulla, condimentum ac, pretium at, commodo sit amet, turpis. Aenean lacus. Ut in justo. Ut viverra dui vel ante. Duis imperdiet porttitor mi. Maecenas at lectus eu justo porta tempus. Cras fermentum ligula non purus. Duis id orci non magna rutrum bibendum. Mauris tincidunt, massa in rhoncus consectetuer, lectus dui ornare enim, ut egestas ipsum purus id urna. Vestibulum volutpat porttitor metus. Donec congue vehicula ante.</p>
<div class=“comment-container”>
<ul>
<li><a href=“http://example.com” title=“example.com”>Donald Swain</a></li>
<li>Jul 22, 03:11 PM</li>
</ul>
<p>I enjoy your site very much.</p>
</div>
<fieldset> <p>* Required fields. Your e-mail address will not be published on this site</p> <p><label>Name*</label>
<input type=“text” name=“name” value=”“ size=“25” class=“comment_name_input” tabindex=“2” /></p>
<p><label>Mail*</label>
<input type=“text” name=“email” value=”“ size=“25” class=“comment_email_input” tabindex=“3” /></p>
<p><label>Website</label><input type=“text” name=“web” value=”“ size=“25” class=“comment_web_input” tabindex=“4” /></p>
<p><label>Comments</label>
<textarea class=“txpCommentInputMessage” name=“message” cols=“25” rows=“5” tabindex=“1”></textarea></p>
<p><input type=“submit” name=“preview” value=“preview” class=“button” /></p>
</fieldset>
<p><input type=“hidden” name=“parentid” value=“1” /></p>
<p><input type=“hidden” name=“backpage” value=”/article/1/first-post” /></p>
</div>
<!— side navi start —>
<div id=“sidebar”>
<h2>Search this site</h2>
<form action=“http://www.hirschen-newyork.com/” method=“get”> <br /><input type=“text” name=“q” value=”“ size=“15” /><input type=“submit” value=“go” /></form>
<div id=“categories”>
<h2>Categories</h2>
<ul class=“category_list”><li><a href=“http://www.hirschen-newyork.com/category/hope-for-the-future/”>hope for the future</a></li>
<li><a href=“http://www.hirschen-newyork.com/category/meaningful-labor/”>meaningful labor</a></li>
<li><a href=“http://www.hirschen-newyork.com/category/reciprocal-affection/”>reciprocal affection</a></li></ul>
</div>
<div id=“links”>
<h2>Links</h2>
<ul class=“linklist”><li><a href=“http://textpattern.net” title=”“>TextBook</a></li>
<li><a href=“http://textpattern.com” title=”“>Textpattern</a></li>
<li><a href=“http://textpattern.org” title=”“>Txp Resources</a></li></ul>
</div>
</div>
<!— side navi end —>
<!— footer start —>
<div id=“footer”>Ported by <a href=“http://www.hirschen-newyork.com/” title=“Ported by Hirschen New York City Trend Office” >ZGH NYC Trend Office</a></div>
<!— footer end —>
</div>
</div>
</body>
</html>
</code>

THANKS SO MUCH FOR YOUR HELP — I just need to get a grasp of it so I know the concept of how it works.

Last edited by dada78 (2005-11-06 22:28:29)

alexandra · 2005-11-06 23:32:54

Basically the code for the article default form is:

so you get the articles excerpt if it is excerpted and the full article if it is not excerpted.

Last edited by alexandra (2005-11-06 23:33:20)

thebombsite · 2005-11-06 23:34:47

Your articles are called by the <code><txp:article limit=“5” /></code> tag. The article tag uses the default FORM template to format your article. To use excerpts you should change this FORM to something similar to:-

<code>
<h2><txp:permlink><txp:title /></txp:permlink></h2>
<div class=“author”>Filed under: <txp:category1 title=“1” link=“1” /> by <txp:author /> on <txp:posted /></div>
<div class=“post”>
<txp:if_article_list>
<txp:if_excerpt>
<txp:excerpt />
<txp:permlink>But there’s more</txp:permlink>
<txp:else />
<txp:body />
</txp:if_excerpt>
<txp:else />
<txp:body />
</txp:if_article_list>
<p><txp:comments_invite /></p>
</div></code>

You may want to change the header and class names to your own but remember that you should not use ids as this code will be repeated on your page and become invalid. This code will show an excerpt if there is one on the front-page (default) otherwise it will show the full body and it always shows the full body on the comments page (archive).

Where you currently have all your “post” code you need to replace it with the article tag. The limit attribute determines how many articles/excerpts are displayed on a single page when viewing a list (front-page).

To go one step further you could take all your horizontal menu code and create a new “misc” type FORM template for it then call it into the page template with <code><txp:output_form form=“NewFormName” /></code> tag which makes it easier to place into all your page templates when you create them.

The archive page template will look very similar to the default page template though you won’t need the “limit” attribute as it only shows a single article anyway.

Your sidebar code could also have it’s own FORM template and should be above your content for better accessibility.

dada78 · 2005-11-07 00:01:01

Thanks for your help guys. One question regarding ids:
So you are saying that I can’t use any ids anywhere in my code? Do I need to exchange all my ids for classes in order for it to work?
Thanks,
Dada

thebombsite · 2005-11-07 00:12:40

It will work but it will not “validate” as you can only use an id once on a single page. You can use it on several different pages but only once on each. For example you could surround your top nav with an id as it only appears once on any page but your article code will repeat in a listing (front-page) as many times as you set the “limit” to, so this code would require classes to validate.

dada78 · 2005-11-07 01:49:34

Thanks, I have changed some ids.

But what I still don’t understand is WHERE in my archive code I would need to put the tags for the comments and comment input form? And what tags I need ot use to accomplish this?

I really just want the archive page to be basically the same as the default page, only that it displays the full article and underneath the comments and the comment input form.

Puhh. My head is spinning…

thebombsite · 2005-11-07 03:21:58

If you have “auto append comments” switched on in Advanced Preferences then simply having the “comment_invite” tag in your default FORM will automatically load the comment list and comment entry form. It is controlled by the “comments_display” FORM. If you have switched auto append off (why?) then you need to place the tags in comments_display into your template.

dada78 · 2005-11-07 03:38:59

Thanks so much for your help! I made it work with the tags you gave me.
But I still have one problem making the search form work and the comment form.

My code that I put in the comment_form is as follows:

<code>
<fieldset> <p>* Required fields. Your e-mail address will not be published on this site</p> <p><label>Name*</label><txp:comment_name_input /></p>
<p><label>Mail*</label><txp:comment_email_input /></p>
<p><label>Website</label><txp:comment_web_input /></p>
<p><label>Comments</label><txp:comment_message_input /></p>
<p><txp:comment_preview /><txp:comment_submit /></p>
</fieldset>
</code>

But it doesn’t seem to work and I can’t figure out what the problem might be.

Textpattern CMS

Textpattern CMS support forum

#1 2005-11-06 22:27:40

How Do I make My Template Work?

#2 2005-11-06 23:32:54

Re: How Do I make My Template Work?

#3 2005-11-06 23:34:47

Re: How Do I make My Template Work?

#4 2005-11-07 00:01:01

Re: How Do I make My Template Work?

#5 2005-11-07 00:12:40

Re: How Do I make My Template Work?

#6 2005-11-07 01:49:34

Re: How Do I make My Template Work?

#7 2005-11-07 03:21:58

Re: How Do I make My Template Work?

#8 2005-11-07 03:38:59

Re: How Do I make My Template Work?

Board footer