WordPress 独自コメント投稿フォームに画像登録処理などを追加するカスタマイズ

WordPress標準のコメント投稿フォームとは別で独自に用意したコメント投稿フォームに画像ファイルの登録処理などを追加するサンプルです。

独自コメント投稿フォームのHTML

<form id="reviewAdd" name="reviewAdd" method="post" action="<?php echo site_url();?>/wp-comments-post.php" enctype="multipart/form-data">

    <h3 class="title-02">表示名</h3>
    <div class="inner">
        <p class="mb-05">
            <input name="comment_nickname" id="comment_nickname" type="text" value="" placeholder="ニックネーム">
        </p>
    </div>

    <h3 class="title-02">レビュー内容</h3>
    <div class="inner">
        <p class="mb-10">
            <select name="product_rating">
                <option>おすすめ度</option>
                <option value="1">★</option>
                <option value="2">★★</option>
                <option value="3">★★★</option>
                <option value="4">★★★★</option>
                <option value="5">★★★★★</option>
            </select>
        </p>
        <p class="mb-10">
            <textarea name="comment"></textarea>
        </p>
        <p class="mb-10"><input type="file" name="comment_file1"></p>
        <p class="mb-10"><input type="file" name="comment_file2"></p>
        <p class="mb-10"><input type="file" name="comment_file3"></p>
    </div>

    <div class="inner">
    <div class="col-area mb-10">
        <ul class="col-2 w46">
            <li><a class="btn solid blue big" id="reviewSaveBtn">保存する</a></li>
        </ul>
        </div>
    </div>

    <input type="hidden" name="comment_post_ID" value="<?php echo $post_id;?>" id="comment_post_ID">
    <input type="hidden" name="comment_parent" id="comment_parent" value="0">
</form>


<script type="text/javascript">
(function($) {

$("#reviewSaveBtn").click(function () {
    $("#reviewAdd").submit();
});

})(jQuery);
</script>

コメント登録時の画像登録処理など

/**
 * コメントカスタマイズ:
 * ・コメント投稿名をニックネームで上書きする
 * ・メールアドレスを空にする
 * ・画像ファイルを登録する
 */
function ag_wp_update_comment($commentID, $comment)
{
    //POSTされたニックネームを取得する
    $custom_comment_key = 'comment_nickname';
    $comment_nickname   = esc_attr($_POST[$custom_comment_key]);
    
    $args = [
        'comment_ID'           => $commentID,
        'comment_author'       => $comment_nickname,
        'comment_author_email' => ''
    ];
    wp_update_comment($args);
    
 
    /* ▼POSTされたファイル登録処理 */
    $user = wp_get_current_user();
    
    
    $comment_file_key = ['comment_file1', 'comment_file2', 'comment_file3'];
    $comment_file_url = array();
    //
    foreach ($comment_file_key as $key) {
        // ファイル名を取得して、ユニークなファイル名に変更
        $file_name = $_FILES[$key]['name'];
        
        if ($file_name) {
            $uniq_file_name = date("YmdHis") . "_" . $file_name;

            // 仮にファイルがアップロードされている場所のパスを取得
            $tmp_path = $_FILES[$key]['tmp_name'];

            // 保存先のパスを設定
            $upload_dir = wp_upload_dir();
            $basedir    = $upload_dir['basedir'];
            $upload_path = $basedir.'/review/';
            $upload_path = $upload_path.$user->ID.'/'.$commentID.'/';

            //ディレクトリ作成
            if(mkdir($upload_path, 0777, true)){
            } else {
            }

            //
            if (is_uploaded_file($tmp_path)) {
                // 仮のアップロード場所から保存先にファイルを移動
                if (move_uploaded_file($tmp_path, $upload_path . $uniq_file_name)) {
                    //フィルのパーミッション変更
                    chmod($upload_path . $uniq_file_name, 0644);
                    $comment_file_url[] = $upload_dir['baseurl'].'/review/'.$user->ID.'/'.$commentID.'/'.$uniq_file_name;

                } else {
                }
            }
        }
    }
    
    //画像ファイルの配列をシリアライズしてコメントメタに保存する
    if ( count($comment_file_url) ) {
        add_comment_meta($commentID, 'comment_image', serialize($comment_file_url));
    }
  
}
add_filter('wp_insert_comment', 'ag_wp_update_comment', 10, 2);

関連記事

レイティングなど上記コードに含まれないコメントメタの保存については以下の記事をご参照ください。

動作環境情報

エックスサーバー(x10)
PHP 7.3.16
MySQL 5.7
WordPress 5.4.2

コメント

タイトルとURLをコピーしました