ソースコードHTML化コンバーター「唐辛子」:サイトやブログ掲載用にコードを変換

ソースコードHTML化コンバーター「唐辛子」:サイトやブログ掲載用にコードを変換

ソースコードをHTMLに変換してくれるWEBサービス「唐辛子」のご紹介です

対応コードは「HTML」「CSS」「JavaScript」「PHP」「Ruby」など。

ソースコード HTML化 コンバーター「唐辛子」

「唐辛子」の使用手順

WEBサイトやブログにソースコードを掲載する場合に使用します。
コードをそのまま載っけると、滅茶苦茶な表示になりますからね。

掲載可能なように、pre要素などでタグ付けされたHTMLに変換してくれます。

使用手順は簡単です。
まずは「唐辛子」のサイトに行き、変換したいコードを貼り付けます。

使用する言語を選択して「変換」をクリックします。

下段の「code」欄に変換後のHTMLコードが生成されます。

このコードをコピペしてWEBサイトやブログに貼り付けてください。

こんな感じで表示されます(*画像です)↓

CSSで色付け

そのままだと味気ないので、CSSでコードに色を付けましょう。

こちらのCSSコードをWEBサイトやブログのCSSファイルに追加します。

そうすると色付きで表示されます(*画像です)↓

当ブログの場合は、「唐辛子」用のCSSをかなりいじってるので、こういう感じで表示されます↓

<table>
<tr><th>県名</th><th>面積</th><th>人口</th></tr>
<tr><td>福岡県</td><td>4,986.40km²</td><td>5,108,022人</td></tr>
<tr><td>大分県</td><td>6,340.74km²</td><td>1,156,503人</td></tr>
<tr><td>佐賀県</td><td>2,440.68km²</td><td>828,803人</td></tr>
</table>

CSSをいじれない場合は

ブログなどでCSSを自分でいじれない場合は、「HTML作成時~style 属性を直接指定する」にチェックを入れてから変換を行ってください。

そうするとHTMLコードに直接style属性で色付けしてくれるので、

そのままブログなどに貼り付けてください。

 

ken
このブログでもよく使っていて重宝しています