Mobirise Tutorials

Mailscript Dynamisch mit Spamschutz

Auswahl beliebig vieler Felder eine Formulars von Mobirise

Beispiel Formular Einfach Download Tutorial Translate 

Mobirise Form Builder

Download automatisches SMTP Mailscript mit Spamschutz

Version vom 31. Oktober 2025 von PHP 5.5 bis PHP 8.x
Dieses Download enthält den PHPMailer v7.0.0 vom 15. Oktober 2025 der von hier stammt.

Downloads seit 31.10.2025: 4 x

Download SMTP Mailscript mit Spamschutz

Tutorial

Einbau Spamschutz 

Dieses Mailscript verfügt über zusätzlichen Spamschutz und ist eine erweiterte Version meines einfachen Mailscripts 

Die Anleitung ist also identisch; es muss lediglich zusätzlicher Code in das Formular eingefügt und ein JavaScript-Skript eingebunden werden.

Zum Einbau lest meine Anleitung unten.

Es ist so konzipiert, dass es mit jedem Mobirise Formular funktioniert — völlig unabhängig von Anzahl, Art oder Namen der Felder. Das Skript liest alle Formularfelder in einer Schleife automatisch aus und übergibt deren Inhalte zur weiteren Verarbeitung an die Anwendung PHPMailer, der anschließend die eigentliche E‑Mail versendet. Dadurch entfällt das manuelle Anpassen oder Vorabdefinieren von Feldnamen.

Ihr könnt alle Formulare von Mobirise verwenden, sowohl solche, die ihr bereits eingebaut habt, als auch neue. Viele möchten nicht den Drittanbieter „Formoid“ zur Verarbeitung der Formulare nutzen, da dies datenschutzrechtliche Konsequenzen haben kann. Mobirise setzt diesen Dienst nur ein, weil es selbst keine PHP‑Skripte anbietet. Mit meinem Skript könnt ihr eure Mobirise‑Formulare unverändert lassen und statt eurer E‑Mail‑Adresse einfach „mailscript-captcha.php“ als Empfänger eintragen.


Ladet euch das Skript "mailscript-captcha.php" und den derzeit aktuellen "PHPMailer" an meinem Download-Button oben herunter.

Noch ein Hinweis: Ihr könnt PHPMailer jederzeit durch die aktuelle Version ersetzen, die ihr hier findet. Ersetzt dazu einfach den gesamten Inhalt meines Verzeichnisses "PHPMailer-master" durch die Inhalte der neuen Version. PHPMailer sorgt dafür, dass die Skripte stets mit zukünftigen PHP‑Versionen kompatibel bleiben. Hier könnt ihr meine aktuelle PHP-Version einsehen.


Entpackt das ZIP Archiv und öffnet das Skript "mailscript-capcha.php" mit einem Editor wie dem Windows Notepad oder auch Notepad++

Gleich oben im Skript in den Zeilen 24 bis 29 stehen die beiden Seiten auf die nach dem Senden weitergeleitet wird. Diese Seiten legt ihr in Mobirise an und benennt sie auch wie dort beschrieben z.B. "danke.html" als Erfolgsseite oder ihr ändert diese Seitennamen im Skript entsprechend ab. Die Zeile "Betreff" wird in der E-Mail als Überschrift angezeigt. Ändert also auch euren individuellen "Betreff" anstelle von "Kontaktformular-Dynamisch"

// Danke- und Fehlerseiten
$dankeSeite = "danke.html"; // wird nach erfolgreichem Versand aufgerufen
$fehlerSeite = "fehler.html"; // wird bei Fehler aufgerufen
// Fester Betreff (da das Formular selbst keinen Betreff liefert)
$betreffEmail = "Kontaktformular-Dynamisch";


