本ページはプロモーションが含まれている場合があります
画像出典：CMS プラットフォーム Movable Type（Six Apart）
Movable Typeでサイト構築をしていて、トップページにブログの最新記事のタイトル一覧を付けたり、パンくずリストを設置する際に問題になるのが、「やたらタイトルが長い記事をどうするか」というもの。
タイトルが想定したものより長いと、リスト要素で配置した場合（ul>li>）に、2行になってしまい体裁が崩れてしまうことがあります。
はみ出た分はCSSで「overflow: hidden」してしまう方法もありますが、ここは出力時に指定した文字数で出力するようにしてみましょう。
ついでに指定した文字数を超えていた場合は省略しましたと「…」を付けるようにしてみます。
●trim_toのグローバル・モディファイアを使う
タグの中身から指定した文字数を先頭から抜き出すグローバル・モディファイアが標準で用意されています。
なので、ブログの記事タイトルから先頭の20文字を抜き出す場合には以下の様に書きます。
<$mt:EntryTitle trim_to="20"$>
簡単ですね。
ではブログの記事タイトルが20文字を超えていた場合のみ「…」を付ける処理はどうしたらよいのでしょうか？
一度ブログ記事のタイトルの文字数をカウントして、それを変数に入れて条件分岐で付ける？
<$mt:EntryTitle count_characters="1" setvar="entry_title_char"$><$mt:EntryTitle trim_to="20"$><mt:If name="entry_title_char" gt="20">…</mt:If>
これでももちろん正常に動作します。
が、Movable Type 5.1以降は「+〈文字〉」ですぐにできます。超簡単！ なんだこれ。
<$mt:EntryTitle trim_to="20+…"$>
●プラグインを使う場合
というわけで、上記のようにプラグインを使う必要はありませんが、プラグインを使いたいという方は、MT-I18NプラグインまたはI18NHelperプラグインを使います。ダウンロードしてインストールして下さい。
- MTI18N_Plugin - ogawa （Google Project Hosting）
- ogawa/mt-plugin-I18NHelper（GitHub）
あとは以下の様に書けばOK。
<mt:FirstNText length="20"><$mt:EntryTitle$></mt:FirstNText>
ただし指定した文字数を超えて追加される文字は「...」固定で、指定できません。プラグインで追加文字を指定する部分を修正すれば好きな文字にできます。
※本当はfirst_n_textのグローバル・モディファイアがあるのですが、動作しませんでした…。<$mt:EntryTitle first_n_text="20"$>でOKなハズですが…（謎）。
以上です。
それでは、よいMovable Typeライフを。