Rumah Tutorial CMS WordTekan Membina plugin WordPress untuk membuat borang hubungan AJAX

Membina plugin WordPress untuk membuat borang hubungan AJAX

Feb 20, 2025 am 09:36 AM

Artikel ini menunjukkan membina plugin borang hubungan ajax mudah untuk WordPress. Kami akan meliputi penciptaan plugin, reka bentuk bentuk, pengendalian Ajax, dan pelaksanaan shortcode.

Konsep Utama:

  • Plugin Plugin WordPress memanfaatkan plugin untuk memperluaskan fungsi tapak. Ini termasuk membuat borang hubungan yang menggunakan AJAX untuk penyerahan data. Ini melibatkan penciptaan fail plugin, pembinaan bentuk, pengendali Ajax, dan kod pendek.
  • Pengendali Ajax adalah penting. Ia menerima input pengguna, mengesahkan data, dan menghantar pemberitahuan e -mel kepada pentadbir WordPress menggunakan wp_mail(). Pendaftaran yang betul dari pengendali Ajax adalah penting untuk memproses permintaan AJAX.
  • shortcode memudahkan integrasi bentuk. Fungsi menghasilkan HTML borang, yang kemudiannya dikemas dalam kod shortcode untuk dimasukkan mudah ke dalam jawatan dan halaman.

Penciptaan Plugin:

  1. Buat folder bernama ajaxcontactform dalam direktori WordPress wp-content/plugins anda.
  2. di dalam, buat ajaxcontactform.php dengan tajuk plugin berikut:
<?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)
*/
?>
Salin selepas log masuk
  1. Aktifkan plugin di panel admin WordPress anda.

Building a WordPress Plugin to Create an AJAX Contact Form

    Buat subfolder bernama
  1. dalam js dan tambah ajaxcontactform untuk kod AJAX anda. ajaxcontact.js

Building a WordPress Plugin to Create an AJAX Contact Form

Tambahkan kod PHP berikut untuk menentukan pemalar, skrip enqueue, dan lokalkan URL AJAX:
  1. ajaxcontactform.php
Penciptaan bentuk:
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');
Salin selepas log masuk

Fungsi berikut menghasilkan html borang hubungan:

Borang ini akan dipaparkan seperti yang ditunjukkan di bawah selepas diintegrasikan ke dalam halaman atau pos:

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
}
Salin selepas log masuk

Ajax Handler: Building a WordPress Plugin to Create an AJAX Contact Form

Fungsi ini mengendalikan permintaan AJAX, mengesahkan data, dan menghantar e -mel:

pengendalian ralat akan memaparkan mesej seperti ini:

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);
}
Salin selepas log masuk

Mendaftar pengendali Ajax:

Building a WordPress Plugin to Create an AJAX Contact Form

Daftar pengendali Ajax:

Menghantar permintaan Ajax (ajaxcontact.js):

add_action( 'wp_ajax_nopriv_ajaxcontact_send_mail', 'ajaxcontact_send_mail' );
add_action( 'wp_ajax_ajaxcontact_send_mail', 'ajaxcontact_send_mail' );
Salin selepas log masuk

Membuat kod shortcode:

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
}
Salin selepas log masuk

Borang yang lengkap akan muncul seperti berikut:

Building a WordPress Plugin to Create an AJAX Contact Form

Keselamatan, penyesuaian, dan ciri canggih:

Kod yang disediakan tidak mempunyai langkah keselamatan yang penting (pengesahan nonce). Menambah nonces sangat disyorkan untuk mencegah serangan CSRF. Penyesuaian selanjutnya (gaya dengan CSS, pengesahan yang dipertingkatkan, integrasi CAPTCHA, muat naik fail, dll) boleh dilaksanakan berdasarkan keperluan khusus. Seksyen Soalan Lazim dalam teks asal memberikan panduan mengenai peningkatan ini. Ingatlah untuk membersihkan semua input pengguna untuk mengelakkan kelemahan.

