suchen
HeimCMS-TutorialWordDrücken SieErstellen eines WordPress -Plugins, um ein AJAX -Kontaktformular zu erstellen

Dieser Artikel zeigt, dass das Erstellen eines einfachen Ajax -Kontaktformulars für WordPress erstellt wird. Wir werden die Erstellung von Plugin, das Formell Design, das AJAX -Handling und die Kurzzeitimplementierung abdecken.

Schlüsselkonzepte:

  • WordPress -Plugin -Entwicklung nutzt Plugins, um die Standortfunktionalität zu erweitern. Dies umfasst das Erstellen von Kontaktformularen, die AJAX für die Datenübermittlung verwenden. Dies beinhaltet die Erstellung von Plugin -Datei, Formularkonstruktion, einen Ajax -Handler und einen Shortcode.
  • Der Ajax -Handler ist entscheidend. Es empfängt Benutzereingaben, validiert Daten und sendet E -Mail -Benachrichtigungen an den WordPress -Administrator mit wp_mail(). Die ordnungsgemäße Registrierung des AJAX -Handlers ist für die Bearbeitung von AJAX -Anforderungen unerlässlich.
  • Shortcodes vereinfachen die Formintegration. Eine Funktion erzeugt das HTML des Formulars, das dann in einem Shortcode für einfache Einfügung in Posts und Seiten eingekapselt wird.

Plugin -Erstellung:

  1. Erstellen Sie einen Ordner mit dem Namen ajaxcontactform in Ihrem WordPress wp-content/plugins -Verzeichnis.
  2. im Inneren erstellen ajaxcontactform.php mit dem folgenden Plugin -Header:
<?php
/*
Plugin Name: Ajax Contact Form
Plugin URI:  (Your Plugin URI)
Description: A simple contact form using AJAX.
Author: Abbas Suterwala
Version: 1.0
Author URI: (Your Author URI)
*/
?>
  1. Aktivieren Sie das Plugin in Ihrem WordPress -Administratorfeld.

Building a WordPress Plugin to Create an AJAX Contact Form

  1. Erstellen Sie einen Unterordner namens js innerhalb ajaxcontactform und fügen Sie ajaxcontact.js für Ihren Ajax -Code hinzu.

Building a WordPress Plugin to Create an AJAX Contact Form

  1. Fügen Sie den folgenden PHP -Code zu ajaxcontactform.php hinzu, um Konstanten zu definieren, Skripte zu engagieren und die AJAX -URL zu lokalisieren:
define('ACFSURL', WP_PLUGIN_URL."/".dirname( plugin_basename( __FILE__ ) ) );
define('ACFPATH', WP_PLUGIN_DIR."/".dirname( plugin_basename( __FILE__ ) ) );

