轉載須知：
本部落格的文章不允許未經告知的全篇及部份轉載，若有需要轉載或引用請先留言通知我。（想轉貼到噗浪、facebook、twitter上的人也請留言通知，謝謝。）

※本篇教學所使用的語法和教學原出處為敗家誌的調用jQuery特效實作(Tab控件篇)。

原本的教學主要是給wp的使用者用的，但是因為我不熟php的關係，想要放進去切換的欄位都不能用（像是最新回應之類的），再加上我的wp原本就沒有這麼多側邊欄，其實也不太需要這功能，所以就乾脆拿去我的忍者Blog用了。當然，這篇教學的範例展示也請到我的忍者Blog觀看。

基本上只要使用的網誌能夠修改樣式的html和css欄位就可以使用這個效果，所以同理FC2 Blog應該也能夠使用，有興趣的人可以試試看。

首先請把這篇文章中所提到的Tab控件語法下載下來（在步驟一的地方），解壓縮之後用忍者的檔案上傳功能上傳，並把檔案的網誌紀錄下來。

接著打開忍者Blog的樣式修改小幫手（在「テンプレート設定/編集」裡找到你想修改的樣式，點選「修正」）會出現這樣的畫面：

（點圖可放大）

接下來就跟這篇文章中寫的一樣，把步驟一裡的語法貼到上方「HTML」欄位裡的</head>之前（記得自己修正網址的部份）。然後再把步驟二的語法貼到「CSS」欄位裡，要放哪就看個人習慣囉。

貼完之後記得儲存樣式，然後再回到忍者Blog的管理介面，點選「プラグインの設定」新增一個「フリーエリア」欄位。

接著再將這篇文章中步驟三的語法貼進去，自己修改內容就行囉。（修改方式請自行摸索）目前測試過部落格小樹和Sitetag都可以正常顯示，一般的文字或圖片也沒有問題。

最後，這個效果並不會讓側邊欄的載入速度加快，只是隱藏一些內容讓畫面看起來比較乾淨而已，有點像是選單的開合功能這樣。看完教學之後若有什麼疑問再留言問我吧

轉載須知：
本部落格的文章不允許未經告知的全篇轉載或部份引用，若有需要轉載或引用請先留言通知我。
（想轉貼到噗浪、facebook、twitter上的人也請留言通知，謝謝。）

這次來教大家怎麼自己更換噗浪時間軸的背景。

需要準備的東西有兩項：
1.一張夠大的圖。
2.一個不會雞婆幫你縮圖的免費空間。

那……圖該多大才好呢？找不到免費空間怎麼辦呢？沒關係，繼續看下去就知道了。

背景圖的尺寸：

首先，請找一張你想替換的背景圖，因為河道是長形的，所以這張圖基本上也是長方形的。
河道的高度大約是390px左右，所以這張圖的高度最好介於「385～410px」之間。
（如果你是想讓小圖案不斷重複來裝飾河道的話，那高度就沒有限制了。）
至於長度，因為現在使用寬螢幕的人越來越多了，
所以這張圖當然是「越長越好」，或者是「邊緣可以接起來，就算連續排列也不會很醜」。
我自己在做版面時畫的圖，最後都會後製成長度超過1400px的背景圖。

總結以上的說明，這張圖的大小就大約是「1400x400(長x高)px」。

免費空間哪裡找？

如果有人跟我一樣有租空間，當然是不用擔心會被縮圖的問題，但是如果沒有租空間，想使用免費空間上傳圖檔的人，大概都會面臨圖片被縮小、或是尺寸太大無法上傳的困擾。
像我常常使用的Flickr和Photobucket都是這樣，所以這兩個空間就不能用了。

雖然我自己是使用自己租的空間上傳圖檔，但因為我會將自製的噗浪版面分享出去，如果太多人套用的話也很吃流量，所以我在這裡提供幾個我目前拿來放這些大圖的空間：

