不知道大家有沒有這種機會,但是何老師經常會在網頁文章中分享一些程式碼,由於程式碼不同於一般網頁的排版,所以如果直接寫在文章中會非常地不好看,因此需要有另外的排版方式。在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)
近期留言