function ajaxcontact_enqueuescripts() {
    wp_enqueue_script('ajaxcontact', ACFSURL.'/js/ajaxcontact.js', array('jquery'));
    wp_localize_script( 'ajaxcontact', 'ajaxcontactajax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
}
add_action('wp_enqueue_scripts', 'ajaxcontact_enqueuescripts');

Form Erstellung:

Die folgende Funktion erzeugt das HTML des Kontaktformulars:

function ajaxcontact_show_contact() {
?>
<div>
    <div style="background-color:https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bE6E6FA ;color:blue;"></div>
    <input type="text" id="ajaxcontactname" placeholder="Name"><br>
    <input type="email" id="ajaxcontactemail" placeholder="Email"><br>
    <input type="text" id="ajaxcontactsubject" placeholder="Subject"><br>
    <textarea id="ajaxcontactcontents" placeholder="Message"></textarea><br>
    <a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b" onclick="ajaxformsendmail(this.form);" style="cursor: pointer">Send Mail</a>
</div>
<?php
}

Dieses Formular wird wie unten gezeigt angezeigt, nachdem sie in eine Seite oder einen Beitrag integriert wurde:

Building a WordPress Plugin to Create an AJAX Contact Form

AJAX -Handler:

Diese Funktion übernimmt die AJAX -Anforderung, validiert Daten und sendet die E -Mail:

function ajaxcontact_send_mail() {
    $results = '';
    $error = 0;
    $name = isset($_POST['acfname']) ? sanitize_text_field($_POST['acfname']) : '';
    $email = isset($_POST['acfemail']) ? sanitize_email($_POST['acfemail']) : '';
    $subject = isset($_POST['acfsubject']) ? sanitize_text_field($_POST['acfsubject']) : '';
    $contents = isset($_POST['acfcontents']) ? wp_kses_post($_POST['acfcontents']) : '';
    $admin_email = get_option('admin_email');

    if (!is_email($email)) {
        $results = $email." :email address is not valid.";
        $error = 1;
    } elseif (empty($name)) {
        $results = "Name is invalid.";
        $error = 1;
    } elseif (empty($subject)) {
        $results = "Subject is invalid.";
        $error = 1;
    } elseif (empty($contents)) {
        $results = "Content is invalid.";
        $error = 1;
    }

    if ($error == 0) {
        $headers = 'From: ' . $email . "\r\n";
        if (wp_mail($admin_email, $subject, $contents, $headers)) {
            $results = "*Thanks for your mail.";
        } else {
            $results = "*The mail could not be sent.";
        }
    }
    die($results);
}

Fehlerbehandlung zeigt eine Meldung wie folgt an:

Building a WordPress Plugin to Create an AJAX Contact Form

Registrieren Sie den Ajax -Handler:

Registrieren Sie den Ajax -Handler:

add_action( 'wp_ajax_nopriv_ajaxcontact_send_mail', 'ajaxcontact_send_mail' );
add_action( 'wp_ajax_ajaxcontact_send_mail', 'ajaxcontact_send_mail' );

Senden der AJAX -Anforderung (ajaxcontact.js):

function ajaxformsendmail(form) {
    jQuery.ajax({
        type: 'POST',
        url: ajaxcontactajax.ajaxurl,
        data: {
            action: 'ajaxcontact_send_mail',
            acfname: jQuery('https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bajaxcontactname').val(),
            acfemail: jQuery('https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bajaxcontactemail').val(),
            acfsubject: jQuery('https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bajaxcontactsubject').val(),
            acfcontents: jQuery('https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bajaxcontactcontents').val()
        },
        success: function(data, textStatus, XMLHttpRequest) {
            jQuery('https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bajaxcontact-response').html(data);
        },
        error: function(MLHttpRequest, textStatus, errorThrown) {
            alert(errorThrown);
        }
    });
    return false; // Prevent default form submission
}

Erstellen des Shortcode:

function ajaxcontact_shortcode_func( $atts ) {
    ob_start();
    ajaxcontact_show_contact();
    $output = ob_get_clean();
    return $output;
}
add_shortcode( 'ajaxcontact', 'ajaxcontact_shortcode_func' );

Das ausgefüllte Formular wird wie folgt angezeigt:

Building a WordPress Plugin to Create an AJAX Contact Form

Sicherheit, Anpassung und erweiterte Funktionen:

dem bereitgestellten Code fehlen entscheidende Sicherheitsmaßnahmen (Nonce -Überprüfung). Das Hinzufügen von Noncen wird dringend empfohlen, um CSRF -Angriffe zu verhindern. Eine weitere Anpassung (Styling mit CSS, verbesserte Validierung, CAPTCHA -Integration, Datei -Uploads usw.) kann basierend auf spezifischen Anforderungen implementiert werden. Der FAQS -Abschnitt im Originaltext enthält Anleitung zu diesen Verbesserungen. Denken Sie daran, alle Benutzereingaben zu sanieren, um Schwachstellen zu verhindern.

Das obige ist der detaillierte Inhalt vonErstellen eines WordPress -Plugins, um ein AJAX -Kontaktformular zu erstellen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Erstellen Sie WordPress -Plugins mit OOP -TechnikenErstellen Sie WordPress -Plugins mit OOP -TechnikenMar 06, 2025 am 10:30 AM

Dieses Tutorial zeigt, dass das Erstellen eines WordPress-Plugins mithilfe von OP-Prinzipien (Object-oriented Programming) erstellt wird, wodurch die Dribbble-API eingesetzt wird. Lassen Sie uns den Text für Klarheit und Zuversicht verfeinern und gleichzeitig die ursprüngliche Bedeutung und Struktur erhalten. Objektori

So übergeben Sie PHP -Daten und -ketten an JavaScript in WordPressSo übergeben Sie PHP -Daten und -ketten an JavaScript in WordPressMar 07, 2025 am 09:28 AM

Best Practices für die Übergabe von PHP -Daten an JavaScript: Ein Vergleich von wp_localize_script und wp_add_inline_script Das Speichern von Daten in statischen Zeichenfolgen in Ihren PHP -Dateien ist eine empfohlene Praxis. Wenn diese Daten in Ihrem JavaScript -Code benötigt werden, Incorporat

So einbetten und schützen Sie PDF -Dateien mit einem WordPress -PluginSo einbetten und schützen Sie PDF -Dateien mit einem WordPress -PluginMar 09, 2025 am 11:08 AM

Dieser Handbuch zeigt, wie PDF -Dateien in WordPress -Posts und Seiten mit einem WordPress -PDF -Plugin eingebettet und geschützt werden. PDFs bieten ein benutzerfreundliches, allgemein zugängliches Format für verschiedene Inhalte, von Katalogen bis zu Präsentationen. Diese Methode ens

Ist WordPress für Anfänger leicht?Ist WordPress für Anfänger leicht?Apr 03, 2025 am 12:02 AM

WordPress ist für Anfänger leicht zu beginnen. 1. Nach dem Anmeldung im Hintergrund ist die Benutzeroberfläche intuitiv und das einfache Dashboard bietet alle erforderlichen Funktionslinks. 2. Grundlegende Vorgänge umfassen das Erstellen und Bearbeiten von Inhalten. Der Wysiwyg -Editor vereinfacht die Erstellung von Inhalten. 3. Anfänger können die Website-Funktionen durch Plug-Ins und Themen erweitern, und die Lernkurve existiert, kann aber durch das Üben gemeistert werden.

Warum sollte jemand WordPress verwenden?Warum sollte jemand WordPress verwenden?Apr 02, 2025 pm 02:57 PM

Die Leute verwenden WordPress wegen ihrer Kraft und Flexibilität. 1) WordPress ist ein Open -Source -CMS mit einer starken Benutzerfreundlichkeit und Skalierbarkeit, die für verschiedene Website -Anforderungen geeignet ist. 2) Es hat reichhaltige Themen und Plugins, ein riesiges Ökosystem und eine starke Unterstützung der Gemeinschaft. 3) Das Arbeitsprinzip von WordPress basiert auf Themen, Plug-Ins und Kernfunktionen und verwendet PHP und MySQL, um Daten zu verarbeiten und die Leistungsoptimierung zu unterstützen.

