2014年4月10日 星期四

如何在Blogger貼上彩色程式碼

2014/05/13 增加說明

我GOOGLE了一下
官方不知道哪裡有程式碼能貼在Blogger上
雖然能免費下載原始碼真的是很大愛
但怎沒有給懶人貼JS和CSS樣式的程式碼
還要自己架JS以及CSS空間
之後在這裡找到了怎麼弄
但怎麼貼都出錯
可能HTML標準有改
在這裡我也小修改了一下內容
直接貼上應該沒問題


<link href="http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shCore.css" rel="stylesheet" type="text/css"/>
<link href="http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shThemeDefault.css" rel="stylesheet" type="text/css"/>
<script src="http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shCore.js" type="text/javascript"></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushJScript.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushXml.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushPlain.js' type='text/javascript'></script>
<script src='http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushPerl.js' type='text/javascript'></script>
<script language='javascript'>
  SyntaxHighlighter.config.bloggerMode = true;
  SyntaxHighlighter.all();
</script>

複製之後貼在Bloggre的範本-->編輯HTML
貼到</head>標籤之上就可以了
使用方式就是在你的程式碼頭尾部分包<pre>的標籤就行了
brush:後面屬性改你目前的程式語言即可(小寫建議)
使用範例如下
<pre class="brush: php;">
for($i = 0; $i < 100; $i ++) {
        echo $i;
} 
</pre>

沒有留言:

張貼留言