Tragt nun noch die SMTP‑Zugangsdaten eures Providers ab Zeile 179 ein. Hier mit dem Standard-Port: 465. Diese findet ihr im Kundenmenü von eurem Provider. Den alternativen Port: 587 mit Verschlüsselung: STARTTLS biete ich im Download-Skript ebenfalls als Alternative an.

// SMTP Einstellungen
$mail->isSMTP();
$mail->Host = "smtp.ionos.de";                    // SMTP-Server - hier beispielhaft die Adresse vom IONOS Server
$mail->SMTPAuth = true;                           // SMTP-Authentifizierung aktivieren
$mail->Username = "Absender@DeineDomain.de";      // SMTP-Benutzername - meist Deine E-Mail Adresse
$mail->Password = "**********";                   // SMTP-Passwort
$mail->SMTPSecure = PHPMailer::ENCRYPTION_SMTPS;  // SMTPS (TLS über Port 465)
$mail->Port = 465;

// Absender (Diese E-Mail muss beim Provider erlaubt und hinterlegt sein)
$mail->setFrom("Absender@DeineDomain.de", "Absender-Name");

// Empfänger (Du selbst)
$mail->addAddress("Empfänger@DeineDomain.de", "Empfänger-Name");


Nun speichert ihr das Skript "mailscript-captcha.php" und kopiert es zusammen mit dem gesamten Verzeichnis "PHPMailer-master" in das Stammverzeichnis eures Mobirise-Projektes.

Unabhängig davon, welches Formular ihr verwendet, ersetzt einfach die von Mobirise voreingetragene E-Mail‑Adresse durch den Namen des Mailskripts - so wie unten im Screenshot zu sehen:

mailscript-captcha.php



Hinweis:

Bitte nennt euer Eingabefeld für die E-Mail-Adresse so, dass es eindeutig erkennbar ist. Erkannt werden im Mailskript:

email, Email, EMAIL, e-mail, E-Mail, E-mail, mail, Mail, kontakt, Kontakt, kontakt_mail, kontaktMail

Nur bei Verwendung einer dieser Feldnamen kann das Skript diese Adresse automatisch als Absender (Reply-To) verwenden.


Lest weiter unten, wie ihr den zusätzlichen Spamschutz  in dieses Skript integrieren müsst.

E-Mail Action

Anstelle der E-Mail schreibt den Namen vom Mail-Skript als Aktion in das Feld

Einbau Spamschutz

Diese Variante meines Formulars enthält im Download bereits das angepasste Skript "mailscript-captcha.php". Zusätzlich müssen noch der Captcha-Code sowie ein verdecktes Honeypot Feld in das Formular eingefügt und ein JavaScript für die Rechenaufgabe eingebunden werden.

Bitte beachtet, dass die Erweiterung "Form Builder" von Mobirise möglicherweise nicht alle manuell eingefügten Formularfelder erkennt. Beim Bearbeiten über diese Erweiterung können Änderungen verloren gehen. Sichert eure Anpassungen daher zusätzlich als Skripte an einem anderen Ort, damit ihr jederzeit darauf zurückgreifen könnt.

Codes Spamschutz

  1. HTML-Code
    Kopiert den HTML-Code unten und fügt diese zusätzlichen Spamschutz-Felder vor der untersten Division <div> mit dem Button "Senden" ein:

    <div mbr-buttons="true" ...>

    Siehe auch den Screenshot vom Formular Code unten.

  2. JavaScript-Code
    Kopiert den JavaScript-Code unten und fügt das JavaScript in den Seiteneinstellungen im Bereich "End of <body> code:" ein.
HTML-Code - Bitte im "Code Editor" im Bereich "HTML Editor" vom Formular-Block vor dem "Senden" Button einfügen
<!-- Start zusätzlicher Spamschutz vor dem Button "Senden" einfügen -->



<!-- Honeypot: für echte Nutzer unsichtbar, Bots füllen es oft aus -->

