• News
  •  
  • Tools
  •  
  • Bücher
  •  
  • Fotos
  •  
  • Impressum
  •  
  • Be social!
  • RSS
  • FaceBook
  • Google Buzz
  • Mister Wong
  • Delicious
  • Xing
  •  
 

Ein Kontaktformular für WordPress ohne PlugIn

WordPress

WordPress

Unglaublich aber wahr! Das funktioniert wirklich. Für alle die bis jetzt auf aufwendige PlugIns gesetzt haben, kann dieser Trick eine echte Alternative sein.

PlugIns machen das Blog-System nicht unbedingt schneller. Daher bin ich immer wieder auf der Suche nach Alternativen, damit wir (SEO-freundlich) schnelle Blogs erhalten.

Diesmal werden wir mit Hausmitteln ein eigenes Kontaktformular erstellen.

Als erstes brauchen wir dafür ein Template, welches wir weiter ergänzen werden.

Das Grundgerüst

Dazu habe ich Dir ein sehr einfaches Beispiel dargestellt. Natürlich kannst (und musst) Du den HTML-Code an Dein Thema anpassen, aber für den Anfang funktioniert es auch so.
Diesen Code speicherst Du am Besten in der Datei contact.php in Deinem aktiven Thema.
Achtung!
Bitte pass ein wenig auf, da ich irgendwo einen Fehler in einem PlugIn habe, wird immer ein Leerzeichen zwischen < und ?php eingefügt, dieses darfst Du nicht eingeben.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
< ?php
  /*
  Template Name: Kontaktformular
  */
 
//Form-Funktionen
 
get_header() 
?>
  <div id="wrapper">
    <div id="content">
      < ?php the_post() ?>
      <div id="post-<?php the_ID(); ?>" class="post">
        <div class="entry-form">
        </div><!-- Ende div.entry-form -->
      </div><!-- Ende div.post-->
    </div><!-- Ende div#content -->
  </div><!-- Ende div#wrapper-->
< ?php 
  get_sidebar();
  get_footer();
?>

Das Eingabeformular

