如何幫Plurk噗浪換「背景圖」?

最後更新:2009/01/08 (錯誤、版本更新回報)

 

 

推到 Twitter!
推到 Plurk!

Plurk的好玩之處,除了人與人的互動之外,他還可以像一般部落格一樣透過修改CSS控制碼的方式來讓你的個人頁面展現不同的風格。其中最多人問也最多人想改的應該就是個人首頁跟「河道(時間軸)」的背景圖了吧?以下用很簡單的方式介紹更換背景圖的方法,如果你想修改其他細節如字體顏色、大小與版面配色等等,可以再參考噗浪官方網站的說明。


延伸閱讀:

  1. 什麼是「噗浪」Plurk?
  2. Plurk噗浪語法、使用教學
  3. 我的Plurk帳號:按這裡請把我加入吧~)

 

 

一、將你的背景圖上傳到免費空間(可外連的空間)

首先,在我們開始設定背景圖之前,請先將你的背景圖上傳到Flickr或其他國外的免費空間。如果你懶得找,其實也可以先在發文時將圖片直接上傳到Plurk網站中(貼圖教學),再把他連過來用也可以。

要特別注意的是,不可以把圖片放在Yahoo!奇摩部落格或無名小站之類的部落格、網路相簿,這些網站並不支援「外連」,如果把其他網站的圖檔連結貼到這邊的話,會無法正常顯示。

以下以「http://xs.to/」這個免費空間為例,請先將你要當作背景用的圖檔上傳到xs.to,然後再依序完成後面的背景圖設定。

 

第1步  打開「http://xs.to/」網站,直接按一下〔瀏覽〕按鈕,選取你事先準備好的圖片,再按一下〔Upload!〕按鈕將圖片上傳到網站中。

01

 

第2步  上傳上去之後,請捲動頁面到最下方,找到「Direct link:」這一行,下面的圖檔網址複製下來,準備等等貼上到Plurk成為背景圖。

02 

 

 

二、修改全站背景圖:

第1步  接著請打開並登入Plurk,在網頁左上方的「編輯」按一下。

03

 

 

第2步  開啟「個人設定」視窗後,請先切換到〔自訂外觀〕頁面,在「進一步運用CSS來自訂您的個人頁面」方框中找到以下的程式碼,並將「url();」括弧裡的圖片網址換成新的圖片網址。 (修改以下範例中標示為紅色的那個網址)

