以我為中心的宇宙

word 2007發佈部落格文章最大的不便，就是沒辦法上傳圖片了~~對我這種「視覺系」的發文法，當然只好另覓良方嚕... 使用了兩天，整理一下它的優點

類Word文書編輯器 ─ 對常編寫部落格文章，而且喜歡排版文章使易於閱讀...WLW絕對會讓這件事做起來更加愉快

各種檢視模式 ─「檢視」功能表，讓編輯文章過程可以選擇不同模式的版面檢視。「版面配置」，就是像DW的「設計模式」；「HTML編碼」就是像DW的「原始碼模式」，其它從字義應該就可以了解其不同之處，或是自己親手試試應該就能理解嚕

編修文章 ─ 從「檔案」─＞「開啟內容」，分別針對三種文章進行編修，

• 一是草稿(已經編寫但還沒發佈到部落格的文章) 、


• 二是最近張貼的內容(由本機編寫且已發佈至部落格的文章)、


• 三是部落格文章

在這樣的編輯模式下，留在本機上的文章可以做為部落格的備份，而第三種文章，當編修完畢，直接按「發佈」，就可以同步更新部落格上的文章。

插入圖片 ─ 這是我使用WLW最主要的原因，可以方便的插入圖片，而且會自動上傳到picasa

• 它支援檔案式的貼法，也就是複製圖檔後，在欲插入的位置直接貼上即可，當然也可以從「插入」功能表，去插入圖片


• 當圖片插入完成，點選圖片可以由左方的「提要欄位」，做進階設定

接續 用word2007寫Blogger 後，繼續試用的離線編輯軟體是也同樣屬於微軟Windows Live體系的Windows Live Writer (簡稱WLW)，界面和輕巧版的word很像，常用Word的人應該很容易就能上手...

下載：download Windows Live Writer

安裝好之後執行，選擇已有部落格設定 因為我是Blogger，所以選擇「其它的部落格服務」 把部落格資訊填入 設定完成! WLW的工作界面 會想用WLW，除了方便的編輯界面，也是因為想發文章時能一次發到不同blogger。首先新增第二個帳號，從上方功能捷徑表，按「部落格」─＞「新增部落格帳號」 或是「工具」─＞「帳號」─＞「新增」 帳號設定完成

自從班板Blogger開張後，為了方便一次發佈文章到不同的Blogger帳號，所以開始關注離線編輯軟體...第一套試用的軟體，就從Word2007開始體驗之旅嚕~
Step1. 打開word2007之後，新增文件，選擇「新增部落格文章」
Step2. 這時如果還沒有在word2007設定帳戶時，就會出現下面的視窗讓你註冊新帳戶
Step3. 首先選擇部落格提供者─BSP(Blog Services Provider)，這裡除了Blogger外還有Windows Live Space、SharePoint、WordPress…等等國內外知名的 BSP 可以選擇，如果在清單中沒有自己的 BSP (例無名、天空等)，可以選擇「其它」去設定自己的 BSP
Step4. 設定帳號，這就不用多說嚕，把自己的帳號密碼打進去，如果覺得密碼被記住不安全，就不勾選「記住密碼」
Step5. 因為我的帳號裡擁有不止一個Blogger，所以會問要使用那一個來發佈文章，
按確定後會出現警告視窗，直接按「是」就可以了
Step6. 接著是設定圖片上傳功能，很不幸word2007不支援blogger圖片上傳功能，如果各位看倌有知道能上傳圖片方式請不吝指教嚕^^"
Step7. 設定完成
Step8. 註冊好帳戶就可以開始來寫文章了，寫好之後按上方工具列─「發佈」，就可以把文章發佈到Blogger嚕，很簡單吧\(^^)
結語：word2007可惜的地方就是不能上傳圖片，而且也不能編輯html，也試用了工具列上的「開啟現有」，雖然可以列出目前部落格上的文章列表，但並無法順利進行原有文章編修
除此之外做為一個純文字文章編輯上傳還算不錯，想把文章同時發佈到另一個部落格也很便利唷

最近想趕快把班上的blogger弄出來，於是一些啦哩咧雜的功能當然都拿自己的blogger當白老鼠~就以這篇文章當做筆記，做一個簡單記錄嚕

2008.05.11 加入圖片LightBox特效，在文章中插入圖片以縮圖呈現時，用滑鼠點擊，原尺寸圖片就在原頁面展開

2008.04.27 加入標籤雲(Label Cloud)，適用於文章篇數和標籤有一定數量的時候。
參考資料：增強標籤分類功能: 標籤雲 (Label Cloud)

2008.04.22 加入單篇文章中相關文章(Related Post)的功能
參考資料：Abin's Tech Note:加入相關文章功能 (Related Post)

2008.01.20 加入繼續閱讀功能，詳細作法就記錄在 這裡
參考資料：Abin's Tech Note:首頁長篇文章的收合

預設的blogger都會有這麼一條工具列，有的使用者會覺得它影響了整體版面想拿掉它…
拿掉它的方法就是，在範本裡找到把"展開小裝置範本"打勾，然後找到
]]></b:skin>
這一行改為
#navbar-iframe { height:0px; visibility:hidden; display:none }
]]></b:skin>

