textpattern resources [ge]

Frank (bernieman.tux(a)gmail.com) mailte uns seine tabellenlose Lösung für das Kommentarfeld, welches in TXP Standardversion mit einer Tabelle realisiert wird.

Er schreibt: Da ich sicherlich nicht der Einzige bin, der auf Tabellen gänzlich verzichtet, beschreibe ich nachfolgend eine einfache Anpassung.

Um ein tabellenfreies Layout zu erhalten, muss man 2
Änderungen vornehmen. Im comment_form ersetzt man den dortigen Code durch:

<fieldset> <label class="left"><txp:text item="name" /></label>
<txp:comment_name_input /><br />

<label class="left"><txp:text item="email" /></label>
<txp:comment_email_input /><br />

<label class="left">http://</label>
<txp:comment_web_input /><br />

<label class="left"><txp:text item="message" /></label>
<txp:comment_message_input /><br />

<label for="remember"><txp:comment_remember /></label>

<txp:comments_help /><br /><br />
<txp:comment_preview />
<txp:comment_submit /><br />
</fieldset>

Der dazugehörige CSS-Fragment-Code sieht folgendermaßen aus:

label.left {
float: left;
text-align: right;
width: 5em;
margin-right: .3em;
}

input[type=text], select {
float: left;
}

input.right {
float: left;
width: auto;
clear: both;
margin-left: 5.3em;
margin-right: .3em;
}

input[type=checkbox].right,
input[type=radio].right,
input[type=submit].right {
margin-left: 6.3em;
}

input, textarea {
border: 1px solid gray;
font-family: Trebuchet MS, Verdana, Geneva, Arial, sans-serif;
color: #8278b0;
}

fieldset {
background-color: #c9c9c9;
}

form br {
clear: both;
}

Farben können natürlich, sehr leicht angepasst werden.
color: #deine Farbe (Vordergrund)
background-color: #deineFarbe (Hintergrund)

Andreas Kalt hat einen sehr interessanten Artikel über die Realisierung von benutzerfreundlichen Kommentareingaben verfaßt. Lesenswert!