このブログはIT系の記事が多めでプログラムのコードを載せる事がしばしばあるのですが、
インデント(コードを見やすくする為の空白)が、コピペした時に消えてしまう事があり、非常にストレスでした。
一番厄介なのが、何回か
コピペ
↓
空白が消えたので削除
↓
再度コピペ
と繰り返すとそのままコピペされるので、
どういう原因で空白が消えてしまうのかが不明で更にストレスでした・・・。
コピペを繰り返す方法は非常に非効率で、何より精神衛生上良くないので、解決策を調べました。
正直納得できる解決策は見つかっていないのですが、暫定対応をメモ、という記事になります・・・。
▼Chrome拡張機能でゴリ押しも考えてみました▼
試したこと
テキストエディタに内容をコピペして、そこからWordPressにコピペする
コードを書く時に、プログラミング用のエディタを使いますが、そこから直接WordPressにコピペするのではなく、一旦テキストエディタにコピペして、そこからWordPressにコピペしてみました。
が、結果は変わらず空白が削除されました。
テキストエディタにコピペする事でプレーンテキスト扱いとなり、内容がそのままコピペされると思ったのですが・・・。
ツールボックスの「テキストとしてペースト」を使用してコピペする
使用しているWordPressによりボタンのデザインが違うかもしれませんが・・・。
私が使用しているテーマだと↓のボタンですね。
ですが、これもダメでした。中々厄介な。
自動整形に関係するプラグインの調査
自分が悩んでいる事は、大抵の場合世の中の誰かも悩んでいるもので。
調べてみると、以下のプラグインが見つかりました。(全て却下)
Tiny MCE Advanced(プラグインページ)
ビジュアルエディタを拡張するプラグイン。
このプラグインでビジュアルエディタの自動整形機能を無効化できるようだが、
他の記事にも意図しない編集が加えられてしまったとの内容が見かけられたので却下しました。
PS Disable Auto Formatting(プラグイン配布なし(?))
こちらは名前の通り自動整形機能を無効化する事に特化したプラグイン。
ですが、こちらも幾つか不具合のような報告があったので断念。
また、そもそもプラグインで自動整形機能の有効/無効を制御してしまうと、コードを書かない記事の場合、不都合がおきそうな・・・?
暫定的な妥協案
いわゆる運用で回避、という方法で対応。
いたって単純ですが、
テキストエディタモードで貼り付けてからビジュアルエディタモードに戻ってくる。
という事で現時点で妥協しました。
手数としては、
- テキストエディタモードに切り替え
- <pre>タグの追加(ツールボックスのボタン)
- クリップボードからコードをコピペ
- </pre>タグの追加(ツールボックスのボタン)
- ビジュアルエディタモードに切り替え
上記のように、実に5手もかかる。
ただコードを貼り付けるだけの手数にしては多い気がしますが、普通に貼り付けるとインデントが削除されて、
3回、4回やり直してもインデントが削除されてしまう、という事も多々あるので、
確実に5手でコピペできるのであれば良いか、という案で妥協しました・・・。
おわりに
Chromeの拡張機能で、
指定のドメインでのみ実行される。
クリップボードからの貼り付けイベントで発火。
貼り付ける内容の前後に指定のタグを付与。
みたいな拡張機能があれば、
- テキストエディタモードに切り替え
- クリップボードからコードをコピペ(拡張機能で前後にタグ付与)
- ビジュアルエディタモードに切り替え
上記3手でいけそう。
なんならモードの切り替えも拡張機能に任せられそうか。
であれば普通に貼り付けるだけ(=1手)でいける。
通常(URLとか、いわゆるコード以外)の貼り付け時には発火したくないので、指定のコマンドで発火という条件も必要か。
拡張機能がどこまでできるのかがわからん・・・。