用了blogger之後，才發現這兒不像Xuite、無名…等其它網誌有自動摘要的功能...文章一多之後，如果文章太長，就會讓首頁看起來很「落落長」，記錄一下我使用的方法，google一下有很多不同的版本，我選一個不太自動，但適合我的寫作習慣的方式來用，原作者文章教學網址在這兒...
step1. 先到版面配置->修改HTML，並且把 展開小裝置範本 打勾，程式碼搜尋找到 <b:skin><![CDATA[ ，<b:skin>這個tag之間都是放CSS的地方，在這裡找個位置貼上第一部份程式碼。
<b:skin><![CDATA[ 第一部份程式碼 ]]></b:skin>
第一部份程式碼：
span.showDetail {
float: left;
border: 0px;
font-size: 8pt;
margin: 10px 0 10px 0;
padding: 0 10px 0 0px;
}
span.hideDetail {
display: none;
float: right;
border: 1px solid #333;
font-size: 8pt;
margin: 10px 0 10px 0;
padding: 0 10px 0 10px;
}
step2. 接著在]]></b:skin>和</head>之間找位置貼上第二部份程式碼，要注意的是，這邊要把程式碼先把"<"替換成&lt ;。
]]></b:skin> 第二部份程式碼 </head>
第二部份程式碼：
<!-- User defined inline javascript -->
<script language='javascript' type='text/javascript'>
<!-- Script functions for show detail article checking: showDetail(), hideDetail(), checkDetail() -->
function showDetail(id) {
  var spans = document.getElementById(id).getElementsByTagName('span');
  for (var i = 0; i &lt; spans.length; i++) {
    if (spans[i].id == 'detail' || spans[i].id == 'hideDetail')
      spans[i].style.display = 'inline';
    if (spans[i].id == 'showDetail')
      spans[i].style.display = 'none';
  }
}
function hideDetail(id) {
  var post = document.getElementById(id);
  var spans = post.getElementsByTagName('span');
  for (var i = 0; i &lt; spans.length; i++) {
    if (spans[i].id == 'detail' || spans[i].id == 'hideDetail')
      spans[i].style.display = 'none';
    if (spans[i].id == 'showDetail')
      spans[i].style.display = 'inline';
  }
  post.scrollIntoView(true);     
}
function checkDetail(id, link) {
  var spans = document.getElementById(id).getElementsByTagName('span');
  for (var i = 0; i &lt; spans.length; i++) {
    if (spans[i].id == 'detail') {
      spans[i].style.display = 'none';
      document.write('&lt;span id=showDetail class=showDetail&gt;');
      document.write('&lt;a onclick=javascript:showDetail(\&quot;'+id+'\&quot;); href=javascript:void(0);&gt;完整閱讀...&lt;/a&gt;');
      document.write('&lt;/span&gt;');
      document.write('&lt;span id=hideDetail class=hideDetail&gt;');
      document.write('&lt;a onclick=javascript:hideDetail(\&quot;'+id+'\&quot;); href=javascript:void(0);&gt;文章收合...&lt;/a&gt;');
      document.write('&lt;/span&gt;');
    }
    else {
      if (spans[i].id == 'fullpost') {
        spans[i].style.display = 'none';
        document.write('&lt;span id=showDetail class=showDetail&gt;');
        document.write('&lt;a href=\"'+link+'\"&gt;閱讀全文...&lt;/a&gt;');
        document.write('&lt;/span&gt;');
      }
    }
  }
}
</script>
step3.
找到 <div class='post-header-line-1'/> 這一行
<div class='post-header-line-1'/>
第三部份程式碼：修改加入下列紅色字體的程式碼。
<div class='post-body' expr:id='"post-" + data:post.id'>
<!-- Add show detail check -->
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
<b:else/>
<style>#detail, #fullpost {display:none;}</style>
<p><data:post.body/></p>
<script type='text/javascript'>
checkDetail("post-" + "<data:post.id/>", "<data:post.url/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
<div>
第三部份程式碼會因為使用的Blogger TEMPLATE而有所差異，在im93使用的版型沒有 <div class='post-body'>這個<div>標籤，如下圖：
所以，修改這一段時，要在 <div class='post-header-line-1'/> 這一行的下方自己加一個<Div>標籤。
修改前：
<div class='post-header-line-1'/>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
修改後：
<div class='post-header-line-1'/>
<div expr:id='"post-" + data:post.id'> <!-- Add show detail check -->
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
<b:else/>
<style>#detail, #fullpost {display:none;}</style>
<p><data:post.body/></p>
<script type='text/javascript'>
checkDetail("post-" + "<data:post.id/>", "<data:post.url/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
step4. 使用方法，發佈新文章時，把摘要部份打在前面，想要隱藏的文章內容放在
<span id="detail"></span> 或 <span id="fullpost"></span> 裡面就可以了
例如:
這是文章的摘要，這是文章的摘要，這是文章的摘要...<span id="fullpost">這是剩餘文章的內容</span>
至於 "detail" 和 "fullpost" 的差別 是，前者文章會直接顯示在目前頁面，後者則會將頁面連結到所屬的文章獨立連結頁面做全文顯示 (聽不懂的話...就自己試試咩 冏...)
另外一個小技巧是，可以到blogger管理後台，設定->格式，然後找到最下方文章範本的地方，設定預設格式

在Blogger裡，加入網頁元素的 "資訊提供"，可以訂閱外站的RSS
但似乎效果是一個Widget只能訂閱一個RSS，然後可以選擇訂閱最新幾篇
可不可以改成設定像無名或Pixnet一樣，一個Widget訂閱好幾個RSS
而顯示RSS站名以及文章標題