【部落格圈】側邊欄隱藏／展開語法

【語法來源：建議使用 Firefox 點選該篇文章閱讀；
若使用 IE6 則該篇文章會掉落至其左側欄的下方。】
「側邊欄過長」困擾小婆已經很久了，也曾在之前修習學位的空檔試圖找到適合陽春 Blogger 所使用的版本，但一直都沒有著落；也百般不願意去使用 Blogger 進階版所提供的超醜三角形，於是乎就這麼地擱置著。

但「檔案文章（Archives）」以每個月增加一行的速度迫使小婆不得不再去找解決方案。

結果，前幾天又是在 Google 搜尋且測試某格主所提供之版本不適用後，在其訪客留言中挖到寶！

所以，順便瀏覽「訪客留言」是有其效用的。

>.^


小婆試了「Abin's Tech Note」格主所提供的程式碼，跑出來的版面和前幾個月數次的測試結果一樣；不信邪地看看其訪客留言中其他使用者是否也有類似的問題，於是乎輾轉數個連結畫面後就被小婆找到了期盼已久的答案。

在此，特別感謝「地球觀察之山頂秘密基地」格主 Boy39 不厭其煩地來小婆家留言糾正小婆語法使用上的錯誤。

以下是小婆的使用過程與修正心得。

● 步驟一：公用程式碼 ●

如 Boy39 格主所言，將下列語法拷貝貼入模版（Template）＜head＞與＜/head＞之間。【2008.12.06 修改更新】

＜head＞
...

【請自行向原創作者取得最新版程式碼之使用權同意】

...

＜/head＞

● 步驟二：參數程式碼 ●

經小婆測試結果，得將下列語法拷貝貼入模版（Template）＜body＞和＜/body＞之間。或許 Boy39 格主所提供的語法在 Firefox 行得通，但運用在小婆慣用的 IE6 則會碰壁。

＜body＞
...

<script language="javascript">_open86874988="http://lh3.google.com/chihkangwang/R7rqXBBgTXI/AAAAAAAAEDY/fdAmB82HFcM/s144/more1.png";_close86874988="http://lh5.google.com/chihkangwang/R7rrNhBgTaI/AAAAAAAAEDw/ew5TWTYX0EQ/s144/less1.png";</script>

...

＜/body＞

● 步驟三：執行程式碼 ●

如 Boy39 格主所言，將下列兩句語法分別放在想要隱藏段落的前【頭】與後【尾】。

<div><script>beginopensesame1("");</script><br/>

【想要隱藏段落的語法】

<script>endbeginopensesame1();</script></div>

簡單三步驟就解決了！

接下來就看兩則範例囉～

● 範例一：照表操課 ●

【點選上圖可放大看清楚】

S1-01. 小婆想讓整段想隱藏的「照表操課」居中放置，所以在【頭】＜div＞增列為＜div align="center"＞。

S1-02. 小婆想提醒自己該尾端位置，所以加了「"照表操課【展開／隱藏】"」在【尾】「endbeginopensesame1()」之括弧裡。

以上兩點和 Boy39 格主提供的語法略有不同，至少小婆從 IE6 以及 Firefox 看所修改後的版面都沒問題。

● 範例二：檔案文章 ●

【點選上圖可放大看清楚】

為求整齊美觀，小婆想讓所有的「按鈕＋標題＋【展開／隱藏】」居中放置，而且隨後所有的＜ul＞＜li＞藍色小豆鈕則居左排列，所以得再加上靠左排列指令。

S2-01. 小婆想讓按鈕和「檔案文章【展開／隱藏】」居中放置，所以在【頭】＜div＞增列為＜div align="center"＞。

S2-02. 小婆想讓整段附有藍色小豆鈕的「檔案文章」靠左排列，所以加了＜div align="left"＞以及＜/div＞收尾。

S2-03. 小婆想提醒自己該尾端位置，所以加了「"檔案文章【展開／隱藏】"」在「endbeginopensesame1()」之括弧裡。


小婆常強調「Blogging is for yourself and sharing with others.」

這次應用「隱藏側邊欄之語法」Boy39 格主還教導及提醒了小婆一件重要的事：

修改版面不可只利用自己慣常所用的 IE6 來檢查，還得用 Firefox 或 Safari 等其它瀏覽器來觀察。也就是說自己看得賞心悅目之餘，還得顧慮到別人是怎麼來看的。

感謝！

>.^