1.miroko
這是我主要使用的免費空間，只要將圖上傳到「我的文件」裡的「個人首頁」 資料夾裡，就可以外連了。
根目錄是「http://帳號名.miroko.tw/」（如果有另外新增資料夾放圖的話，記得網址要自己修改。）

2.ImageShack
傳說中的青蛙空間，記得上傳時要選擇「Do not resize（不要縮圖）」，如下圖紅色框框所示。

（點圖可放大）
上傳之後按「View full size」或者是複製下面「Direct Link」旁邊的連結就可以拿到原始圖檔的連結囉！詳情請看下圖。

（點圖可放大）

（結果竟然做起空間教學……Orz）

時間軸背景的語法：

還是一樣，要更改語法前，請先確定你的噗浪樣式裡面沒有相同的語法喔～

時間軸背景的語法：
/* 對齊左上角，不重複 */
#timeline_holder {background:  url(圖片網址) left top no-repeat;}
或者是
/* 對齊左上角，在X軸重複排列 */
#timeline_holder {background:  url(圖片網址) left top repeat-x;}
如果是想用小圖案重複排列來填滿河道的話，就用這一種
/* 重複排列 */
#timeline_holder {background:  url(圖片網址) ;}
（以上三種請依個人需要選擇使用，一次只能用一種。）

要確認是不是有重複的語法，請自行搜尋CSS欄位內有沒有「#timeline_holder」字樣，
如果有的話，就把該語法刪掉，直接套用我上面提供的語法，或者是更改語法中「圖片網址」的部份。

修改之後按儲存然後更新一下噗浪頁面，應該就可以發現你的時間軸背景已經換成你自己的圖囉～

轉載須知：
本部落格的文章不允許未經告知的全篇轉載或部份引用，若有需要轉載或引用請先留言通知我。
（想轉貼到噗浪、facebook、twitter上的人也請留言通知，謝謝。）

噗浪的好友功能可以讓人自己決定是否要答應對方的好友申請，不過粉絲就不能夠拒絕了。（鎖河道的沒這困擾）
但如果一天到晚有廣告帳號或是煩人的傢伙來加好友，像照三餐申請一樣，那就算可以拒絕，還是很厭煩。更有些人相當注重自己隱私，希望不要讓偶然連到自己噗浪的人一看就知道自己加了誰好友，但是噗浪的版面就長這樣，沒有辦法選擇不要公開好友名單，怎麼辦呢？

沒關係，現在我們可以用CSS把好友跟粉絲欄暫時隱藏起來，至少可以擋掉一些亂槍打鳥隨便亂加人的帳號！

注意：語法的效果只能將好友和粉絲欄暫時隱藏，無法完全拿掉加好友和粉絲的連結，或是讓好友和粉絲清單完全消失。

隱藏好友欄的語法：
#dash-friends-pics .user_link {
filter: alpha(opacity=0)!important; opacity: 0.0!important; -moz-opacity: 0.0!important;
}
#dash-friends a {
filter: alpha(opacity=0)!important; opacity: 0.0!important; -moz-opacity: 0.0!important;
}

隱藏粉絲欄的語法：
#dash-fans-pics .user_link {
filter: alpha(opacity=0)!important; opacity: 0.0!important; -moz-opacity: 0.0!important;
}
#dash-fans a {
filter: alpha(opacity=0)!important; opacity: 0.0!important; -moz-opacity: 0.0!important;
}

只要把上面的語法加進噗浪的自訂CSS欄位裡，再按「儲存並更新」就大功告成了。

（「我的檔案」隔壁的「編輯」點進去後選擇「自訂外觀」頁面就可以看到自訂CSS欄位。）

以上就是這次的隱藏好友及粉絲欄教學，有任何意見或問題歡迎在下面留言。

實在是又窄又小，要打的字太多的話還要先按一下方向鍵「←」回應欄才會自己變大，像我常常一次打一大串字，這樣的設計真的很麻煩。

