年紀大了有些事容易忘記... 所以.....

星期四, 3月 27, 2014

Blogger 外掛及調整安裝備忘錄

怕自己忘記所以做個記錄

1.Blogger 崁入 SyntaxHighlighter
2.Blogger 崁入 標籤雲 Tag Cloud


※加入 SyntaxHighlighter
進入管理介面→範本→編輯HTML
將下列語法貼至 </head> 下面

<!-- Syntax Highlighter Additions START -->
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> 
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeEmacs.css' rel='stylesheet' type='text/css'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>   
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushAS3.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushColdFusion.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDelphi.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDiff.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushErlang.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushGroovy.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJavaFX.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPowerShell.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushScala.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>    
<script language='javascript' type='text/javascript'>  
SyntaxHighlighter.config.bloggerMode = true;  
SyntaxHighlighter.all(); 
</script> 

使用方法
<pre class="brush: php; html-script: true">
 程式碼
</pre>

不過貼在內容裡要先將特殊符號編碼過,可至下列網站進行轉換
http://www.opinionatedgeek.com/DotNet/Tools/HTMLEncode/Encode.aspx

參數可參考下列圖表
http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/



※加入標籤雲 Tag Cloud
1.進入管理介面→版面配置→新增小工具→標籤
2.範本→編輯HTML
3.將下列程式碼取代至 <b:widget id='Label1' 開始至 </b:widget> 結尾處

<b:widget id='Label1' locked='false' title='標籤雲' type='Label'>
   <b:includable id='main'>
   <b:if cond='data:title'>
   <h2><data:title/></h2>
   </b:if>
   <div class='widget-content' style='text-align: justify;'>
   <script type="text/javascript">
   /*
   Simple Blogger Tag Cloud Widget
   by Raymond May Jr.
   http://www.compender.com
   Released to the Public Domain
   */

   //Variables:
   var max = 150; //max css size (in percent)
   var min = 50; //min css size (...)
   var showCount = 1; // show counts? 1 for yes
   var minCount = 1; // what is the minimum count for a Tag to be shown? 1 for all.

   //Begin code:
   var range = max - min;

   //Build label Array
   var labels = new Array();
   <b:loop values='data:labels' var='label'>
   labels.push("<data:label.name/>");
   </b:loop>

   //URLs
   var urls = new Array();
   <b:loop values='data:labels' var='label'>
   urls.push("<data:label.url/>");
   </b:loop>

   //Counts
   var counts = new Array();
   <b:loop values='data:labels' var='label'>
   counts.push("<data:label.count/>");
   </b:loop>

   //Number sort funtion (high to low)
   function sortNumber(a, b)
   {
   return b - a;
   }

   //Make an independant copy of counts for sorting
   
   var sorted = counts.slice();
   //Find the largest tag count
   var most = sorted.sort(sortNumber)[0];

   //Begin HTML output
   for (x in labels)
   {
     if(x != "peek" &amp;&amp; x != "forEach" &amp;&amp; counts[x] >= minCount)
     {
       //Calculate textSize
       var textSize = min + Math.floor((counts[x]/most) * range);

       //Show counts?
       if(showCount == 1)
       {
          var count = "(" + counts[x] + ")";
       }else{
          var count = "";
       }

 //Output
 document.write("<span style='font-size:" + textSize + "%'><a href='" + urls[x] + "'>" + labels[x] + count + "</a></span> " );
 }
   }
   </script>
   </div>
   </b:includable>
</b:widget>

※相關網址
SyntaxHighlighter
http://alexgorbatchev.com/SyntaxHighlighter/

HTML Encoder
http://www.opinionatedgeek.com/DotNet/Tools/HTMLEncode/Encode.aspx