构建WordPress插件以创建AJAX联系表

>本文演示了为WordPress构建简单的AJAX触点表插件。 我们将介绍插件创建，表单设计，Ajax处理和短码实现。

密钥概念：

WordPress插件开发利用插件来扩展站点功能。这包括创建使用AJAX进行数据提交的联系表。 这涉及插件文件创建，形式构造，Ajax处理程序和快捷代码。
• > Ajax处理程序至关重要。它接收用户输入，验证数据，并使用
向WordPress管理员发送电子邮件通知。 Ajax处理程序的正确注册对于处理AJAX请求至关重要。
• > wp_mail()短代码简化了形式的集成。一个函数会生成表单的HTML，然后将其封装在短码中，以便于插入帖子和页面。
插件创建：

在您的WordPress

目录中创建一个名为

的文件夹。
1. > ajaxcontactform>内部，创建wp-content/plugins>带有以下插件标头：>
2. ajaxcontactform.php
激活WordPress Admin面板中的插件。

>

<code class="language-php"><?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)
*/
?></code>

在内创建一个名为

的子文件夹，并为您的ajax代码添加

。
4. jsajaxcontactform ajaxcontact.js

>将以下php代码添加到

中以定义常数，构建脚本并本地化ajax url：

5. ajaxcontactform.php形式创建：

<code class="language-php">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');</code>

以下功能生成联系表的HTML：

该表格将显示为集成到页面或帖子后所示：

<code class="language-php">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
}</code>

ajax处理程序：

此函数处理AJAX请求，验证数据并发送电子邮件：>

错误处理将显示这样的消息：

注册Ajax处理程序：

<code class="language-php">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);
}</code>

>

注册Ajax处理程序：

>发送ajax请求（ajaxcontact.js）：

>

创建快捷代码：

<code class="language-php">add_action( 'wp_ajax_nopriv_ajaxcontact_send_mail', 'ajaxcontact_send_mail' );
add_action( 'wp_ajax_ajaxcontact_send_mail', 'ajaxcontact_send_mail' );</code>

完整的表格将显示如下：

安全性，自定义和高级功能：>

提供的代码缺乏关键的安全措施（NONCE验证）。 强烈建议使用Nonces来防止CSRF攻击。 可以根据特定要求实现进一步的自定义（使用CSS，增强验证，CAPTCHA集成，文件上传等）。 原始文本中的常见问题解答部分提供了有关这些增强功能的指导。 切记对所有用户输入进行消毒以防止漏洞。

以上是构建WordPress插件以创建AJAX联系表的详细内容。更多信息请关注PHP中文网其他相关文章！