輕鬆擴充 Xuite 功能: xuite_ext.js

* 源起:
由於推出了 輕鬆擴充 Blogger 功能: Blogger_ext2.js 後，阿土伯的一堆在 Xuite.net 朋友(老婆大人也是)紛紛來信關心，在頻頻要求下，昨天已經完成了 Roodo 部份，今天將 blogger_ext2 也 porting 到 Xuite 上，算是給 Xuite 朋友的賀年禮物嘍!!(老婆大人我完成了~~~)
真的所謂欠債不要欠過年嘛 :D

* 功能簡介:
以目前 xuite_ext 0.1.1 來說，它提供了大部份 Xuite Blog 所需的功能，且全部只要 3.3 KB，相當的短小精幹唷。

對於不需要所有功能的進階使用者，您可以選用進階安裝，只要 1.1KB。

• 可以隱藏 ##HIDEME## 的自定欄位，讓您輕鬆加入 javascript 。


• 可以使用 Blogger Smiley 介紹的表情符號功能。


• 所有功能支援設定選項來控制是否開啟。


• Sidebar 中的網頁元素 可以自定元素 "[-]折收/[+]展開" 功能。


• 表情符號可外掛及設定。如: :) :D


• 加入了表情符號集 .js ，直接引用。

* 運作方式:
它是利用 "文件載入完成(document ready)"後，再重新為您的網誌加上新功能，可以想成 "重新為您的網誌排" 。
它是針對 Xuite Blog 的內建功能加以擴充，讓您不懂 HTML 亦能輕鬆使用來豐富您的 Blog。

##CONTINUE##
* 如何使用(手動快速安裝 all-in-one 8KB):

• 先進入管理者後台 http://blog.xuite.net/_manager/




• 自訂欄位 - 自由欄位設定


• 新增欄位


• 在 "欄位名稱" 填入 

  
  ##HIDEME##
  



• 在 "本文": 中填入 

  
  <script src='http://blogger-ext2.googlecode.com/files/jquery.pack.js' type='text/javascript'></script>
  <script src='http://blogger-ext2.googlecode.com/files/xuite_ext-0.1.1.pack.js' type='text/javascript'></script>
  <script type='text/javascript'>
  // 設定下一行開始
  </script>
  



• 面板管理 - 版面編排


• 將 ##HIDEME## 自由欄位拉到您的網誌中。


• OK!

* 進階安裝:
由於 xuite_ext 全面採用 plugins 的方式來擴充。
所以，如果您不會用到所有的功能或您熟悉網頁語法及設計，您可以使用進階安裝的方式來使用，讓 xuite_ext更具彈性。
整個 xuite_ext核心只要  1.1KB，滿足對大小及速度及客製化十分講究的玩家。
同手動快速安裝，一樣是將語法放在 "Blog 基本設定-說明" 中，同上，不再重覆，僅說明 Script 語法上的差異。

<script src='http://blogger-ext2.googlecode.com/files/jquery.pack.js' type='text/javascript'></script>
<script src='http://blogger-ext2.googlecode.com/files/xuite_ext-core-0.1.1.pack.js' type='text/javascript'></script>

其後再引入您所需要的功能 plugins ，如您需要 "表情符號功能" 則在上述二行後再加入一行:

<script src='http://blogger-ext2.googlecode.com/files/xuite_plugin_replace_smiley.pack.js' type='text/javascript'></script>

* 隱藏 自由欄位

• 內建功能，不需安裝。讓您可以加入任何的 Html 自訂元素 來擴充你的 Blog, 只要 "欄位名稱" 是 ##HIDEME## 則會自動隱藏。


• 功能設定:

  
  // true = 隱藏 false = 不隱藏
  BloggerExtOptions.hide_sidebar_html_markup = true;
  

* 表情符號 plugin:
直接在您的文章中打入表情符號之代碼，如同您在 IRC / MSN / AOL / Yahoo 等 IM 使用的代碼，本 plugin 會自動為您代換成圖片。
詳細說明，請參考部落格會笑了！Blogger Smiley！ 一文。

