WordPress

【WordPress】投稿画面でタイトル、本文、カテゴリー、アイキャッチなどを入力必須にする方法

2022年5月21日

※ 当サイトではアフィリエイト広告を利用しています

WordPressの投稿画面で入力項目を必須にする方法ってある?

通常、投稿画面で入力していない項目があっても公開は出来ます。

しかし、項目によっては入力必須にしたい場合もあると思います。

今回はプラグインなどを使わずに投稿画面の入力項目を必須にする方法を解説していきます。

Classic Editorのみ対応で、ブロックエディタには対応していません。

じゅんぺいブログは、Web制作コーディングWordPress制作)の技術記事を中心に、約500記事公開しています。ぜひ他の記事も参考にしてみてください!
完全無料のプログラミングスクール『ZeroPlus Gate』
30日間でWeb制作を学べる無料のプログラミングスクールがこちら
いきなり数十万するプログラミングスクールは厳しい・・・という人のお試しに最適です。
現在は無料ですがいつ有料になるか分からないので、気になる方はお早めに👇
(有料になっていたらすいません🙇‍♂️)

\ 完全無料 /

ZeroPlus Gate公式サイト

毎日先着制!

WordPressの投稿画面でタイトル、本文、カテゴリー、アイキャッチなどを入力必須にする方法

今回投稿画面で入力項目を必須にする方法は『functions.php』にコードを記述する方法となります。

早速ですが記述するコードは以下になります(必須にしない項目は削除して下さい)

// 投稿画面で入力必須設定
function post_edit_required() {
?>
<script type="text/javascript">
jQuery(function($) {
  if ('post' == $('#post_type').val()) { // ここでページの種類を指定
    $('#post').submit(function(e) {
      // タイトル
      if ('' == $('#title').val()) {
        alert('タイトルを入力してください');
        $('.spinner').css('visibility', 'hidden');
        $('#publish').removeClass('button-primary-disabled');
        $('#title').focus();
        return false;
      }
      // 本文
      if ($('.wp-editor-area').val().length < 1) {
        alert('本文を入力してください');
        $('.spinner').css('visibility', 'hidden');
        $('#publish').removeClass('button-primary-disabled');
        return false;
      }
      // 抜粋
      if ('' == $('#excerpt').val()) {
        alert('抜粋を入力してください');
        $('.spinner').css('visibility', 'hidden');
        $('#publish').removeClass('button-primary-disabled');
        $('#excerpt').focus();
        return false;
      }
      // カテゴリー
      if ($('#taxonomy-category input:checked').length < 1) {
        alert('カテゴリーを選択してください');
        $('.spinner').css('visibility', 'hidden');
        $('#publish').removeClass('button-primary-disabled');
        $('#taxonomy-category a[href="#category-all"]').focus();
        return false;
      }
      // タグ
      if ($('#tagsdiv-post_tag .tagchecklist span').length < 1) {
        alert('タグを選択してください');
        $('.spinner').css('visibility', 'hidden');
        $('#publish').removeClass('button-primary-disabled');
        $('#new-tag-post_tag').focus();
        return false;
      }
      // アイキャッチ
      if ($('#set-post-thumbnail img').length < 1) {
        alert('アイキャッチ画像を設定してください');
        $('.spinner').css('visibility', 'hidden');
        $('#publish').removeClass('button-primary-disabled');
        $('#set-post-thumbnail').focus();
        return false;
      }
    });
  }
});
</script>
<?php
}
add_action( 'admin_head-post-new.php', 'post_edit_required' );
add_action( 'admin_head-post.php', 'post_edit_required' );

これを書いた状態で、例えば本文だけ書いて公開ボタンをクリックすると、以下のようなポップアップが表示されます。

必須項目のタイトルが未入力の場合

必須項目のタイトルが未入力の場合

そしてタイトルを入力して公開ボタンをクリックすると次はこちらが表示されます。

必須項目のタイトルを入力して抜粋は未入力の場合

必須項目のタイトルを入力して抜粋は未入力の場合

このように上から順に入力されていない項目があったらポップアップされ、必須項目が全て入力されたら公開可能となります。

 

投稿ページ以外を設定する場合

先ほどは投稿ページを例にしましたが、固定ページやカスタム投稿ページなども設定可能です。

6行目にif( 'post' == $('#post_type').val() )とあり、ここを編集します(それぞれ6行目のみ書いていきます)

ただし固定ページなどは元々カテゴリーがないので、先ほどのコードからカテゴリーの部分を削除しないと公開出来ないのでご注意下さい。

 

固定ページを指定

if( 'page' == $('#post_type').val() ) {

 

固定ページと投稿ページ両方指定

if ( 'post' == $('#post_type').val() || 'page' == $('#post_type').val() ) {

 

カスタム投稿ページを指定

カスタム投稿タイプスラッグが『program』の場合は以下のようになります。

if ( 'program' == $('#post_type').val() ) {

 

カスタム投稿ページを複数指定

カスタム投稿タイプスラッグが『program』と『news』の両方指定する場合は以下のようになります。

if ( 'program' == $('#post_type').val() || 'news' == $('#post_type').val() ) {

このように || で繋げれば幾つでも指定出来ます。

以上になります。

この記事が役に立ったと思ったら、シェアボタンからX(旧Twitter)などにシェアすると、いいねされてフォロワーが増えたりすることがあるよ!
  • この記事を書いた人

じゅんぺい

37歳からWeb制作とブログ開始。Web制作歴5年目でコーディングとWordPressオリジナルテーマ制作が中心。これまで120件以上を納品。当ブログ月間最高15万PVで、370記事以上はWeb制作の技術記事。コンテンツ販売→累計売上1200万円&1500部超え。X(旧Twitter)フォロワー7200人以上。2024年3月からブログの経験を活かしてライターとしても活動を開始。

-WordPress