Zum Inhalt springen

Eigenes Kontaktformular in HTML gebaut. Wie einbinden???

Erstellt am 13. September 2004 · 7 Antworten · letzte Antwort am 14. September 2004

Tags: Frage

Florian0815 ·

Morgen! 😃
Habe hier ein vor einiger Zeit gebasteltes und sauber aussehendes HTML-Formular liegen, das ich in meine Typo3-Seite integrieren möchte. Wíe kann ich das tun? Ich will nicht den Standard-Assistenten benutzen, da dieser nicht das liefern kann, was ich brauche.

Besten Gruß und Danke
Florian

Florian0815 ·

BITTE... ich brauche Hilfe.... 😉

Hier mal der zu nutzende Quelltext für das Formular. Dürfte mit dem Typo-Standardteil nicht so ganz abbildbar sein! 🙁

Besten Dank...
Florian

<style type="text/css">
body, table {font-family:arial;font-size:11px;color:#39495A;background-color:#F7F7FF}

td.kontakt_textarea {
	padding-top:2px;
	padding-bottom:25px;
}
td.kontakt_textarea textarea {
	border-style:solid;
	border-width:1px;
	border-color:#63717B;
	width:351px;
	height:103px;
	scrollbar-base-color:#F7F7F7;
	scrollbar-3dlight-color:#F7F7F7;
	scrollbar-arrow-color:#F7F7F7;
	scrollbar-darkshadow-color:#F7F7F7;
	scrollbar-face-color:#ADB6BD;
	scrollbar-highlight-color:#F7F7F7;
	scrollbar-shadow-color:#F7F7F7;
	scrollbar-track-color:#F7F7F7;
	font-family:arial;
	font-size:11px;
	color:#39495A;
}
td.kontakt_radiobuttons {
	padding-top:1px;
	padding-left:144px;
	padding-bottom:8px;
}
td.kontakt_label {
	border-top-style:solid;
	border-top-width:1px;
	border-top-color:#F7F7FF;	
	border-bottom-style:solid;
	border-bottom-width:1px;
	border-bottom-color:#F7F7FF;	
	width:149px;
	height:16px;
	background-color:#EFEBEF;
	padding-left:13px;
}
input.kontakt_input {
	border-style:solid;
	border-width:1px;
	border-color:#63717B;	
	width:202px;
	height:16px;
	font-family:arial;
	font-size:11px;
	color:#39495A;
}
td.kontakt_trenner {
	height:12px;
}
td.kontakt_pflicht {
	text-align:right;
	padding-top:11px;
	padding-bottom:14px;
}
</Style>

<form>
 <table border="0" cellspacing="0" cellpadding="0" width="351">
  <tr>
   <td colspan="2">Schreiben Sie uns:</td>
  </tr>
  <tr>
   <td class="kontakt_textarea" colspan="2"><textarea></textarea></td>
  </tr>
  <tr>
   <td colspan="2"><b>Ihre Angaben:</b></td>
  </tr>
  <tr>
   <td class="kontakt_radiobuttons" colspan="2">
    <table border="0" cellspacing="0" cellpadding="0">
     <tr>
      <td><input type="radio" name="Herr" value="Herr"></td>
      <td style="padding-left:3px;padding-right:21px">Herr</td>
      <td><input type="radio" name="Frau" value="Frau"></td>
      <td style="padding-left:3px;padding-right:21px">Frau</td>
      <td><input type="radio" name="Firma" value="Firma"></td>
      <td style="padding-left:3px">Firma</td>
     </tr>
    </table>
   </td>
  </tr>
  <tr>
   <td class="kontakt_label">Vorname:*</td>    
   <td><input class="kontakt_input" name="Vorname" type="text"></td>
  </tr>
  <tr>
   <td class="kontakt_trenner" colspan="2"></td>
  </tr>
  <tr>
   <td class="kontakt_label">Name:*</td>    
   <td><input class="kontakt_input" name="Name" type="text"></td>
  </tr>
  <tr>
   <td class="kontakt_trenner" colspan="2"></td>
  </tr>
  <tr>
   <td class="kontakt_label">E-Mail-Adresse:*</td>    
   <td><input class="kontakt_input" name="Email" type="text"></td>
  </tr>
  <tr>
   <td class="kontakt_trenner" colspan="2"></td>
  </tr>
  <tr>
   <td class="kontakt_label">Firma:*</td>    
   <td><input class="kontakt_input" name="Firma" type="text"></td>
  </tr>
  <tr>
   <td class="kontakt_trenner" colspan="2"></td>
  </tr>
  <tr>
   <td class="kontakt_label">Telefonnummer:</td>    
   <td><input class="kontakt_input" name="Telefon" type="text"></td>
  </tr>
  <tr>
   <td class="kontakt_trenner" colspan="2"></td>
  </tr>
  <tr>
   <td class="kontakt_label">Faxnummer:</td>    
   <td><input class="kontakt_input" name="Fax" type="text"></td>
  </tr>
  <tr>
   <td class="kontakt_trenner" colspan="2"></td>
  </tr>
  <tr>
   <td class="kontakt_label">Straße/Nr.:</td>    
   <td>
    <table border="0" cellspacing="0" cellpadding="0">
     <tr>
      <td><input class="kontakt_input" style="width:150px" name="Strasse" type="text"></td>
      <td class="kontakt_label" style="width:12px;padding-left:0px"></td>
      <td><input class="kontakt_input" style="width:40px" name="Nr" type="text"></td>
     </tr>
    </table>
   </td>
  </tr>
  <tr>
   <td class="kontakt_trenner" colspan="2"></td>
  </tr>
  <tr>
   <td class="kontakt_label">PLZ/Ort:</td>
   <td>
    <table border="0" cellspacing="0" cellpadding="0">
     <tr>
      <td><input class="kontakt_input" style="width:40px" name="PLZ" type="text"></td>
      <td class="kontakt_label" style="width:12px;padding-left:0px"></td>
      <td><input class="kontakt_input" style="width:150px" name="Ort" type="text"></td>
     </tr>
    </table>
   </td>
  </tr>
  <tr>
   <td class="kontakt_pflicht" colspan="2">*die gekennzeichneten Felder müssen ausgefüllt werden</td>
  </tr>
  <tr>
   <td align="right" colspan="2"><input type="image" src="senden.gif"></td>
  </tr>
 </table>
</form>
jenses ·

Hallo !

Übers Setup im Template solltest du eigentlich die gewünschte Formatierung hinbekommen :

tt_content.mailform.20.layout = <tr><td align=right>###LABEL### ...

Schau einfach mal in den TyposcriptObjectbrowser,
versuche hinter den Sinn der dortigen Einträge zu kommen,
und wandle sie ab bzw. erweitere sie entsprechend deinen Bedürfnissen.

viele Grüße
jenses

jenses ·

Eine andere Möglichkeit wäre vielleicht,
einmal die Extension EXT: mailformplus zu testen.

When you reach the limits of the standard mailform functionality of typo3 (especially when you want the form to look special) you can use this module to use your conventional HTML-formulars (as HTML-snippets) with full mailform functionality - no changes to DB structure.

Displays your conventional HTML-form

checks fields that have to be filled out ? displays error message (you can specify the fields you want to check)

sends all fields with the values to one or more emailadresses (also configrable)

if successful: it does a redirect to a page (also configurable)

full javascript support for validating fields before the form is submitted (has to be implemented manually in the HTML snippet containing the form)

current languages: englisch, german

you can send a special formatted email to the user himself e.g. "confirmation" or "thank you for your interst, we will contact you soon"

Link : http://typo3.org/extensions/repository/search/th_mailformplus/details/

viele Grüße
jenses

Florian0815 ·

Hallo jenses!
Ein weiteres Mal Danke für Deine Hilfe! Habe die Extension installiert und mein Form darin eingebaut. Leider bekomme ich im Moment die Mail gleich in zweifacher Ausführung und stehe somit schon wieder vor dem nächsten Problem. Nachdem dieses gelöst ist, werde ich mal schauen, wie ich das Teil ordentlich validieren kann.

Besten Gruß
Florian