WordPress

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

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

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

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

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

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

今だけ!5大無料特典あり🎁

コーディングの時給アップにはこちら!


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() ) {

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

以上になります。

 

コーディングの時給と作業効率を上げる!
2年間の実務で実際に使ったコードをまとめた『コーディング&WordPressメモまとめ集』をBrainで公開しています。
  • コピペで使えるWordPressの各テンプレート
  • 実務でよく使う見出し一覧
  • 実務でよく使うテキストのhoverアニメーション
  • 実務でよく使うボタン内の矢印9種類
  • Contact Form 7の色々・・・
などなど、他にもコピペで使えるコードがたくさん載せてあるので、時短=時給アップに繋がります。
さらに『コードのまとめ方が参考になった』というレビューも多数頂いているので、これを元に自分なりの"メモまとめ集"を作るという使い方も出来ます。
レビューは390件以上あるので、気になる方は以下のボタンからチェックしてみて下さい👇

今だけ!5大無料特典あり🎁

販売ページとレビューを見てみる


ブログランキング・にほんブログ村へ
  • この記事を書いた人

じゅんぺい

タイ・バンコク在住のWeb制作フリーランス兼ブロガー▶︎37歳からWeb制作を開始▶︎コーディングとWordPressのオリジナルテーマ制作でこれまで80件以上納品▶︎Web制作中心の当ブログは月間最高8.4万PV▶︎Twitterのフォロワーは6100人▶︎コーディングとWordPressのコンテンツを販売し、3日で500部突破&250万円&人気1位獲得 → 累計700部&420万円突破

-WordPress