【WordPress】記事タイトルの切れ目がわかる「区切り線」を入れるCSSとJavaScript。文字数カウントより効果的かな？

WordPressの記事投稿エディタの記事タイトルに32文字目が分かる線を引きました。

文字数カウンタは付けてるんですが検索結果で見切れそうなところを確認したいからです。

ちなみに文字数カウンタは寝ログさんのを使っています。WordPressで検索するとだいたい押さえてる寝ログさんスゲェ。
WP管理画面でタイトル文字数カウンターを表示するカスタマイズ方法nelog.jp

関連記事
＞＞＞【Google Analytics（アナリティクス）】リアルタイムのピーク値のスクリーンショットを自動取得する方法

＞＞＞【WordPress5.0リリースは12/7】更新前にテスト環境で試してみよう！新エディタGutenberg（グーテンベルク）

外観→テーマの編集→自分のテーマのfunctions.phpに下記を追記

/************************
記事タイトルの３２文字目に線を引く
*************************/
function DrawTitleBoxLine() {?>
/*アクションフックで呼び出されたPHPからJavaScriptを実行する*/
<script type="text/javascript">
$(document).ready(function(){
　　//グーテンベルク用
	var forGutenberg = function(){
			$("#post-title-0").css({'position':'relative','z-index':'1','word-break':'break-all'});
			$(".wp-block.editor-post-title__block > div").after('<div class="editor-post-title__input" style="color: gray !important;overflow-wrap: break-word;height: 124px;position: absolute;top: 5px;z-index: 0;left: -1px;">　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　|</div>');
	}
　　//タイミングが合わないので遅延させる
	setTimeout(forGutenberg, 5000);
	
　　//こっちはクラシックエディタ用
		$('#title').after('<div style="font-size: 1.7em;position: absolute;top: 1px;left: 9px;padding-bottom: 17px;border-left: dotted 1px #a0a5aa;margin-left: 32em;">&nbsp;</div>');
});
	</script><?php
}
//新規投稿時に実行するアクションフック
add_action( 'admin_head-post-new.php', 'DrawTitleBoxLine' );
//更新投稿時に実行するアクションフック
add_action( 'admin_head-post.php', 'DrawTitleBoxLine' );