不装插件!轻松搞定 WordPress HTML 表单连接数据库的秘诀

你敢相信吗?联系表单、用户注册表单,还是数据提交表单,背后的原理都是 前端 HTML 表单 + 后端数据库处理。本文会从基础概念、实际操作到注意事项,详细讲解如何在 WordPress 中创建一个 HTML 表单并把数据存入数据库。

一、为什么要自定义 HTML 表单?

WordPress 虽然有许多表单插件(如 Contact Form 7、WPForms),但在一些场景下,我们需要手写 HTML 表单:

自定义业务逻辑:比如需要收集额外字段或存储到自定义表。

性能更高:不用加载复杂插件,代码更轻量。

完全可控:前端设计与后台处理逻辑由自己决定。

二、HTML 表单的基本结构

一个最简单的 HTML 表单包括输入框、提交按钮和 form 标签,例如:

<form method=”post” action=””>
<label for=”name”>姓名:</label>
<input type=”text” name=”name” id=”name” required>

<label for=”email”>邮箱:</label>
<input type=”email” name=”email” id=”email” required>

<input type=”submit” name=”submit_form” value=”提交”>
</form>

说明:

method=”post”:用 POST 提交表单数据。

action=””:提交到当前页面。

name:字段的关键属性,提交后通过它获取值。

三、如何在 WordPress 中处理表单数据

WordPress 中,通常在 functions.php 或自定义插件中添加处理逻辑。

functions.php 文件

每个 WordPress 主题都会有一个 functions.php 文件。

你可以在这里写代码,让 WordPress 在加载主题时执行这些逻辑。

适合放一些简单的功能,比如表单数据处理。

自定义插件

如果功能比较独立、复杂,最好写成插件。

插件有单独的文件夹和 PHP 文件,不会因为换主题而丢失。

比如做一个“自定义表单收集插件”,这样代码更清晰、更安全。

1. 获取表单数据

if ( isset($_POST[‘submit_form’]) ) {
$name = sanitize_text_field($_POST[‘name’]);
$email = sanitize_email($_POST[’email’]);
}

使用 sanitize_text_field() 和 sanitize_email() 对数据进行过滤,确保安全。

2. 存入数据库

WordPress 提供了 $wpdb 对象,可以很方便地与数据库交互。

global $wpdb;
$table_name = $wpdb->prefix . “custom_form”; // 数据表名

$wpdb->insert(
$table_name,
array(
‘name’ => $name,
’email’ => $email,
‘created_at’ => current_time(‘mysql’)
)
);

说明:

$wpdb->prefix 是数据库表前缀(默认是 wp_)。

insert() 方法会把数据写入指定表。

3. 在数据库中创建表

需要先为表单创建一个存储数据的表,可以在插件激活时运行 SQL:

function create_custom_table() {
global $wpdb;
$table_name = $wpdb->prefix . “custom_form”;

$charset_collate = $wpdb->get_charset_collate();

$sql = “CREATE TABLE $table_name (
id mediumint(9) NOT NULL AUTO_INCREMENT,
name varchar(50) NOT NULL,
email varchar(100) NOT NULL,
created_at datetime DEFAULT CURRENT_TIMESTAMP NOT NULL,
PRIMARY KEY (id)
) $charset_collate;”;

require_once( ABSPATH . ‘wp-admin/includes/upgrade.php’ );
dbDelta($sql);
}
add_action(‘after_switch_theme’, ‘create_custom_table’);

这段代码会在切换主题时创建数据表。

四、在页面中显示表单

WordPress 建议通过 短代码(shortcode) 来调用表单,这样可以在任意页面嵌入。

function custom_form_shortcode() {
ob_start();
?>
<form method=”post” action=””>
<input type=”text” name=”name” placeholder=”请输入姓名”>
<input type=”email” name=”email” placeholder=”请输入邮箱”>
<input type=”submit” name=”submit_form” value=”提交”>
</form>
<?php
return ob_get_clean();
}
add_shortcode(‘custom_form’, ‘custom_form_shortcode’);

在页面中插入 [custom_form] 即可显示表单。

五、如何查看提交的数据

登录 phpMyAdmin 或数据库管理工具,找到 wp_custom_form 表,即可查看提交的数据。

如果希望在后台查看,可以写一个简单的管理页面,用 $wpdb->get_results() 把数据拉出来展示。

六、安全性与优化建议

数据过滤与验证

使用 sanitize_*() 系列函数清理输入数据。

对邮箱等特殊字段进行正则验证。

防止 CSRF 攻击
WordPress 提供了 wp_nonce_field() 与 check_admin_referer() 来保证请求安全。

分页与限制

对表单提交加频率限制,避免垃圾数据灌入。

数据展示时做分页处理,避免后台加载过慢。

考虑使用 AJAX
可以通过 AJAX (是一系列用于创建响应更快的Web应用程序的技术组合)提交表单,让页面无需刷新,提升用户体验。

七、总结

在 WordPress 中创建 HTML 表单并连接数据库,核心步骤包括:写出 HTML 表单结构 > 在 PHP 中获取并处理数据 > 使用 $wpdb 写入数据库 > 用 shortcode 在前端展示表单。

相比插件方式,自定义表单更灵活,能精准满足项目需求。虽然代码量稍大,但带来的自由度和可控性值得投入。

掌握这个流程后,你就能轻松扩展网站功能,例如自定义报名系统、问卷收集、会员信息管理等,为网站带来更多可能性!

Leave a Reply

您的电子邮箱地址不会被公开。 必填项已用 * 标注