在網頁或文章中顯示程式原始碼

　　不知道大家有沒有這種機會，但是何老師經常會在網頁文章中分享一些程式碼，由於程式碼不同於一般網頁的排版，所以如果直接寫在文章中會非常地不好看，因此需要有另外的排版方式。在WordPress有一些現成的外掛可以使用，何老師推薦的是這一個：

　　在WordPress安裝了這個外掛之後，只要在你的文章的任何一個地方，加上［code］以及［/code］這個標籤，然後在這兩個標籤中加入你的程式語言原始碼，如下所示（記得在文字編輯模式下貼上，比較不會有問題）：

　　回到預覽編輯模式看不出來，可是當文章發表呈現在網頁上，就可以呈現是下面這個樣子，非常方便：

main() {
  int x, y;
  x=5, y=10;
  printf("hello, world!!n");
  printf("sum of x+y is %dn", x+y);
}

　　但是，如果你使用的不是WordPress網頁，或是不想要安裝這一個外掛，那也沒有關係，有一個網站專門幫網友把現有的程式碼轉成為HTML標準編碼，我們只要把轉換完成後的編碼，放在網頁中（不管是什麼系統，只要能夠接受HTML的地方），然後再存檔就可以了。這個網站叫做Hilite.me，進入這個網站之後，會先看到以下的畫面：

　　我們只要在畫面左側中貼上程式碼（在這裡我們以C語言做例子），然後選擇使用的程式語言以及色彩模式，再勾選要使用行號（Line Number），最後再按下「Hightlight!」按鈕就可以了。右側就會產生出可以使用的HTML碼，同時下方也會有輸出的樣子，如下所示：

　　轉換完成之後，我們把HTML複製下來，然後再回到我們的文章中或網頁中，在適當的地方把這些HTML貼上就可以了。下面就是呈現出來的樣子。

1
2
3
4
5
6

main() {
  int x, y;
  x=5, y=10;
  printf("hello, world!!n");
  printf("sum of x+y is %dn", x+y);
}

　　這個網站支援的程式語言非常多，大家可以多加運用喔。

(1782)