ワードプレスの投稿タイトル入力フィールドに文字数に制限を加える

ワードプレスの投稿タイトル入力フィールドに文字数制限を加える方法をご紹介します。

functions.phpに以下のコードを追加してください。

function limit_post_title_length() {
  ?>
  <script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function() {
      const titleField = document.getElementById('title');
      const maxLength = 50; // ここで文字数の制限を設定します
      if (titleField) {
        titleField.addEventListener('input', function() {
          if (titleField.value.length > maxLength) {
            titleField.value = titleField.value.substring(0, maxLength);
          }
        });
      }
    });
  </script>
  <?php
}
add_action('admin_head', 'limit_post_title_length');

このような方法もあります。

function validate_post_title_length($data, $postarr) {
  $maxLength = 50; // ここで文字数の制限を設定します
  if (strlen($data['post_title']) > $maxLength) {
    wp_die('タイトルは' . $maxLength . '文字以内で入力してください。');
  }
  return $data;
}
add_filter('wp_insert_post_data', 'validate_post_title_length', 10, 2);

この設定により、投稿タイトルの入力フィールドにリアルタイムで文字数制限が適用され、投稿を保存する際にもサーバー側で文字数制限が確認されます。

投稿本文の文字数を制限したい場合はこちら

www.design.pon-poo.com

https://www.design.pon-poo.com/tutorial/post-1322/

https://www.design.pon-poo.com/tutorial/post-1322/

関連投稿:

【初心者の方向け】 Bootstrap4の使い方 ドロップダウン オリジナルメニューに追加したテキストエリア内でHTMLを許可する Bootstrap5 ボタン（Button）の作成と使い方 【初心者の方向け】 Bootstrap4の使い方 ボーダー