body, html {
    background-image: url(http://i242.photobucket.com/albums/Black.png);
    background-repeat: repeat;
    color: #FFFFFF;
}

如果沒有「background-image:」這一行,請自行加上即可。只要是放在「body, html { }」這一段裡面的就可以。修改完後,請再按一下〔儲存並更新〕按鈕即可完成。 (如果你的CSS欄位裡面都是空的沒有任何控制碼,可以直接複製以上範例程式碼貼上去,改掉圖檔網址就可以囉)

04

 

 

第3步  改好並存檔之後,我們可以看到整個網站的背景圖都變不一樣囉。

05

 

 

 

二、修改噗浪「河道」的背景圖:

第1步  如果你想修改噗浪「河道」的背景圖,則可修改「#timeline_holder」這一段中的背景圖控制碼,如果找不到「#timeline_holder」的設定,可以自行增加,只要將以下程式碼中「url();」括弧裡的圖片網址換成新的圖片網址即可。 (修改以下範例中標示為紅色的那個網址)

#timeline_holder {
background-image: url(http://s3.amazonaws.com/17148/12-26-49.png);
background-repeat: repeat;
border: 1px solid #CCCCCC;
}

如果你的CSS欄位裡面都是空的沒有任何控制碼,可以直接複製以上範例程式碼貼上去,改掉圖檔網址就可以囉。

 

第2步  如圖,修改好並存檔之後,可以按一下鍵盤上的〔F5〕讓網頁更新過後,整個噗浪河道就變得完全不一樣囉。 當然,你要放什麼蔡依林、周杰倫、費玉清、秦漢、林青霞的...什麼偶像明星都可以,或者自己畫一張圖再擺進去也可以,只是不要弄的太花,不要搞到沒法順利閱讀上面的訊息就可以了。

06  

 

延伸閱讀:

  1. 什麼是「噗浪」Plurk?
  2. Plurk噗浪語法、使用教學
  3. 999個超漂亮的Plurk Theme佈景主題(Plurk Templates、CSS)
  4. Plurk支援用IM收發訊息囉!(目前先開放Gtalk)
  5. [噗浪機器人] Mechanical Plurk 全自動的 Twitter→ Plurk訊息同步工具
  6. Ping.fm幫你將訊息同步到twitter、Plurk…等29個網站!

 

 

 

 

(請勿全文轉貼本站文章,歡迎「部份引用」或介紹,引用時請註明 ①網站名稱 與 ②文章網址,感謝~~ )
→ 免費訂閱最新文章:  (如何訂閱?)
本文作者:不來恩 | 發表時間:2009/01/08 | 分類: Plurk噗浪、微網誌 | Trackback 引用網址     
注意事項:本站所介紹之軟體、設定或網站服務,經實際安裝測試並通過防毒軟體掃毒。但因為不同電腦環境與軟體設定可能都各有差異,建議您僅在非工作用的電腦安裝、測試,避免因為不可預知的錯誤、當機或軟硬體衝突,影響您的工作或電腦運作。另外,在進行任何重要的操作與設定之前,記得先行備份電腦中的重要資料,避免因為未依指示的不當操作或其他疏失造成資料毀損。當您依照本文所提供之訊息執行各種操作,表示您已閱讀此注意事項並同意自行承擔可能之風險與責任。

 ▇ 最新文章

 

 

關於本主題有 10 個留言:

  1. pink_floyd 說道:

    哈囉!你好,我有把圖片上傳到flickr了,為什麼我的河道和背景都不給我修改,是有karma限制嗎?還是圖檔大小有所限制,不好意思!謝謝。

  2. Valkyrie 說道:

    如果可以的話教我們完整的改變吧…比方說對話框以及字體、顏色的設定

  3. 芊妹 說道:

    大大~

    一般好像是用下面這種方式隱藏寵物的:(要再試試看喔)

    #dynamic_logo { opacity:0;filter:alpha(opacity=0);zoom:1}

    我試了~但是不成呢!!

    可以幫看看是什麼原因嗎?

    我的plurk!http://plurk.com/avde0626/

  4. 訪客 說道:

    我今天才註冊PLURK…
    你的訊息幫了我好多喔…
    你真的好厲害喔…
    非常的謝謝你…

  5. xweekend 說道:

    請問換日線的CSS..是哪一個?…因為我的不見了…

  6. AZUSA 說道:

    嗯嗯~~再來試試看

    另一個問題(天音:問題真多)
    噗浪裡有一個是可以將別人發的噗給消音
    但~要怎麼取消消音呢?
    一定都要每次去點選取消消音嗎?(這樣很麻煩)

  7. 不來恩 說道:

    另外,關於噗浪寵物,一般好像都會顯示噗浪寵物的,除非你原本的CSS控制碼有特別讓他不出現,你檢查一下:

    #dynamic_logo {

    }

    這段的設定,如果有其他設定,把他刪掉,寵物應該就會出來了。

    一般好像是用下面這種方式隱藏寵物的:(要再試試看喔)

    #dynamic_logo { opacity:0;filter:alpha(opacity=0);zoom:1}

  8. 不來恩 說道:

    如果你的背景圖是GIF動畫,那你的背景就會動囉… 另外就看你說得動態圖示是在哪一個位置,每個位置不同控制碼。

  9. AZUSA 說道:

    那像是把LOGO和噗浪寵物給隱藏在圖後呢?

    還有那些會在上面加動態圖示要怎麼加進去

  10. 大魚 說道:

    ^^感謝分享

 

歡迎留下您的想法或意見...

暱稱:     部落格:

信箱:

(若無法正常留言,請按〔Ctrl〕+〔F5〕重新整理後再試一次。)

 

 ▇ 【討論區】最新文章

 

 ▇ 產業科技新知

 

 ▇ 其他文章

 

 ▇ 隨機文章

開放性重創(重新創作)的Web 2.0漫畫網站:Hatena Serif


把Mac OSX 10.5 Leopard裝在Eee PC電腦上


如何快速將BBS文章「整篇」抓圖、複製下來?


[Google日曆] 如何在行事曆中新增「台灣假期、農民曆」?


「無痕式瀏覽」同時用不同帳號登入同一個網站


幫7-ZIP壓縮檔的ICON圖示改漂亮一點!(7zip icons patcher)


「田中千繪」要騎機車來我家…

 

 

 

【重灌狂人】全部文章分類:

  防毒軟體 MSN, WLM 聊天軟體 Yahoo!即時通
下載、P2P YouTube Google
Firefox瀏覽器 Opera瀏覽器 Blog
好用軟體 好站推薦  
     
  Windows XP電腦密技 Windows Vista電腦密技 Mac OS 蘋果電腦密技
其他作業系統    
     
  Office文書處理 檔案管理 郵件收發
影音播放 影音剪輯 秀圖、圖片編修
網路瀏覽 網頁編修、網站架設 WordPress 網站架設
     
  硬體3C資訊 手機流行通訊 廠商新聞稿
【超級星光大道】 熱門話題 好玩
七嘴八舌 貼圖、影片分享