<div style="position:absolute;left:-5000px;top:auto;width:1px;height:1px;overflow:hidden;" aria-hidden="true">

    <label for="website">Bitte leer lassen</label>

    <input type="text" id="website" name="website" tabindex="-1" autocomplete="off">

</div>



<!-- Rechenaufgabe (Captcha) ohne PHP, kompakt und mit Live-Fehleranzeige -->

<div class="col-lg-4 col-md-6 col-sm-8 form-group" data-for="captcha_answer">

  <label class="form-label d-block mb-1">

    Aufgabe lösen: <span id="c-op1"></span> + <span id="c-op2"></span>?

    <!-- ÄNDERUNG: Kein <br>; reservierter Platz per CSS, um Springen zu vermeiden -->

    <small id="captcha-error" class="captcha-error">Falsches Ergebnis</small>

  </label>

  <input

    type="number"

    name="captcha_answer"

    placeholder="Ergebnis eingeben *"

    required

    class="form-control no-spin"

    inputmode="numeric"

    id="captcha-answer">

</div>



<!-- Erzwungener Zeilenumbruch, damit der Senden-Button garantiert darunter bleibt -->

<div class="w-100 d-none d-lg-block"></div>



<!-- Ende zusätzlicher Spamschutz vor dem Button "Senden" einfügen -->

JavaScript-Code - Kopiert das JavaScript in den Seiteneinstellungen im Bereich "End of <body> code:"
<!-- JS generierter Captcha-Schutz, prüft Live und blockt Submit bei Fehler -->

