Movable Typeで記事を作成する時にフォーマットとして「改行を変換」を指定して、<blockquote>タグを使うと、blockquoteの引用部の前後に改行が入ったり入らなかったり、引用部の先頭や末尾に余計な改行が入ったりして見た目のバランスが悪くなることがしょっちゅう起こる。 再現条件もよくわからないし、CSSやブラウザによっても症状が変わったりする。
例えば、
XXXに
<blockquote>
YYY
</blockquote>
と書かれている。
<p>XXXに<br>
</p><blockquote>
YYY<br>
</blockquote>
と書かれている。<p></p>
--------------------------------
XXXに
YYYと書かれている。 --------------------------------
これを闇雲に改行を足したり減らしたりして修正しようとしても、滅多にうまくいかない。例えば、改行を全て取っ払って
XXXに<blockquote>YYY</blockquote>と書かれている。
という結果になる。<p>XXXに</p><blockquote>YYY</blockquote>と書かれている。<p></p>
本当に今更だが、突然思い出して気になったので、対策が無いか探してみた。
Webで探した結果、
MT6で<blockquote>を使う場合の書き方 - 継続は力なり！なのか？
に、MT6では<blockquote>タグの後ろと</blockquote>タグの前に空白行を入れれば良いという対策が書かれているのを見つけたが、MT7.5.0の筆者の環境では解決しなかった。
XXXに
<blockquote>
YYY
</blockquote>
と書かれている。
（入力の<blockquote>の前の改行や</blockquote>の後の改行を外しても出力はほぼ同じ）<p>XXXに<br> </p><blockquote><p></p> <p>YYY</p> </blockquote> と書かれている。
Movable Type r.4607 / 6.6.0 から、「改行を変換」による br タグ、p タグへの変換規則が変更になりました。とあるので、この関係かも知れない。
Webでは他には対策を見つけられなかった。
とりあえず、Movable Typeのソースコードを少し覗いてみた。
おそらく、lib/MT/Util.pmのhtml_text_transformが問題の関数である。これとMT 6.6.0より前の仕様の実装であろうhtml_text_transform_traditionalとをざっと読んでみたが、対策は見つけられなかった。
わかったことはこれくらいであった。
- <blockquote>〜</blockquote>の対応を考慮していることは無く、改行2つ（空行）で区切った段落の単位で処理して、段落の中に<blockquote>や</blockquote>があれば何か処理を分けているだけ
- 段落の先頭が<blockquote>や</blockquote>であれば、その段落を<p>〜</p>で囲まない
- 段落の最後の行以外で、行の最後が</blockquote>なら<br>を付けない
- 段落が<blockquote>で始まり</blockquote>で終わらないなら、最後に<br><br>を付ける
大体、改行が<blockquote>や</blockquote>の前後に0個か1個か2個かで結果が変わる可能性がありそうなので、<blockquote>の前後、</blockquote>の前後計4ヶ所にそれぞれ改行文字が0個、1個、2個入れる全81パターンを試してみた。
その結果、出力されるHTMLがアンバランスでない（<blockquote>の前と</blockquote>の後、<blockquote>の後と</blockquote>の前が共に対称）のは以下の2パターンしか無かった。
- (1) <blockquote>の前に改行2つ、</blockquote>の前に改行2つ
入力
出力XXXに <blockquote>YYY</blockquote> と書かれている。
<p>XXXに</p> <blockquote>YYY</blockquote> <p>と書かれている。</p>
- (2) <blockquote>の前後、</blockquote>の前後全てに改行2つ
入力
出力XXXに <blockquote> YYY </blockquote> と書かれている。
<p>XXXに</p> <blockquote> <p>YYY</p> </blockquote> <p>と書かれている。</p>
(2)の出力は<blockquote>の後の<p>〜</p>が余計である。(1)の出力はblockquote部分とその前後が別の段落になるのが気になるが、上記の81通りの入力の中ではこれが一番ましである。（Movable Type 7.5.0(r.4703)での確認結果）
つまり、対策としては以下のように書くのが良さそうである。
- <blockquote>の前と</blockquote>の後に空行を入れる
- <blockquote>の後と</blockquote>の前は改行しない
こんなことに時間を割かず、Movable TypeでもMarkDownがサポートされたんだからMarkDownで書けば良いのではないか、そろそろGitHubやQiitaなど技術系の記事が書けるサービスに移行すれば良いのではないか、とも思うのだが、そんな新しいことをする気力が無い。
コメント