WordPressのビジュアルモードでEnterキーを押しても間が空かないのはdiv タグの大発生が原因だった件

ある日、文字のフォントが微妙に「お。。。んなじ。。。だよね?!。。。。」というレベルでバラバラになっている記事を発見しました。

おまけにこの記事は、ビジュアルモードでいくらEnterキーを押しても一向に間が空かないのです。

テキストモードで見てみると<div></div>という見慣れぬタグも増殖している。

思えば、この記事は 旧ブログからインポートしてきた記事でした。

当時の文字フォントが微妙に違う

当時の文字フォントが微妙に違う記事のキャプチャ。

なので、しばらく見ないふりして、手も付けていなかったと記憶しています。

「やっぱり変」と確信したのは他の人にも指摘されたから。

ここでやっと調査に踏み切ることになり、もう一つ不気味なことが起きているのに気付きました。

ビジュアルモードでEnterを押しても間が空かないのは「divタグ」が原因だった!

恐る恐るテキストモードで除いてみると<div></div>という見慣れぬタグが増殖している。

文章と文章の間を空けたくても空かないなあ。。。と、ヤケになって何度もEnterキーを押した分だけ増殖している模様。

他のブログサービスからインポートしてきた記事だったから?

何でこの記事だけ?

「ブログの記事風」を作って確認してみましたが異常箇所は見当たりませんでした。テキストモードで見ても「divタグ」も付いて来ませんでした。

訳がわかっていないので意味のないことを他にもいろいろやてみたりしました。

思い起こせば、あの記事は 旧ブログからこのブログにインポートした記事でした。

得体の知れない「divタグ」ですが勝手に削除するのも怖いですし、見た目上格好が整っても何か「タブー」があるかもしれないので一応先生に聞いてみました。

そして聞くところによると、この場合、これは取ってOKとのことだったので一つ一つ削除しました。

するとビジュアルモードでEnterキーを押しても間が開くようになり、文字のフォントも綺麗に揃うようになりました。

よくよく考えると、これは「ブログの下書き」に過ぎないので最悪削除してしまっても良かったんですよね。

「divタグ」にもちゃんと役割があるのでしょうが今回の場合は単に邪魔なだけでした。

タグがきれいに取れた記事は「ブログの記事風」に作ったのとは違い改行も段落も何もなくて活字だけがビッシリ隙間なく貼り付いてる状態になりました

あとは普通にこれを区切ればOK。

でも、ブログをインポート・エクスポートするとdivタグが発生するのかは謎。解ったら追記しに来ます。

効果的なタグ削除の方法

当時は1つ1つ目で「divタグ」を探して削除して。。。とかなり消耗しましたが、後にもっと効率的に削除できることを知りました。

プレーンテキストでコピペ

ビジュアルモードで「コピー」したものをテキストモードの方で、ただの「貼り付け」の代わりに「プレーンテキストとして貼り付ける」を使って貼り付けする。

こうすることによって<h2></p><div><p>&nbsp;</p>などが取れた状態で貼り付け出来る。

テキストモードで「プレーンテキストで貼り付ける」を選択。

隙間が一つもない状態でテキスト状態がベタベタと貼り付きます。一瞬です。

このことを「装飾の無効化」というそうです。

※プラグインの設定でコレが出来ない場合がある。

「プレーンテキストとして貼り付ける」が出来ない場合の対処法

きっちり左角隅から「プレーンテキストとして貼り付けをすると何故か上手く行きません。理由は解りませんがcss関係?

あとはプラグインの設定で出来ない場合も在ることを最近知りました。

「TinyMCEAdvanced」というプラグインの「クラッシクブロックとクラッシクエディター内のパラグラフタグを保持」のチェックが入っていると「装飾の無効化」が出来ないようです。

↓拡大図

ブログ執筆作業がし辛くなっていたら、作業後もとに戻すと良いのかも知れません。良く解りません。

divタグをページ内検索すると隈無く探せる

「divタグ」を隈無く探せる便利なツールがあったことを当初知らなくて残念でした。

「ページ内検索」を使うと速かった。

ブラウザの3点アイコンから「検索」を選択すると「ツール」が出てきます。

これで、ページ内に在るキーワードを隈無く探すことが出来るようになります。

黄色や異レンジになっている箇所を1つ1つ削除していけば良いわけです。

タイトルとURLをコピーしました