• All-in-one 版本內建，不需安裝。若您使用進階安裝，請引入: (1.7KB)

  
  <script src='http://blogger-ext2.googlecode.com/files/xuite_plugin_replace_smiley.pack.js' type='text/javascript'></script>
  



• 功能設定:

  
  // 表情符號功能開關
  // true = 開 false = 關
  BloggerExtOptions.replace_smiley = true;
  // 自定的表情符號集，或請參考下面範例置換
  // BloggerExtOptions.smilies = [];
  

當然，您可以自已加入您或設定您專屬的表情符號(0.5b 設定功能)
idben's表情符號集設定範例: (10)

<script src='http://blogger-ext2.googlecode.com/files/emotionset_benjamin.js' type='text/javascript'></script>

Yahoo Messenger 動態表情符號集(default): (54)

<script src='http://blogger-ext2.googlecode.com/files/emotionset_yahoo.js' type='text/javascript'></script>

MSN 動態表情符號集(0.6.1b GeniusKiKi提供): (60)

<script src='http://blogger-ext2.googlecode.com/files/emotionset_msn.js' type='text/javascript'></script>

* Sidebar 側邊網頁元素 折收/展功 功能:
側邊中的網頁元素，越加越多，整個側邊條長長長… 也來給他自動 收納 一下吧。
只要將 Sidebar 欄位的 "欄位名稱" 填入設定中，這些元件就自動收納啦!!!

• All-in-one 版本內建，不需安裝。若您使用進階安裝，請引入:(1.2KB)

  
  <script src='http://blogger-ext2.googlecode.com/files/xuite_plugin_sidebar_widget_expandable.pack.js' type='text/javascript'></script>
  



• 功能設定:

  
  //側邊功能 // true = 開 false = 關
  BloggerExtOptions.sidebar_widget_expandable = true;
  // 動態展開時，是否使用動畫效果
  BloggerExtOptions.sidebar_widget_expandable_animate= false;
  // 測邊展開的 html 語法，可以是圖 img 或任何 html 語法
  BloggerExtOptions.sidebar_widget_expan_title = '[+]';
  // 使用圖形而非文字範例
  // BloggerExtOptions.sidebar_widget_expan_title='<img border="0" src="你的圖片位址" align="left"/>';
  // 測邊關閉的 html 語法，可以是圖 img 或任何 html 語法
  BloggerExtOptions.sidebar_widget_collapse_title = '[-]';
  // 使用圖形而非文字範例
  // BloggerExtOptions.sidebar_widget_collapse_title='<img border="0" src="你的圖片位址" align="left"/>';
  // 要收納的元件 id
  BloggerExtOptions.sidebar_widget_expandable_ids = ['最新文章','最新回應','日曆'];
  

* Source Code:
本專案是一個完全 open source 的專案，歡迎大家使用及修改開發。
http://blogger-ext2.googlecode.com/svn/trunk/
若您亦寫了 plugin ，請將您的 plugin link 給小弟，小弟把它加入我的說明中...

* 開發 plugin :
roodo_ext 是一個 plugin base 的開發環境，所有在下寫的擴充也都是以 plugin 方式掛入。
您可以很容易的一起設計 plugin , 請參考 DIY 利用 blogger_ext 擴充 Blogger 功能!

* 其它功能:
待續
…
歡迎大家引用及給小弟建議。
好了， xuite.net 也補完了，沒有欠過年了，有名大站由於維修，所以也不用試了年再說。


* DEMO:
http://blog.xuite.net/racklin/java/

* Change Log:

• 0.1.1: 加入 sidebar widget Icon 圖示功能。


• 0.1.1: 表情符號可外掛及設定。


• 0.1.1: 加入 sidebar widget 折收功能。


• 0.1.1: 加入 表情符號功能。