所以我就自己把它改大了。以下就把我使用的語法貼上來，有需要的朋友可以自行修改。

※若是已經有套用Plurk樣板或是輸入欄已經有修改過，但是想再把它加大的人，請先自行確認自訂CSS欄內是否有相同語法，避免語法重複影響效果。

本教學文需使用Plurk的自訂樣板CSS功能，不知道此功能如何使用的人請看這篇文章。

控制回應輸入欄大小的選擇器為「#input_small」，所以整串語法就是：

/* 回應輸入區 */
#input_small {height:50px;}

50px代表的是高度，數字越大欄位的大小就越大。

若是已經確定自訂CSS欄位裡面沒有相同語法的話，就把這串語法複製貼到自訂CSS欄位內，然後按下儲存就完工了。

如果自訂CSS欄位內已經有相同語法，但是想把高度再加大的人，請直接修改數值並儲存即可。

完成後的效果如下圖：

回應輸入欄變大了，在送出回覆之前要確認自己打的內容時也更方便了！

今天要教大家如何改變噗浪頁面上的個人顯示圖像大小。只需要在css裡面貼上一個語法就可以輕鬆解決～

首先在沒有增加任何css語法之前，預設的個人顯示圖像大小是這麼大：

因為實在大得太不像話了，還會把自我介紹擠到下方去，所以乾脆把它縮成我們喜歡的大小。

修改的步驟分為三部份，請依照順序修改。

可直接點選下方連結跳至該步驟。

一、確認自訂css欄位裡是否已有相同語法。

二、在自訂css欄位內新增語法。

三、修改此語法內的數值。

※若已經套用在其他網站下載的噗浪版型時，請務必先確認css欄內是否已有此語法，避免語法重複影響效果。

步驟一、確認自訂css欄位裡是否已有相同語法：

首先點選「我的檔案」旁邊的「編輯」，再選擇「自訂外觀」頁面。

接著在自訂css欄位內點一下滑鼠，搜尋是否已有相同的語法。

請按ctrl+f搜尋「.profile-pic」，若是發現已有此語法，請直接跳到步驟三修改語法內的數值即可。

若是找不到，請繼續看步驟二新增語法。

步驟二、在自訂css欄位內新增語法並修改數值：

若是在css欄位內搜尋不到「.profile-pic」時，請直接複製下方的語法在空白處貼上。

/* 個人頭像大小 */
.profile-pic {height:100px; width:100px; }

然後按下「儲存並更新」即可。

這是修改過後的效果，可以發現圖像已經明顯的縮小了。

如果對修改完的圖像大小不滿意，想修改數值要怎麼改呢？請繼續看第三步驟～

步驟三、修改此語法內的數值：

觀察一下語法我們會發現{ }內出現了height和width這兩個屬性，其實這就分別代表了圖片的高跟寬，只要修改這裡的數值就可以改變圖像的大小。

但修改時請記得height和width這兩個屬性的數值必須相同，否則圖片會變形。（當然你要讓它變形我也沒意見……）

舉例來說，如果要讓它變得比步驟二的語法效果更小，可以改成這樣：

/* 個人頭像大小 */
.profile-pic {height:50px; width:50px; }

若是要改大一點，可以改成這樣：

/* 個人頭像大小 */
.profile-pic {height:150px; width:150px; }

數值可以隨自己喜好修改。

※噗浪預設的圖像大小為「195px」，請盡量不要超過這個大小，避免圖片模糊掉。

以上就是本次的噗浪語法教學。

（其實這已經不算教學了，應該叫小撇步才對|||b）

下次來教怎麼隱藏朋友和粉絲列表好了～這個對一些比較注重隱私的朋友應該還蠻需要的。

最後，若是對示範圖片裡某蚊所使用的噗浪版面有興趣，歡迎到這裡來下載安裝。(・∀・)ﾉ

我所使用的版面都有修改過個人圖像大小，要修改時不需要再新增一次語法，直接修改數值即可。