【Movable Type】編集画面でタイトルの文字数カウント

  • CMS

タイトルの文字数をカウントしたい

MTの編集画面でタイトルの文字数をカウントする方法をご紹介します。
今回は下記記事を参考にさせていただきました。

Movable Type のリッチエディタ(TinyMCE)に文字数カウント機能を付ける

こちらは本文の文字数カウントなのでちょっと調整。

alt-tmplを作成

alt-tmplに下記を複製します。

mt/tmpl/cms/edit_entry.tmpl

mt/alt-tmpl/cms/edit_entry.tmpl

edit_entry.tmplに追記

<mt:include name="include/header.tmpl" id="header_include">

の手前に下記のコードを挿入します。

<mt:setvarblock name="js_include" append="1">
  <script>
    jQuery(function($){
      var $title = $('#title');
      var l = $title.val().replace(/<.*?>|\n/g, '').length;
      var statusHTML = '<span>文字数 : <span id="current-length-title">' + l + '</span></span>';
      $title.before(statusHTML);

      $title.on('keydown keyup keypress change',function(){
        var l = $(this).val().length;
        $('#current-length-title').html(l);
      });
    });
  </script>
</mt:setvarblock>

以上で、作業は終了です。

Writer

KO

誕生日に会社のみんなから『世界文学全集』をプレゼントしてもらった読書好きフロントエンド・エンジニアです。WordPressとMovableTypeが得意ですが、本当の特技は薪割りです。

Contact

ご提案依頼、ご相談、お見積もりなど
お気軽にお問合わせください。

03-6403-3259

平日 10:00~19:00

「Web制作について」とお伝え頂ければ
担当者に取次させていただきます。

Mailform

contact@trym.jp
でも受け付けております。