<script>

  (function(){

    // ---------- Mini-CSS nur für Spinner & Fehlermeldung einschieben ----------

    (function injectStyle(){

      // ÄNDERUNG: .captcha-error reserviert Platz (kein Layout-Shift), Sichtbarkeit per Klasse .show

      var css = ""

        + ".no-spin::-webkit-outer-spin-button,.no-spin::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }"

        + ".no-spin{ -moz-appearance:textfield; }"

        + ".captcha-error{ display:block; height:1.25rem; line-height:1.25rem; margin-bottom: 20px; color:#000000; visibility:hidden; }"

        + ".captcha-error.show{ visibility:visible; }";

      var s = document.createElement('style');

      s.textContent = css;

      document.head.appendChild(s);

    })();



    // Initialisiert die Captcha-Logik für ein gegebenes Formular

    function initCaptcha(form){

      // Container für das Captcha-Feld suchen (falls schon vorhanden)

      var capContainer = form.querySelector('[data-for="captcha_answer"]');



      // Falls nicht vorhanden (manche Blöcke), vor dem Button neu anlegen

      if(!capContainer){

        var btnCol = form.querySelector('[mbr-buttons]');

        capContainer = document.createElement('div');

        capContainer.className = 'col-lg-4 col-md-6 col-sm-8 form-group';

        capContainer.setAttribute('data-for', 'captcha_answer');

        // vor den Button einsetzen

        if(btnCol && btnCol.parentNode){

          btnCol.parentNode.insertBefore(capContainer, btnCol);

        }else{

          // Fallback: ans Ende der dragArea

          var drag = form.querySelector('.dragArea.row') || form;

          drag.appendChild(capContainer);

        }

      }



      // Label & Input referenzieren oder erzeugen

      var label = capContainer.querySelector('label.form-label');

      if(!label){

        label = document.createElement('label');

        label.className = 'form-label d-block mb-1';

        capContainer.appendChild(label);

      }



      // Platz für Rechenaufgabe + Fehlermeldung (ÄNDERUNG: kein <br>, .captcha-error hat feste Höhe)

      label.innerHTML = 'Spamschutz: Aufgabe lösen <span id="c-op1"></span> + <span id="c-op2"></span>? '

        + '<small class="captcha-error" id="captcha-error">Falsches Ergebnis</small>';



      var input = capContainer.querySelector('input[name="captcha_answer"]');

      if(!input){

        input = document.createElement('input');

        input.type = 'number';

        input.name = 'captcha_answer';

        input.required = true;

        input.placeholder = 'Ergebnis eingeben *';

        input.className = 'form-control no-spin';

        input.setAttribute('inputmode', 'numeric');

        input.id = 'captcha-answer';

        capContainer.appendChild(input);

      }else{

        // vorhandenes Feld nur „hübsch“ machen

        input.classList.add('no-spin','form-control');

        input.setAttribute('inputmode','numeric');

        input.required = true;

        if(!input.placeholder) input.placeholder = 'Ergebnis eingeben *';

        if(!input.id) input.id = 'captcha-answer';

      }



      // Elemente für Anzeige/Fehler

      var op1El = label.querySelector('#c-op1');

      var op2El = label.querySelector('#c-op2');

      var errorEl = label.querySelector('#captcha-error');



      // Aufgabe generieren

      var op1 = Math.floor(Math.random()*9)+1;

      var op2 = Math.floor(Math.random()*9)+1;

      var sum = op1 + op2;

      op1El.textContent = op1;

      op2El.textContent = op2;



      // hidden Feld für serverseitige Prüfung anlegen/ersetzen

      var hidden = form.querySelector('input[name="captcha_sum"]');

      if(!hidden){

        hidden = document.createElement('input');

        hidden.type = 'hidden';

        hidden.name = 'captcha_sum';

        form.appendChild(hidden);

      }

      hidden.value = String(sum);



      // Validierungsfunktionen

      function isValid(){

        var val = parseInt(input.value,10);

        return Number.isInteger(val) && val === sum;

      }

      // ÄNDERUNG: Sichtbarkeit per Klasse toggeln (kein display-wechsel => kein Springen)

      function showError(show){

        if(show){

          errorEl.classList.add('show');

          input.classList.add('is-invalid');

          input.setAttribute('aria-invalid','true');

        }else{

          errorEl.classList.remove('show');

          input.classList.remove('is-invalid');

          input.removeAttribute('aria-invalid');

        }

      }



      // Live-Validierung

      ['input','change'].forEach(function(evt){

        input.addEventListener(evt, function(){

          showError(input.value !== '' && !isValid());

        });

      });



      // Form-Submit abfangen (gilt für Enter-Taste, native Submit & Mobirise)

      form.addEventListener('submit', function(e){

        // Honeypot check (falls vorhanden)

        var honey = form.querySelector('#website');

        if(honey && honey.value.trim() !== ''){

          e.preventDefault(); e.stopPropagation();

          return;

        }

        if(!isValid()){

          e.preventDefault(); e.stopPropagation();

          showError(true);

          input.focus();

          return;

        }

        // bei Erfolg Fehler verstecken

        showError(false);

      });



      // Zusätzliche Absicherung: Mobirise nutzt oft <a type="submit">

      var submitEls = form.querySelectorAll('[type="submit"]');

      submitEls.forEach(function(el){

        el.addEventListener('click', function(e){

          if(!isValid()){

            e.preventDefault(); e.stopPropagation();

            showError(true);

            input.focus();

          }

        });

      });

    }



    // Nach DOM bereit: alle relevanten Formulare initialisieren

    document.addEventListener('DOMContentLoaded', function(){

      // typischer Mobirise-Selektor: Formularname oder Klasse

      var forms = document.querySelectorAll('form[name="Formular-Dynamisch"].mbr-form.form-with-styler');

      if(forms.length === 0){

        // Fallback: alle mbr-Formulare (falls der Name später geändert wurde)

        forms = document.querySelectorAll('form.mbr-form.form-with-styler');

      }

      forms.forEach(initCaptcha);

    });

  })();

</script>

Code Editor

Neue Formular-Felder im Code Editor

© Copyright Mobirise-Tutorials.com

Datenschutz und Impressum

Google Translator
Accept all cookies to translate
Funktionale Cookies akzeptieren