ココログ：記事編集で余分な改行が入る→初期設定を通常エディタにする

　2019年３月のリニューアル以来、ココログは幾つものトラブルが続いている。中でも、プログラムのサンプルや番号付きリストに余計な改行が入るのには参った。新しく書く記事ばかりでなく、昔の記事を編集する際にも、勝手に空白行が入ってしまう。おかげで誤字脱字すら直せない。

　サポートにも報告したが、当面は直す気がないらしい。とまれ、一応の自衛策は教えてくれた。あまり万民向けとは言い難い方法だが、なんとか誤字脱字ぐらいは直せるようになったので、ここで書いておく。

【現象：概要】

　番号付きリストなどに、勝手に空白行が入って書き換わる。例えば以下のリストが…

ほんぶん

1. foo
2. bar

おわり

　このようになる。

ほんぶん

1. foo

1. bar

おわり

　番号なしリストや、整形済みテキストなどでも、エディタが勝手にHTMLタグを追加する。形が崩れるだけならともかく、番号付きリストだと意味まで変わってしまうので、使い物にならない。

【対策：概要】

　記事編集の初期設定を「通常エディタ」にする。その上で、リッチテキストは使わない。

【問題点】

　つまりですね。

　記事の編集は、リッチテキストだけを使うか、通常エディタだけを使うか、どっちかにしろ、という事です。両方を行き来するのは不許可である、と。自分で HTML タグを入れるなら常に 生HTML で書け、そうでなければココログが提供する HTML タグだけを使え、と。

　バリバリと HTML が書ける人ならいいけど、私のようにそうでない人には、かなり厳しい仕様だよなあ。もしくはホームページビルダーの類を使うとか。

【対策：詳細】

　と、そういう無茶な制限があります、と断ったうえで、記事編集の初期設定を「通常エディタ」にする方法を。

１．ブログの「設定」をクリックする。
　　→「ブログ詳細設定」画面に移る。
　　　＊画像をクリックで拡大表示

２．「表示方法」をクリックする。
　　→「ブログの表示設定」画面に移る。
　　　＊画像をクリックで拡大表示

３．「記事とウェブページの初期設定」の「エディタ設定」を「通常エディタ」にする。
　　「エディタ設定」は下の方にあるので、ずっとスクロールしてください。
　　→「通常エディタ」ボタンの色が変わる。
　　　＊画像をクリックで拡大表示

４．「記事とウェブページの初期設定」の「保存」をクリックする。
　　「保存」ボタンも下の方にあるので、ずっとスクロールしてください。
　　　＊画像をクリックで拡大表示

　これで、次から記事の編集画面を開いたら、通常エディタで開きます。余計な空白行も入りません。

【参考資料】

• ココログサポート：公式FAQ：エディターの初期表示を「リッチテキスト」にするか「通常エディター」にするか設定する
• ココログサポート：質問：「記事を編集」で、<ul>リストの前に余計な空白行が入る
• ココログサポート：質問：HTMLタグの崩れ <pre>,<ol></li>
• ココログサポート：質問：「記事を編集」で<div>の次に余計な<br />が入る

【現象：詳細】

　今の所、四つの不具合に突き当たった。番号付きリスト・番号なしリスト・整形済みテキスト・ブロック区切り＝<div>。以下にサンプルを示す。

１．番号付きリスト

　元の表示結果

ほんぶん

1. foo
2. bar

おわり

　元の HTML

<p>ほんぶん</p>
<ol>
<li>foo</li>
<li>bar</li>
</ol>
<p>おわり</p>

　これをリッチテキストで開くと…

ほんぶん

1. foo

1. bar

おわり

　そのHTMLは、こんな感じ。

<p>ほんぶん</p>
<ol>
<ol>
<li>foo</li>
</ol>
</ol>
<p> </p>
<ol>
<li>bar</li>
</ol>
<p>おわり</p>
<p> </p>

２．番号なしリスト：style= を指定すると崩れる。

　元の表示結果

てすと

• １
• ２

てきすと

　元の HTML

<p>てすと</p>
<ul style="margin-left: 2em; padding: 0pt;">
<li>１</li>
<li>２</li>
</ul>
<p>てきすと</p>

　これをリッチテキストで開くと、勝手に改行が入る。ちとこのサンプルは判りづらいけど、HTML で見て欲しい。

てすと

• １
• ２

てきすと

　そのHTMLは、こんな感じ。余計な段落や改行が勝手に入ってしまう。

<p>てすと</p>
<p> </p>
<ul style="margin-left: 2em; padding: 0pt;">
<li>１</li>
<li>２</li>
</ul>
<p>てきすと</p>
<p> </p>

３．整形済みテキスト

　元の表示結果

foo
bar

　元の HTML

<pre>foo
bar</pre>

　これをリッチテキストで開くと…

foo

bar

　そのHTMLは、こんな感じ。

<pre>foo<br />
bar</pre>

４．ブロック区切り＝<div>

　元の表示結果

divてすと２はじめ

いち

に

divてすと２終わり

　元の HTML

<p>divてすと２はじめ</p>
<div style="font-size: 0.9em; display: flex; flex-wrap: wrap;">
<div style="padding-left: 1em; max-width: 20em;">
いち
</div>
<div style="padding-left: 1em; max-width: 20em;">
に
</div>
</div>
<p>divてすと２終わり</p>

　これをリッチテキストで開くと、「いち」の前に空白行が入る。

divてすと２はじめ

いち

に

divてすと２終わり

　そのHTMLは、こんな感じ。

<p>divてすと２はじめ</p>
<div style="font-size: 0.9em; display: flex; flex-wrap: wrap;"><br />
<div style="padding-left: 1em; max-width: 20em;"><br />いち</div>
<div style="padding-left: 1em; max-width: 20em;"><br />に</div>
</div>
<p>divてすと２終わり</p>

【おわりに：考察】

　現在わかっている範囲では、どうやら私が挿入したHTMLタグ(＝リッチテキスト・エディタが挿入したのではないHTMLタグ)がお気に召さないみたい。「あんたなんか、アタシの言うとおりにしてりゃいいのよ！」ってわけ。わがままな奴だ。