【mac, WordPress.com】ソースコード等の文字化けを解除する方法-🔵

最終更新日:2015-12-26

記事内にソースコードを貼っている状態で記事の再編集をすると、時として文字化けを起こすことがあります。

ここでは、すでに文字化けを起こしてしまった部分を元に戻す方法について、覚書したいと思います。

結論から先に言うと、私自身は、アプリ「PopClip」の「HTML Encode」という拡張機能を使って、

2015-12-24 at 7.58.jpg

HTML の記述等の文字化けを修正しています。

さらに 2015-12-24現在は、

[code]

ではなくて

2015-12-24 at 8.14.jpg

という Markdown 記法を使っています。今後、挙動が変わる可能性もありますが、現時点では Markdown 記法を使うと再編集をかけても文字化けを起こさないらしいと私自身が認識しているからです。

以下、具体的な文字化けの修正手順を記録します。

例えば、こんな感じで文字化けを起こしているものがあるとします。

2015-12-24 at 8.08

PopClip の拡張機能「HTML Encode」を使って文字化けを修正します。もし、うまくいかない場合は何回か繰り返すとうまくかもしれません。

2015-12-24 at 8.08

以上の操作で、例えば、こんな風な感じで文字化けが修正されます。

2015-12-24 at 8.09

次に [code] の部分を Markdown 記法に修正します。

2015-12-24 at 8.09

ビジュアルモードでは以下のような感じで表示されなかったり、HTML の記述そのものが機能してしまったりすることがありますが、

2015-12-24 at 8.22.jpg

ブログ上ではちゃんと表示されます。

2015-12-24 at 8.12

なお、文字化けの修正自体は、例えば、アプリ「Code 2」の「エンティティを解除」等でも修正する行うことができます。

2015-12-24 at 8.25.jpg