広告

WordPressでタイトルの文字数を自動表示する方法!

2017年10月23日

WordPressの投稿画面でタイトル作成しながら文字数を確認することができたなら...

とっても便利ですよね(^^)

今回はWordPressでタイトルの文字数を自動表示する方法についてご紹介します。

ご注意

本記事は子テーマのfunctions.phpに追記していく方法です。作業はコピペで完了しますがバックアップしてから望むことをオススメ致します。

WordPress themeは「Affinger4」にて実践しています。

WordPressでタイトルの文字数を自動表示させる方法

僕は普段 履歴を残すことを目的にスプレッドシート上でLEN関数を使用してタイトルの文字数を確認しています。

LEN関数

文字列の長さを返します。

使用例:LEN(A2)

LEN("ダミー テキスト")

構文:LEN(テキスト)

テキスト - 長さが返される文字列です。

引用元:https://support.google.com/LEN

ですが実際に記事にする際はシートに記載したタイトルを、そのまま転記することはあまり無いんですよね。

大抵はもっと馴染ませたタイトルに書き換えることが殆どです。

しかし書き換える度にスプレッドシートに戻り、タイトルが何文字なのか数え直す...

あひる
これは手間でしかないね

そこで今回はWordPressの投稿画面のタイトル上に、文字数がカウント表示される窓を設置しちゃおう!といういうわけです。

STEP1. WordPressの子テーマのfuncton.phpを開く

「ダッシュボード > 外観 >テーマの編集 」をクリック。

テーマの編集画面になるので...

子テーマのfuncions.phpをクリックします。

STEP2. function.phpにタイトル文字数表示コードを追記する

開いた子テーマのfunctions.phpの一番下に...

投稿画面にタイトルの文字数を表示するコードを追記します。

/* 投稿画面のタイトルに文字カウンター */
function excerpt_count_js(){
echo '<script>jQuery(document).ready(function(){
jQuery("#titlewrap").after("<div style="position:absolute;top:5px;right:5px;color:#666;"><small>文字数: </small><input type="text" value="0" maxlength="3" size="3" id="title_counter" readonly="" style="background:#fff;"></div>");
jQuery("#title_counter").val(jQuery("#title").val().length);
jQuery("#title").keyup( function() {
jQuery("#title_counter").val(jQuery("#title").val().length);
});
});</script>';
}
add_action( 'admin_head-post.php', 'excerpt_count_js');
add_action( 'admin_head-post-new.php', 'excerpt_count_js');

本コードはtanweb.netさんの投稿画面のタイトルに文字数カウンタをつけよう!からそのまま拝借いたしました。ありがとうございます(_ _)

必ず元のfunctions.phpコードの一番下に貼り付けてください。

貼り付けたら「ファイルを更新」をクリック。

「ファイルの編集に成功しました。」と表示されればOK。

ダッシュボード > 投稿画面 のタイトル窓に以下のような感じに文字数窓が表示されます↓

これでタイトルの文字数が自動で表示されるようになりました!

タイトル例があれですが、文字入力すると文字数が変化していることが分かりますね。思っていたより簡単に設置出来たのではないでしょうか?

OYAKUN
次のページではfunctions.phpに追記・更新後にページが真っ白になった、僕の右往左往した修正の手順を載せておきます(泣)

オススメWordPressが重い!プラグインを見直すだけで表示速度が4倍に

次のページへ >