旧投稿画面「自動改行」で書いた記事の修正

はじめに

管理画面と投稿画面の別を正しく認識する必要があります。

管理画面というのは、ブログ全体を管理する起点となるページ 及び 各ユーザーが個人で管理できるページのまとまり のことです。

左のナビゲーション、カレント(現在地)は「管理画面TOP」となっています。

投稿画面というのは、ブログ記事を作成・編集するためのページ つまり エディターの利用ができるページ のみを指します。

左のナビゲーション、カレントは「新しく記事を書く」となっています。

FC2リクエストやTwitterなど拝見しますと「新しい管理画面が使いづらい」とあり、内容を読んでみると実際は管理画面のことではなく投稿画面に関する内容だった、ということが多々あります(逆もまた然り)
なので「管理画面」と「投稿画面」は全く別のことを指しているのだ、と理解しておかないと本記事をお読み頂いても混乱するだけではないか思います。

本記事ではページに関しての云々ではなくエディターの機能的な面についての説明が主旨なので、混乱を避けるために、旧投稿画面を 旧エディター、新投稿画面を 新エディター と表現しながら進めます。また、旧管理画面で利用可能な新エディターについての言及は避け、本記事で言う新エディターは新管理画面で利用できるそれを対象とします。

改行の扱い『自動』を辞めたくなるときが来る

多くの方がブログ運営初期に 旧エディター利用 + 改行の扱い『自動』指定 という形で記事を書いているのではないかな、と思います。長く運営するにつれ、この「自動改行」を排除したくなるときが訪れるんですね。

• アクセス数やSEOを意識し出したとき
• 装飾を使いたくなったとき(記事を読みやすくするための配慮など)
• TOC(見出し目次)やブログカードなど、エディターのツールだけでは補完できないものを掲載したくなったとき

などなど。簡単に言うとエディターの機能だけでは物足りなくなったとき、という感じでしょうかね。例えば 文章をただのテキストではなく段落として定義したい とか。この場合は p要素 の利用ということになります。またあるいは 画像にドロップシャドウをつける など。この場合は挿入した画像の一部に class属性 を付加したり style属性 を付加する、といった操作が必要になりますので エディターのツールには無いhtmlを自分で書き込む ということになります。

「今後の記事はそうする」という方針ならそれで良いんですが、比較的多くの方が「過去記事も修正したい」と考えるようです。折り目正しい日本人。ほんとに素晴らしいなと感心するばかり。

そして実は 改行の扱い『自動』の解除は一筋縄ではいかない という事実 （￣∀￣；）

自動改行の排除は旧管理画面の旧エディターでしかできない

旧 + 旧 の組み合わせでしかできないんですよ (´・ｪ・｀)
例えば以下は旧エディターで自動改行を利用して書いた記事を、新エディターで開いたときの様子です(HTML編集)

これをp要素でマークアップしたい、ということで以下のように変更します。

文章の前後に <p> と </p> が付いて p要素 が3つ在る、という形に変更しました。

期待される描画結果・正しい描画結果は以下の通りです。

p要素は上下に margin がついて、各段落であることが見た目にもわかりやすくなるのが本来なのでそれぞれの要素間に余白がありますね。これが正しい結果です。これはp要素の上下marginの働きによるものです。
* テンプレート作者によってはmarginを取り除くようにしていたり、余白のサイズを調整していることがあります。サンプルの場合は余白をデフォルトよりも大きめに取ってある例です。

ところがこの記事は元々「自動改行」で書かれていた記事です。実際の描画結果は以下の通り。

行間ひろッ!!! ヽ(`Д´)ﾉ
図解するとこういうことです。

目に見えない(記事編集画面上には出てこない) <br> によって行間が広くなります。p要素というのは横100%占有しますので、「この文章をp要素でマークアップし直したい 一つめ」の直後に Enter/ Return キーを押した場合既にカーソルはこの文章の「下段」に位置していますので、1度の押下で1行取ります。そして空白行を設けるために押下した Enter/ Return でもう1行の空白です。

ちなみに margin というのは上下で隣接する要素同士は 相殺(offset) が行われるため、通常p要素同士が上下に並んだ場合は以下のようになります。

ですが旧エディター自動改行を利用していた場合は 目に見えない <br> が存在している ため、p要素は隣接していません。故に上下各marginが相殺されず、とても大きく行間が空いてしまいます。

改行の扱い『自動』で作成された<br>は目に見えない

ちゃんとhtml編集しているのに何故直らない？！ と思われるかと思います。旧エディター自動改行の仕組みは

ユーザーが記事を保存する(自動改行を適用)
↓
FC2サーバーへ送信
↓
FC2サーバーがデータを受信して結果をブラウザへ返す --- ここで<br>が追加される

こういうルートです。FC2サーバーを経由した時点で <br> が追加されるわけですね。目視できないのはそのためです。そして恐らく 記事単位で識別・登録 を行っています。感覚的には例えば「記事番号の30は自動改行opt in(ON)」「記事番号31は自動改行opt out(OFF)」みたいな感じ。opt in状態を解除するには、対象記事の記事作成画面(編集画面)で自主的にopt outに変更する必要があり、それが唯一の手段です。

opt out状態に移行させる、というのはつまり「改行の扱い『HTMLタグのみ』」の指定に変更をする、という意味です。そしてこの操作は旧エディターでしかできないよ、ということですね。

2021年8月以降の新規開設は旧管理画面の提供なし

新規ユーザーさんは旧管理画面の利用ができません。ということは 旧管理画面の提供が終了する可能性は否定できない と思います。逆にもしかすると運営側は古参ユーザーへは恒久的に提供を続ける意思があるかもしれません。そこは不透明です。恐らく尋ねたとしても「今のところ提供終了の予定はありません」とかそんな風にしか返ってこないような気がします。「今のところ」とか「現時点では」というのがミソ(笑)

なので、記事をhtmlで管理したいとい考えている方は今のうちから少しづつ編集された方が良いのかもしれません。

html編集に関して個人的見解とまとめ

私個人としては 無理にhtmlを使う必要はない と考えています。htmlのことはあまり気にせずに新エディターのデフォルトでもある「みたまま」で書けば良い、と。初心者から上級者まで楽しめるのがブログの利点なので、上級者しか生き残れないような道は必要ない (´・ω・｀)

そしてhtmlで管理するとしても過去記事まで遡って修正するのは非常に大変なので、割り切っても良いんじゃないかな、と思います。過去は過去、これからはhtmlで書きます ('0')/
ぐらいで。もちろんそれは個人の自由です。