WP管理画面でタイトルの文字数を自動的に数えるカスタマイズを紹介します！

こんにちは。Ken(Ken_kentabi)です。

SEOを気にする方なら、ブログ記事のタイトルの文字数はかなり気にしているのではないでしょうか？

28～32字ぐらいが良いというのは僕も聞いたことがあります。

ちなみにこの記事のタイトル「WP管理画面でタイトルの文字数を自動的に数えるカスタマイズを紹介します！」は36文字です。

さて、あなたはこのタイトルの文字数をどうやって数えていますか？

WordPressには本文の文字数カウンターなら元々付いていますが、タイトルの文字数は自分で数えないとわからないですよね。

僕は今までは下記のようなサイトを使っていました。

参考【文字数カウント】文字数カウント

しかしながら、毎回毎回いちいちコピペしてこの作業をするのも面倒ですよね。

なんか良い方法無いかなと思っていたら、それがあったんです。

WPの管理画面(記事の新規投稿)でタイトルを入力した時に、リアルタイムでカウントしてくれるようなカスタマイズが・・・！！！

このカスタマイズを行うと、タイトル入力枠の右上に文字数カウンターが付けられてしまいます。

メチャクチャ簡単に出来るので、早速やり方を紹介しますね。

1 新規投稿画面でタイトル文字数を表示する方法
2 SANGOなら問題なく使える
3 終わりに

新規投稿画面でタイトル文字数を表示する方法

参考にしたサイトは超有名フリーWPテーマ「Simplicity」の作者のサイトです。

参考 WP管理画面でタイトル文字数カウンターを表示するカスタマイズ方法寝ログ

カスタマイズ方法もメッチャシンプル。

以下のコードをテーマ(子テーマ)のfunction.phpにコピペするだけになります。

HTML

//Wordpress投稿画面のタイトル文字数をカウントする
function count_title_characters() {?>
<script type="text/javascript">
jQuery(document).ready(function($){
  //in_selの文字数をカウントしてout_selに出力する
  function count_characters(in_sel, out_sel) {
    $(out_sel).html( $(in_sel).val().length );
  }

  //ページ表示に表示エリアを出力
  $('#titlewrap').after('<div style="position:absolute;top:-24px;right:0;color:#666;background-color:#f7f7f7;padding:1px 2px;border-radius:5px;border:1px solid #ccc;">文字数<span class="wp-title-count" style="margin-left:5px;">0</span></div>');

  //ページ表示時に数える
  count_characters('#title', '.wp-title-count');

  //入力フォーム変更時に数える
  $('#title').bind("keydown keyup keypress change",function(){
    count_characters('#title', '.wp-title-count');
  });

});
</script><?php
}
add_action( 'admin_head-post-new.php', 'count_title_characters' );
add_action( 'admin_head-post.php', 'count_title_characters' );

注意

テーマの編集は必ずバックアップを取ってから行いましょう。

これだけでOKです！簡単ですよね？笑