Ist WordPress noch kostenlos?Ist WordPress noch kostenlos?Apr 04, 2025 am 12:06 AM

Die Kernversion von WordPress ist kostenlos, aber andere Gebühren können während der Verwendung anfallen. 1. Domainnamen und Hosting -Dienste erfordern eine Zahlung. 2. können fortgeschrittene Themen und Plug-Ins aufgeladen werden. 3.. Professionelle Dienstleistungen und fortschrittliche Funktionen können berechnet werden.

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

Heiße Werkzeuge

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

SAP NetWeaver Server-Adapter für Eclipse

SAP NetWeaver Server-Adapter für Eclipse

Integrieren Sie Eclipse mit dem SAP NetWeaver-Anwendungsserver.

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Leistungsstarke integrierte PHP-Entwicklungsumgebung

mPDF

mPDF

mPDF ist eine PHP-Bibliothek, die PDF-Dateien aus UTF-8-codiertem HTML generieren kann. Der ursprüngliche Autor, Ian Back, hat mPDF geschrieben, um PDF-Dateien „on the fly“ von seiner Website auszugeben und verschiedene Sprachen zu verarbeiten. Es ist langsamer und erzeugt bei der Verwendung von Unicode-Schriftarten größere Dateien als Originalskripte wie HTML2FPDF, unterstützt aber CSS-Stile usw. und verfügt über viele Verbesserungen. Unterstützt fast alle Sprachen, einschließlich RTL (Arabisch und Hebräisch) und CJK (Chinesisch, Japanisch und Koreanisch). Unterstützt verschachtelte Elemente auf Blockebene (wie P, DIV),

SublimeText3 Englische Version

SublimeText3 Englische Version

Empfohlen: Win-Version, unterstützt Code-Eingabeaufforderungen!