株式会社IKUSA

ソースコードをブラウザ上でそのまま表示させる方法

コーダーblog
若林 遼 若林 遼
2014.04.10

ブログにコードを書く方法

今回はタイトル通り、ソースコードをブラウザ上でそのまま表示させる方法について書こうと想います。

「<」→「&lt;」、「>」→「&gt;」と置き換える

<p>を表示させたければ&lt;p&gt;と記述します。
「&gt;」の「gt」は「greater than」、「&lt;」の「lt」は「less than」という意味で日本語の「大なり」「小なり」に対応してるので、それさえ覚えておけば書き方を忘れてもすぐに思い出せると思います。

ちなみに&amp;は、「&amp;amp;」と記述して表示しています。

他にもブラウザ上にソースコードを記述する方法がいくつかあります、詳しくは次の参考サイトにてご確認ください。
「ブラウザにソースコードをそのまま表示する基本的な方法」
http://www.life-gp.net/2013/06/blog-post.html

WordPressのプラグインでソースコードを表示させる方法

サイト構築にWordpressを使っている場合は、ショートコードを挟むだけでそのまま表示させることができる便利なプラグインがあります。
SyntaxHighlighter Evolvedはその中の一つです。
そのまま表示させたいソースコードを、[表示したい言語のショートコード] と [/表記したい言語のショートコード]のタグで囲むだけで表示させることができます。
詳しい導入方法は次の参考サイトにてご確認ください。
「エディタのように綺麗にソースコードを表示できるプラグイン – SyntaxHighlighter Evolved の使い方」
http://wordpresscollege.org/plug-in/syntaxhighlighter-evolved/

参考サイトに頼った記事になってしまった感じですね・・・次回までにブログの書き方を勉強しておきます。
この記事を参考にプログラムの記事を書く人が一人でも増えれば幸いです。
ではでは。

若林 遼
若林 遼

1987年、大阪出身。東京電機大学理工学部 平成25年卒。

大学卒業後、生きる目的を見失っていたところ救世主・米田氏と創造主・赤坂氏と出会う。
アルバイトをしながら職業訓練校に通い卒業後、TearsSwitch(現・株式会社IKUSA)に入社。
一人暮らしを始め、実家にて生卵を隠れて食べる生活から脱却。
新しいことに抵抗がなく、便利そうなら取り入れるのが強み。

お客様の笑顔を妄想しつつ、日々仕事に励みます。

人気記事

新着記事

同じカテゴリの記事

人気タグ