主页/WordPress笔记/博客文章/综合文章/如何在你的网站上显示 WordPress 表单条目(两种方法)

如何在你的网站上显示 WordPress 表单条目(两种方法)

Bug编译狮

Bug编译狮

要展示WordPress表单条目,你可以采用两种不同的方法:使用自定义字段和使用插件。下面是这两种方法的详细说明、示例代码以及如何实现的效果。

方法一:使用自定义字段

步骤:

  1. 创建自定义字段:首先,在WordPress后台的“设置” -> “通用”菜单下,点击“添加新字段”,然后选择“文本”类型。
  2. 填写字段信息:在弹出的窗口中,输入表单项名(例如“联系人姓名”),并设置其描述(如“请提供您的姓名”)。保存后,该字段会出现在WordPress编辑页面的右侧。
  3. 显示表单项:在文章或页面编辑器中,找到你想要插入表单项的位置,点击右键选择“插入表单项”。从列表中选择刚刚创建的自定义字段。

效果:

当你在文章或页面中插入这个表单项时,它会在页面底部显示一条带有提示信息的空行,用户可以通过点击链接来查看所有表单项的信息。

示例代码:

// 添加一个名为 "联系人姓名" 的自定义字段到文章页
function add_custom_field() {
    global $post;
    if (isset($post->ID) && is_page()) { // 确保是在文章页面
        ?>
        <div class="custom-field">
            <label for="<?php echo esc_attr( 'contact_name' ); ?>">联系人姓名:</label>
            <input type="text" name="contact_name" id="<?php echo esc_attr( 'contact_name' ); ?>" placeholder="请输入您的姓名">
        </div>
        <?php
    }
}
add_action('admin_init', 'add_custom_field'); // 在后台初始化函数中注册此函数

// 使用自定义字段
function display_custom_field() {
    global $post;
    if ($post->post_type == 'page') {
        $contact_name = get_post_meta($post->ID, 'contact_name', true);
        if (!empty($contact_name)) {
            echo '<h2>Contact Name:</h2>';
            echo '<p>' . $contact_name . '</p>';
        } else {
            echo '<p>No contact information provided.</p>';
        }
    }
}
add_shortcode('display_contact_info', 'display_custom_field');

如何使用:

在文章或页面中插入 [display_contact_info] 指令,它会显示相应的表单项信息。

这种方法简单易用,但缺点是只适用于固定位置的内容,不能动态生成。

方法二:使用插件

插件推荐:

  • Contact Form 7: 这个插件提供了强大的表单功能,可以与WordPress无缝集成。
  • WP Forms: 另一个非常流行的插件,支持多种表单元素,包括多语言支持和邮件验证等功能。

步骤:

  1. 安装插件:在WordPress后台的“插件”部分搜索并安装上述提到的插件。
  2. 配置表单:根据插件的界面配置表单,添加所需字段。
  3. 发布表单:保存表单后,确保已启用表单提交选项。

效果:

通过插件配置的表单将会以网页形式出现,用户可以在表单下方看到所有字段,便于填写和提交。

示例代码:

假设我们选择了 Contact Form 7 插件:

// 定义表单变量
$contact_name = isset($_POST['name']) ? sanitize_text_field($_POST['name']) : '';
$email = isset($_POST['email']) ? sanitize_email($_POST['email']) : '';

// 渲染表单
echo do_shortcode('');
echo do_shortcode('');

在这个例子中,acf 是 Contact Form 7 的缩写,表示使用该插件中的字段。你需要在表单中相应地添加字段。

如何使用:

在文章或页面中插入 [contact_form_7] 指令,它会渲染表单并收集用户的输入。

这种方法灵活性高,适合各种复杂的需求,但需要额外的学习成本。

希望这些方法能帮助你在WordPress网站上有效地展示表单条目!如果你有任何问题,请随时提问。

黑板前的Bug语法讲师

黑板前的Bug语法讲师

如何在你的网站上显示 WordPress 表单条目

一、使用 add_action 注册表单条目

在 WordPress 中,你可以通过 add_action 函数来注册一个自定义插件或主题功能到默认的 wp_insert_post_data 活动中。这个活动会触发 wp_insert_post() 函数,用于创建新文章。

示例代码:

// 1. 获取当前用户 ID
$user_id = get_current_user_id();

// 2. 获取作者信息
$author_email = get_the_author_meta('email');
$author_name = get_the_author_meta('display_name');

// 3. 创建一个新的表单数据对象
$form_data = array(
    'post_title' => 'Contact Form',
    'post_content' => '<h1>Contact Us</h1>
        <form action="submit.php" method="post">
            <label for="name">Name:</label><br>
            <input type="text" name="name" id="name"><br>
            <label for="email">Email:</label><br>
            <input type="email" name="email" id="email"><br>
            <label for="message">Message:</label><br>
            <textarea name="message" id="message"></textarea><br>
            <button type="submit">Submit</button>
        </form>',
);

// 4. 使用 add_action 注册表单条目
function submit_form() {
    global $post;
    $post->ID = wp_insert_post($form_data, true);
}

add_action( 'wp_insert_post', 'submit_form' );

方法二:使用 register_post_type 注册表单类型

如果需要为特定类型的表单设置定制行为和属性,可以使用 register_post_type 函数来注册新的表单类型。

示例代码:

// 1. 创建表单类型
function create_contact_form() {
    register_post_type(
        'contact-form',
        array(
            'labels' => array(
                'name' => _x('Contacts', 'post type general name'),
                'singular_name' => _x('Contact', 'post type singular name'),
                'menu_name' => _x('Contacts', 'post type menu name'),
            ),
            'public' => false,
            'supports' => array('title', 'editor', 'thumbnail', 'custom-fields'),
            'has_archive' => true,
            'rewrite' => array('slug' => 'contact-forms')
        )
    );
}
add_action('init', 'create_contact_form');

// 2. 添加表单字段
function contact_form_fields() {
    $args = array(
        'label' => __('Fields', 'some-plugin'),
        'show_in_rest' => true,
        'rest_base' => 'contact-forms',
        'rest_controller_class' => 'WP_REST_Posts_Controller'
    );

    register_rest_field(
        'contact-form',
        'field1',
        $args
    );

    register_rest_field(
        'contact-form',
        'field2',
        $args
    );
}

add_action('edit_contact-form', 'contact_form_fields');

结论:

这两种方法都可以帮助你在 WordPress 网站上轻松地添加表单条目。选择哪种方法取决于你的具体需求和喜好。如果你想要更灵活的管理,建议使用第二种方法;如果你想保持简单并专注于表单内容,第一种方法可能更适合你。