在WordPress前端集成Gutenberg块编辑器：自定义实现与替代方案

<?php
/*
** Template Name: Add Post From Frontend
*/
get_header(); // 加载主题头部
?>
<div class="col-sm-12">
    <h3>添加新文章</h3>
    <form class="form-horizontal" name="form" method="post" enctype="multipart/form-data" onsubmit="return returnformValidations();">
        <input type="hidden" name="ispost" value="1" />
        <?php
        // 可选：如果需要关联用户，可以设置用户ID
        // if (is_user_logged_in()) {
        //     global $current_user;
        //     wp_get_current_user();
        //     echo '<input type="hidden" name="userid" value="' . esc_attr($current_user->ID) . '" />';
        // }
        ?>
        <div class="col-md-12">
            <label class="control-label" for="title">标题</label>
            <input type="text" class="form-control" name="title" id="title" />
        </div>

        <div class="col-md-12">
            <label class="control-label" for="sample_content">内容</label>
            <textarea class="form-control" rows="8" name="sample_content" id="sample_content"></textarea>
        </div>

        <div class="col-md-12">
            <label class="control-label" for="category">选择分类</label>
            <select name="category" class="form-control" id="category">
                <option value="">请选择</option>
                <?php
                $catList = get_categories();
                foreach($catList as $listval)
                {
                    echo '<option value="'.esc_attr($listval->term_id).'">'.esc_html($listval->name).'</option>';
                }
                ?>
            </select>
        </div>

        <div class="col-md-12">
            <label class="control-label" for="sample_image">上传文章图片</label>
            <input type="file" name="sample_image" class="form-control" id="sample_image" />
        </div>

        <div class="col-md-12">
            <input type="submit" class="btn btn-primary" value="提交" name="submitpost" />
        </div>
    </form>
    <div class="clearfix"></div>
</div>
<?php
get_footer(); // 加载主题底部
?>

<script>
function returnformValidations()
{
    var title = document.getElementById("title").value;
    var content = document.getElementById("sample_content").value; // 注意ID与HTML中的一致
    var category = document.getElementById("category").value;

    if(title.trim() === "")
    {
        alert("请输入文章标题!");
        return false;
    }
    if(content.trim() === "")
    {
        alert("请输入文章内容!");
        return false;
    }
    if(category.trim() === "")
    {
        alert("请选择文章分类!");
        return false;
    }
    return true; // 所有验证通过
}
</script>

<?php
/*
** Template Name: Add Post From Frontend
*/

// 处理表单提交
if(isset($_POST['ispost']) && $_POST['ispost'] == '1') {
    if (!is_user_logged_in()) {
        echo "<h2 style='text-align:center;'>用户必须登录才能添加文章!</h2>";
    } else {
        global $current_user;
        wp_get_current_user(); // 获取当前登录用户信息

        // 清理和获取表单数据
        $post_title = sanitize_text_field($_POST['title']);
        $post_content = wp_kses_post($_POST['sample_content']); // 允许部分HTML
        $category = intval($_POST['category']); // 确保分类ID是整数

        // 创建新文章数组
        $new_post_args = array(
            'post_title'    => $post_title,
            'post_content'  => $post_content,
            'post_status'   => 'pending', // 默认设置为待审核
            'post_type'     => 'post',    // 文章类型为 'post'
            'post_author'   => $current_user->ID, // 作者为当前登录用户
            'post_category' => array($category) // 分类是一个数组
        );

        // 插入文章
        $pid = wp_insert_post($new_post_args);

        if (is_wp_error($pid)) {
            echo "<h2 style='text-align:center; color:red;'>文章提交失败: " . $pid->get_error_message() . "</h2>";
        } elseif ($pid > 0) {
            // 处理特色图片上传
            if (!function_exists('wp_generate_attachment_metadata')) {
                require_once(ABSPATH . "wp-admin" . '/includes/image.php');
                require_once(ABSPATH . "wp-admin" . '/includes/file.php');
                require_once(ABSPATH . "wp-admin" . '/includes/media.php');
            }

            if (isset($_FILES['sample_image']) && $_FILES['sample_image']['error'] === UPLOAD_ERR_OK) {
                $attach_id = media_handle_upload( 'sample_image', $pid );

                if (is_wp_error($attach_id)) {
                    echo "<h2 style='text-align:center; color:orange;'>图片上传失败: " . $attach_id->get_error_message() . "</h2>";
                } elseif ($attach_id > 0) {
                    // 设置上传的图片为文章的特色图片
                    set_post_thumbnail($pid, $attach_id);
                }
            }
            echo "<h2 style='text-align:center; color:green;'>文章已成功提交，等待审核!</h2>";
            // 可选：重定向到文章列表或成功页面
            // wp_redirect(get_permalink($pid));
            // exit;
        }
    }
}

get_header(); // 加载主题头部
// ... HTML 表单内容 ...
get_footer(); // 加载主题底部
?>