Atas ialah kandungan terperinci Membina plugin WordPress untuk membuat borang hubungan AJAX. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Cara Memulakan Blog WordPress: Panduan Langkah demi Langkah untuk Pemula Cara Memulakan Blog WordPress: Panduan Langkah demi Langkah untuk Pemula Apr 17, 2025 am 08:25 AM

Blog adalah platform yang ideal untuk orang ramai untuk menyatakan pendapat, pendapat dan pendapat mereka dalam talian. Ramai pemula bersemangat untuk membina laman web mereka sendiri tetapi teragak -agak untuk bimbang tentang halangan teknikal atau isu kos. Walau bagaimanapun, apabila platform terus berkembang untuk memenuhi keupayaan dan keperluan pemula, kini mula menjadi lebih mudah dari sebelumnya. Artikel ini akan membimbing anda langkah demi langkah bagaimana untuk membina blog WordPress, dari pemilihan tema untuk menggunakan plugin untuk meningkatkan keselamatan dan prestasi, membantu anda membuat laman web anda dengan mudah. Pilih topik dan arah blog Sebelum membeli nama domain atau mendaftarkan tuan rumah, sebaiknya mengenal pasti topik yang anda rancangkan. Laman web peribadi boleh berputar di sekitar perjalanan, memasak, ulasan produk, muzik atau hobi yang mencetuskan minat anda. Memfokuskan pada bidang yang anda benar -benar berminat dapat menggalakkan penulisan berterusan

Cara Melaraskan Senarai Artikel WordPress Cara Melaraskan Senarai Artikel WordPress Apr 20, 2025 am 10:48 AM

Terdapat empat cara untuk menyesuaikan senarai artikel WordPress: Gunakan pilihan tema, gunakan plugin (seperti pesanan jenis pos, senarai pos WP, barangan boxy), gunakan kod (tambah tetapan dalam fail fungsi.php), atau ubah suai pangkalan data WordPress secara langsung.

Cara memaparkan kategori kanak -kanak di halaman arkib kategori induk Cara memaparkan kategori kanak -kanak di halaman arkib kategori induk Apr 19, 2025 pm 11:54 PM

Adakah anda ingin tahu cara memaparkan kategori kanak -kanak di halaman arkib kategori induk? Apabila anda menyesuaikan halaman arkib klasifikasi, anda mungkin perlu melakukan ini untuk menjadikannya lebih berguna kepada pelawat anda. Dalam artikel ini, kami akan menunjukkan kepada anda bagaimana untuk memaparkan kategori kanak -kanak dengan mudah di halaman arkib kategori induk. Mengapa subkategori muncul di halaman arkib kategori induk? Dengan memaparkan semua kategori kanak -kanak di halaman arkib kategori induk, anda boleh menjadikannya kurang generik dan lebih berguna kepada pelawat. Sebagai contoh, jika anda menjalankan blog WordPress mengenai buku dan mempunyai taksonomi yang disebut "tema", anda boleh menambah sub-taksonomi seperti "novel", "bukan fiksyen" supaya pembaca anda dapat

Cara mendapatkan log masuk maklumat pengguna di WordPress untuk hasil yang diperibadikan Cara mendapatkan log masuk maklumat pengguna di WordPress untuk hasil yang diperibadikan Apr 19, 2025 pm 11:57 PM

Baru -baru ini, kami menunjukkan kepada anda bagaimana untuk mencipta pengalaman peribadi untuk pengguna dengan membenarkan pengguna menyimpan jawatan kegemaran mereka di perpustakaan yang diperibadikan. Anda boleh mengambil hasil yang diperibadikan ke tahap yang lain dengan menggunakan nama mereka di beberapa tempat (iaitu, skrin selamat datang). Nasib baik, WordPress menjadikannya sangat mudah untuk mendapatkan maklumat mengenai pengguna log masuk. Dalam artikel ini, kami akan menunjukkan kepada anda bagaimana untuk mendapatkan maklumat yang berkaitan dengan pengguna yang sedang dilog masuk. Kami akan menggunakan get_currentuserInfo ();  fungsi. Ini boleh digunakan di mana sahaja dalam tema (header, footer, sidebar, template halaman, dll.). Agar ia berfungsi, pengguna mesti dilog masuk. Oleh itu, kita perlu menggunakan