Nun brauchen wir die echte Funktionalität für das Formular. Diesen Code fügst Du im innersten div-Element, zwischen <div class=”entry-form”> und </div>, ein (Zwischen Zeile #14 und #15). Auch hier ist es nur ein einfaches Formular, welches Du deinen Wünschen anpassen solltest.

15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<form action="<?php the_permalink(); ?>" id="contactForm" method="post">
  <ul>
    <li>
      <label for="contactName">Name (obligatorisch):</label>
      <input type="text" name="contactName" id="contactName" value="" />
    </li>
    <li>
      <label for="contactEmail">eMail (obligatorisch):</label>
      <input type="text" name="contactEmail" id="contactEmail" value="" />
    </li>
    <li>
      <label for="contactSubject">Betreff (obligatorisch):</label>
      <input type="text" name="contactSubject" id="contactSubject" value="" />
    </li>
    <li>
      <label for="contactMessage">Message (obligatorisch):</label>
      <textarea name="contactMessage" id="contactMessage" rows="10" cols="40"></textarea>
    </li>
    <li><button type="submit">eMail senden</button></li>
  </ul>
  <input type="hidden" name="submitted" id="submitted" value="true" />
</form>

Die Eingaben prüfen

Gleich nach dem Bemerkungsblock am Anfang des Templates, findest Du eine Zeile //Form-Funktionen (Zeile #6). Diese ersetzt Du mit dem folgenden Code, welche die echte Funktionalität für das Kontaktformular bereitstellt. Wenn Du dein Formular veränder bzw. ergänzt hast, solltest Du auch diesen Code anpassen.

6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
if(isset($_POST['submitted'])) {
  //Name ist Pflichtfeld
  if(trim($_POST['contactName']) === '') {
    $nameError = 'Bitte geben Sie den Namen ein!';
    $hasError = true;
  } else {
    $name = trim($_POST['contactName']);
  }
  //eMail-Adresse ist Pflicht
  if(trim($_POST['contactEmail']) === '')  {
    $emailError = 'Geben Sie eine eMail-Adresse ein.';
    $hasError = true;
  } else if (!eregi("^[A-Z0-9._%-]+@[A-Z0-9._%-]+\.[A-Z]{2,4}$", trim($_POST['contactEmail']))) {
    //einfache Pruefung der eMail-Adresse
    $emailError = 'Die eMail-Adresse ist ung&uuml;ltig, korrigieren Sie die Eingabe.';
    $hasError = true;
  } else {
    $eMail = trim($_POST['contactEmail']);
  }
  //Betreff ist Pflicht
  if(trim($_POST['contactSubject']) === '') {
    $subjectError = 'Geben Sie einen Betreff ein!';
    $hasError = true;
  } else {
    if(function_exists('stripslashes')) {
      $subject = stripslashes(trim($_POST['contactSubject']));
    } else {
      $subject = trim($_POST['contactSubject']);
    }
  }
  //Nachricht ist Pflichtfeld
  if(trim($_POST['contactMessage']) === '') {
    $messageError = 'Geben Sie eine Nachricht ein!';
    $hasError = true;
  } else {
    if(function_exists('stripslashes')) {
      $message = stripslashes(trim($_POST['contactMessage']));
    } else {
      $message = trim($_POST['contactMessage']);
    }
  }
  if(!isset($hasError)) {
    //Admin-eMail holen
    $emailTo = get_option('admin_email');
    $body = "Nachricht vom Blog gesendet:\n\nName: $name \neMail: $eMail \n\n".
                "Betreff: $subject \nNachricht: $message";
    $headers = 'From: '.$name.' < '.$emailTo.'>' . "\r\n" . 'Reply-To: ' . $eMail;
    mail($emailTo, $subject, $body, $headers);
    $emailSent = true;
  } else {
    //Hier werden die Fehlermeldungen ausgegeben...
  }
}

Das Formular verwenden

Jetzt ist eigentlich alles fertig. Du brauchst nur mehr das Formular im DashBoard aufrufen und einbauen. Dazu erstellst Du eine neue Seite und als Vorlage verwendest Du das neue Kontaktformular.

Weitere Posts zu diesem Thema

  • Die eMail-Adresse eines Leseres überprüfen
    WordPress Kommentare
    Erinnert ihr euch noch an den Post Ein Kontaktformular für WordPress ohne PlugIn? Klar! Zu diesem Post passt der heutige Trick. Um den Spam schon ein [...]
  • Den Gravatar des Post-Autors anzeigen

    Jetzt wird es ja schon bald zur lieben Gewohnheit, dass es auch einmal am Tag einen Tipp zu WordPress oder zumindest zur Programmierung gibt. Heute st [...]
  • PHP für WordPress
    PHP für WordPress
    Da Weihnachten in riesen Schritten naht, gibt es heute drei Geschenke (dreimal dieselben, natürlich). Ich verlose mein Buch über PHP für Wordpress. W [...]
  • Daily Code Poem #14
    Gravatar
    Wie kann ich ein Bild von Gravatar holen? Dazu bauchst Du PHP und die eMail-Adresse des Benutzers. Ansonsten ist es sehr einfach, das Bild anzuzeigen. [...]
  • Bestimmte IP-Adressen mit PHP blockieren [Code Poem #27]

    Kann ich verhindern, dass bestimmte IP-Adressen auf meine webSite zugreifen? Ja mit ein wenig PHP ist dies gar kein Problem, es können sogar mehrere I [...]
 

Der Guru 2.0 Blog lebt von Deinem Kommentar

Es existieren zwei Antworten zu diesem Post

Alex
schrieb am 29. 3. 2011 um etwa 14 Uhr:
Hallo Clemens! Ich habe schon länger mein eigenes Formular, allerdings habe ich noch ein Captcha eingebaut. ;-) Das solltest du hier vielleicht noch dazu machen. Trotzdem super das du sowas hier online stellst, da es ja, wie du bereits sagtest, nicht immer und für alles ein Plugin benötigt. Weiter so! Gruß
Biker von [web]
schrieb am 14. 9. 2011 um etwa 17 Uhr:
Hallo! Erst ein Mail - danke! Eine Frage hätte ich doch. Welche Mailing wird hier benutzt? die einfache php Mail funktion? Das wäre fatal, da ja die meisten Server, aufgrund des Headers der Mail, diese Mails aus dieser Funktion als Spam ansehen. Ich nutzte außerhalb von WP immer phpmailer. Allerdings weiß ich nicht wie ich das bei WP nutzen soll. Oder falls WP das nutzt, wie ich das anzapffen kann... über eine antwort würde ich mich freuen :-)

Es existieren zwei TrackBacks zu diesem Post

TrackBack von Weblin Avatar » Ein Kontaktformular für WordPress ohne PlugIn » Guru 2.0 › 3.0 am 30. 3. 2011 um etwa 20 Uhr[...] den Originalbeitrag weiterlesen: Ein Kontaktformular für WordPress ohne PlugIn » Guru 2.0 › 3.0 Medien zum Thema   Medien by [...]
TrackBack von GB Bilder » Ein Kontaktformular für WordPress ohne PlugIn » Guru 2.0 › 3.0 am 1. 4. 2011 um etwa 13 Uhr[...] den Beitrag weiterlesen: Ein Kontaktformular für WordPress ohne PlugIn » Guru 2.0 › 3.0 Medien zum Thema   Medien by [...]

Deine Meinung ist dem Guru 2.0 wichtig





XHTML - Du kannst diese Tags benutzen:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

 
  • Werbung

  •  
  • Diesen Post empfehlen


     

     

     

     

     
    Stumbleupon
     
    Wikio
  •  
  • Das war eine Hilfe?

  •  
  • Du brauchst Papier?

  •