文字実体参照変換サイト メモ | 南大阪・松原市で働く行政書士のブログ

文字実体参照変換サイト メモ

現在のところ、アメブロで記事を書く際には「標準エディタ」と「タグ編集エディタ」のどちらかを選ぶことが出来ます。

基本設定で選択することも可能
エディタ設定


標準エディタの方が普通に文字を打っていけば良いだけなので、簡単といえば簡単。

しかし何故か後から見ると、変な段落になっていたり、リンクのタグがぐちゃぐちゃになっていたりと妙な動きをしていることも多いです。

その為、ある程度HTMLがわかる人にとっては、タグ編集エディタの方が使い勝手がいいとされています。

ちなみに自分もタグ編集エディタを使用しています。

これは書き込む時のブラウザがChrmePlusなので強制的にタグ編集エディタしか選べないというのもありますが、やはり総合的に考えてこちらの方が書きやすいというのが大きな理由。


しかし、タグ編集エディタを使用する場合に1つ問題があります。
それは説明の為にHTMLタグなどを文中に記述すると、普通にタグとして認識され、変換して表示されてしまう事です。

どういうことかと言えば、

例えば
<a href="http://ameblo.jp/insomniac-rabbit/" target="_self">南大阪・松原市で働く行政書士のブログ</a>


というコードをそのまま記述すると
このように↓↓
南大阪・松原市で働く行政書士のブログ

表示されてしまいます。

考えてみれば当然の話ですが。


■ブログ記事の中でソースを表示するには

そこでHTMLなどのタグをブログ内の文中にそのまま表示させたい場合には、少し書き換えを行う必要があります。

「<」→「&lt;」
「>」→「&gt;」

↑こんな風に

上記のコードであればこう記述すればOK。
&lt;a&nbsp;href=&quot;http://ameblo.jp/insomniac-rabbit/&quot;&nbsp;target=&quot;_self&quot;&gt;南大阪・松原市で働く行政書士のブログ&lt;/a&gt;

ちゃんと↓↓このように表示されます。
<a href="http://ameblo.jp/insomniac-rabbit/" target="_self">南大阪・松原市で働く行政書士のブログ</a>


これらの作業を「文字実体参照」とか「実体参照変換」などと呼びます。

詳しくは
文字参照とは
HTMLで使える文字実体参照


もちろんですが、この変換をいちいち手作業でやっていたのでは非常に面倒。

そこでネット上を探してみると、親切にもこの「実体変換」を簡単に代行してくれるサイトがいくつもありました。

HTML実体参照変換
http://www.akiyan.com/htmlspecialchars

HTMLエンコードフォーム
http://kawama.jp/php/encode_html.php

ソースを「そのまま表示する為のHTMLソース」に変換
http://blogtool.flatlabs.net/source.html

プログラムソースかんたん変換
http://filter.webings.net/

文字列 → 数値実体参照変換(こちらは数値実体参照なので少し違います)
http://yasu.asuka.net/orkut/conv.html

使い方はどこもほぼ同じ。
探せばまだまだあるでしょう。

ありがたい事に全部無料で使わせてもらえます。

ただし、無料なだけにいつサイト自体がなくなってしまうかわかりませんので、複数のサイトをブックマークしておくと便利です。


もしローカルで済ませてしまいたいのであれば、こんなフリーソフトもありました。

HTMLソース実体参照変換フォーム
http://www.nishishi.com/soft/ws/

何かと助かります。