Adakah WordPress mudah untuk pemula? Adakah WordPress mudah untuk pemula? Apr 03, 2025 am 12:02 AM

WordPress mudah untuk pemula bermula. 1. Selepas log masuk ke latar belakang, antara muka pengguna adalah intuitif dan papan pemuka mudah menyediakan semua pautan fungsi yang diperlukan. 2. Operasi asas termasuk mencipta dan mengedit kandungan. Editor WYSIWYG memudahkan penciptaan kandungan. 3. Pemula boleh mengembangkan fungsi laman web melalui pemalam dan tema, dan lengkung pembelajaran wujud tetapi boleh dikuasai melalui amalan.

Cara menyusun jawatan melalui tarikh tamat tempoh di WordPress Cara menyusun jawatan melalui tarikh tamat tempoh di WordPress Apr 19, 2025 pm 11:48 PM

Pada masa lalu, kami telah berkongsi cara menggunakan plugin postexpirator untuk tamat tempoh di WordPress. Nah, apabila membuat laman web Senarai Aktiviti, kami mendapati plugin ini sangat berguna. Kami boleh memadamkan senarai aktiviti yang telah tamat tempoh dengan mudah. Kedua, terima kasih kepada plugin ini, ia juga sangat mudah untuk menyusun jawatan dengan tarikh tamat tempoh. Dalam artikel ini, kami akan menunjukkan kepada anda bagaimana untuk menyusun jawatan melalui tarikh tamat tempoh di WordPress. Kod yang dikemas kini untuk mencerminkan perubahan dalam plugin untuk menukar nama medan tersuai. Terima kasih Tajim kerana memberitahu kami dalam komen. Dalam projek khusus kami, kami menggunakan acara sebagai jenis pos tersuai. Sekarang

Cara memaparkan kiraan pertanyaan dan masa pemuatan halaman di WordPress Cara memaparkan kiraan pertanyaan dan masa pemuatan halaman di WordPress Apr 19, 2025 pm 11:51 PM

Salah satu pengguna kami meminta laman web lain bagaimana untuk memaparkan bilangan pertanyaan dan masa pemuatan halaman di footer. Anda sering melihat ini di kaki laman web anda, dan ia mungkin memaparkan sesuatu seperti: "64 pertanyaan dalam 1.248 saat". Dalam artikel ini, kami akan menunjukkan kepada anda bagaimana untuk memaparkan bilangan pertanyaan dan masa pemuatan halaman di WordPress. Cukup tampal kod berikut di mana sahaja yang anda suka dalam fail tema (mis. Footer.php). pertanyaan

Cara mengautomasikan WordPress dan media sosial dengan IFTTT (dan banyak lagi) Cara mengautomasikan WordPress dan media sosial dengan IFTTT (dan banyak lagi) Apr 18, 2025 am 11:27 AM

Adakah anda mencari cara untuk mengautomasikan laman web WordPress dan akaun media sosial anda? Dengan automasi, anda akan dapat berkongsi catatan blog atau kemas kini secara automatik di Facebook, Twitter, LinkedIn, Instagram dan banyak lagi. Dalam artikel ini, kami akan menunjukkan kepada anda bagaimana untuk mengautomasikan WordPress dan media sosial dengan mudah menggunakan IFTTT, Zapier, dan Automator Uncanny. Mengapa mengautomasikan WordPress dan media sosial? Automatikkan WordPre anda

See all articles