版權所有+保留所有權利_+_+_
© 2010-2015 Created by 如我協力創意工作室 Be Myself Inc.
**版權說明**
-- 我們提供與設計的噗版CSS內容僅供個人自用,請勿改製再分享或用於商業用途 --
((請勿將全部或部份內容直接取用當作自己的設計))
-- 除了個人噗版自用外(修改請註明原CSS碼出處),其它使用方式均未授權,還請務必注意,勿侵權喔~--

目前日期文章:201011 (17)

瀏覽方式: 標題列表 簡短摘要

這篇會持續置頂並更新方便大家查找與使用相關文章 

 

M6 發表在 痞客邦 PIXNET 留言(173) 人氣()

噗浪的獎勵制度,除了卡馬外,就是小徽章了~

徽章.png

從上傳大頭貼、發表噗文、註冊累計天數到卡馬值超過81的涅槃境界,

都會出現可愛的徽章作為獎勵的表徵~

點「如何獲得徽章」會跳出小視窗,可以看見共有三十枚徽章可以收集~XD

共有30枚可以收集.png

但是對於整體噗版的設計而言,這些五顏六色的徽章,可能太過華麗炫目了一點,

尤其是當你希望背景是簡潔清爽的時候~

如果你不在意這些徽章,或是不希望它們出現影響版面整體感,可以把它完全隱藏起來,

或是設定透明度變化,讓滑鼠移至徽章的時候再顯現:

M6 發表在 痞客邦 PIXNET 留言(4) 人氣()

從換背景圖、調整版面佈置,到文字的偏好設定,距離打造專屬的噗浪佈景,又更進一步了。

今天,第三步,我們要來改變「浪上的噗」的外觀與易讀性,

請先套用「範例一」的完成語法,內容在 這篇文章

在改變浪上噗的外觀前,範例一的佈景長這樣:

6設分區圓角與透明度.png

加上浪上噗的語法設定後,它將會長這樣:

範例一的浪上噗.png

整個版面有沒有更協調呢?看起來更舒服、合搭了。

請在範例一的自訂CSS欄位最後面,加上 [ 浪上的噗 ] 語法內容:

M6 發表在 痞客邦 PIXNET 留言(27) 人氣()

這幾日噗浪動作頻頻,改了通知背景、改了分享功能、還變過通知音效(後來又改回來),

然後所有的噗標籤也多了未讀紅背景...... 這些改變,是要帶給大家「新鮮感」嗎?XD

 

今天,又出現了新改變,在更新通知那裡,多了「快捷鍵」的提示功能:

U更新.png

英文數字就是快捷鍵,U=更新 V=檢視

M大絕V檢視.png

M=放大絕

 

實際使用上,真的會快速許多,噗浪衝浪變飆浪了~XD

M6 發表在 痞客邦 PIXNET 留言(1) 人氣()

在上篇 版面基礎的演練 過後,熟悉了基本佈景項目,我們可以試著進一步調整文字的字型與顏色,

讓每天閱讀的噗浪更耐看些

為了能夠熟悉背景的應用,這次,讓我們換一張背景圖,放在時間軸,從版面的佈局,再練習一遍~

- - 範例二 - -

範例二.png

 

M6 發表在 痞客邦 PIXNET 留言(17) 人氣()

本來,噗浪預設紅背景的情況,只有出現在 「每則噗未讀回應數」那邊

每則噗未讀回應數

這陣子,噗浪的「紅背景」,這奇怪的偏好或說習慣,竟然,先是出現在頁首「通知」

通知紅背景.png

現在,連「所有的Plurk/我的Plurk/私人的/回應過的/喜歡的」標籤那邊,都有了......

所有的噗未讀數目的紅底

哎~這是什麼樣的設計偏好啊~XD

 

幸好,還有「自訂CSS」功能,讓我們可以選擇,讓太過明顯張揚的「紅背景」消失~

先就今天出現的「所有的Plurk」標籤的未讀數字 開始~

.unread_generic  /*未讀噗數目*/
{
background:none !important; /*拿掉紅背景吧*/
color:#333 !important; /*預設是白色,淺底色背景請加這行換成深灰色*/
}

M6 發表在 痞客邦 PIXNET 留言(2) 人氣()

剛開始接觸噗浪版型,將入門的時候,何處下手比較好呢?要能發展出自己的噗版風格與編寫方式,
首先,簡單的基礎結構,一些些的變化,就能擁有一個獨特的自訂外觀

6設分區圓角與透明度

選好自己想要放的背景圖後,瞭解噗浪的基本結構,就能在基礎的變化當中,找到自己的型和樂趣~

以下列出基本的預設項目,只要掌握這幾處,同一個背景圖就可以變化出各式組合樣貌喔~

M6 發表在 痞客邦 PIXNET 留言(1) 人氣()

繼五月份發出的 [ 噗版大變身 ] 建立好用的資源庫與工具=變身基礎功 常練勤更新 這篇文章後,

終於,再次整理過一遍自己常用的CSS。

每隔一段時日根據自己的需要,整理一遍、更新一遍,這樣使用上將更為順手、便利~

SAMPLE GOOD

是我最新版的「基本款」噗版基礎,將這段時日許多新的嘗試、設計風格,放在裡面,

這篇就將常用的CSS項目,新整理過的,放上來,有需要的朋友請參考囉~ ^ ^ +

 

/*常用CSS清單*/
/*Organize by Be Myself Inc. M6*/


各項目以「;」 區隔
加強優先:在項目最後加上"重要"「!important;」

M6 發表在 痞客邦 PIXNET 留言(0) 人氣()

在最近幾個版型中,嘗試了一些新的CSS項目,像是表單欄位以及小圖示的變化,
在整體噗版的樣式設計上,使用與色系風格相合搭的選單配色和圖示,將能讓噗版
呈現出更協調的設計感,語言選單、搜尋選項,還有發噗區及回覆區的小圖示,讓我們一一來試著應用看看吧 ^^

 

[ 語言選單 ]

有出現語言選單的地方,一個在頁尾,一個在私密語系選項中,CSS項目分別如下:

1. 頁尾

#languge_selector /*語言選單*/

#languge_selector form select /*尚未展開時的下拉表格欄位*/

#languge_selector form select option /*展開後的表格*/

M6 發表在 痞客邦 PIXNET 留言(2) 人氣()

叮叮噹~叮叮噹~鈴聲多響亮~ XD 最近都會不自覺哼起耶誕節相關的歌曲,白色耶誕的氣氛,是越來越濃了啊~

一連作了三個耶誕相關的噗版出來,分享給大家~

 

「懶熊版」

XMAS XMASD

/*------------------------------------------------------------------------
*噗浪版型 Plurk CSS: XMAS XMASD
*設計出處 Design by: Be Myself Inc. M6
*背景圖源 Background image from: (san-x)
*安裝網址 Install: www.plurk.com/installDesign/5807705-fed2ca0a25
*copyright: 版權所有 保留一切權利 All Rights Reserved
------------------------------------------------------------------------*/

 

「明日蛙版」

Merry Xmas JOJO /*------------------------------------------------------------------------
*噗浪版型 Plurk CSS: Merry Xmas JOJO
*設計出處 Design by: Be Myself Inc. M6
*背景圖源 Background image from: (san-x)
*安裝網址 Install: www.plurk.com/installDesign/5807705-d36bd2e7a5
*copyright: 版權所有 保留一切權利 All Rights Reserved
------------------------------------------------------------------------*/

 

「雪人版」

SAHALANDE /*------------------------------------------------------------------------
*噗浪版型 Plurk CSS: SAHALANDE
*設計出處 Design by: Be Myself Inc. M6
*背景圖源 Background image from: (vladstudio)
*安裝網址 Install: www.plurk.com/installDesign/5807705-96910a83ac
*copyright: 版權所有 保留一切權利 All Rights Reserved
------------------------------------------------------------------------*/

/*-------------------------------版權說明-------------------------------

此系列噗版由「如我協力創意工作室 Be Myself Inc.」 設計提供,版權所有。
僅開放個人套用,歡迎個人噗友學習改成最適合自己的樣式(請註明原CSS出處),
商業性質及其他利用方式請勿套用、改製或引用,謝謝。
---『我們並未授權創作者擅自使用我們的CSS修改後再分享,請尊重原創,謝謝~』
------------------------------如我協力創意工作室 Be Myself Inc. M6***

------------------------------------------------------------------------*/

 

M6 發表在 痞客邦 PIXNET 留言(1) 人氣()

實在是... 噗浪接著「紅底色」新通知背景之後,推出的新改變,是「嚇死人」咻~碰通知音效 . . .

才覺得分享小圖示改版改的不錯說. . .

 

如果實在是聽不習慣這個新的驚喜,請記得,還有個「關掉它」的按鈕可以用...

關閉音效通知.png

在我設計的部份版型,它可能是長上面這樣。而噗浪預設的,是藍色圓形喇叭按鈕,如下:

關閉音效通知-1.png

 

無論長怎樣,點下去,就可以關掉有新回應或新噗時,噗浪的預設音效了~

關閉音效通知-2.png

 

好吧 . . . 我還是把咻~碰關掉好了 , , ,

M6 發表在 痞客邦 PIXNET 留言(1) 人氣()

可愛的噗浪,又有新鮮的小玩意了~

小功能列.png

 

把原先在語助詞「分享」裡面的上傳照片與影音等功能,拉出來,放在發噗區下方。

小功能列3.png

在單則噗下方的回應區也有。

 

這樣,使用上更加直覺方便了,也讓語助詞「分享」,回歸它原本單純「語助詞」的身分XD

M6 發表在 痞客邦 PIXNET 留言(0) 人氣()

 

噗浪今天把「每日照片」這個功能標籤,從發噗區的地方拿掉了~

 

拿掉每日照片.png

 

所以,以後要上傳照片或是拍視訊,要從「語助詞」裡面的「分享」功能去做處理囉~

 

還有,噗浪新增了「新通知背景」的紅底色 . . .

通知紅背景.png

如果覺得跟佈景不搭的話,

可以用這段語法將背景移除:

.unread #alert_beacon

{

background:none !important;  /*拿掉背景色*/

color:#bbbb99 !important;  /*設定字的顏色*/

}

 

每天都有新發現,噗浪的CSS項目還真是種類繁多啊~XD

 

M6 發表在 痞客邦 PIXNET 留言(0) 人氣()

 

呼~終於彙整了這段時間以來所有的噗浪CSS應用項目,一一列出,在 SAMPLE GOOD 這個版型中

 

這意謂者,在這個版型中,已經將所有設計應用的項目,羅列棋布,

以SAMPLE GOOD為基礎,

可以變化出目前為止,我所設計的各式版型風貌。

M6 發表在 痞客邦 PIXNET 留言(3) 人氣()

已經使用痞客邦的部落格一段時間了,這次,因為要開設 D+工作日誌的專用blog

開始選擇痞客邦提供的樣式 . . . 發現雖然樣式眾多,但,要找到簡潔、不干擾內容的版面,

還真不容易啊~~

索性,就藉此機會,研究起痞客邦的樣式CSS項目來,

部落格、相簿、留言版、名片,相較於部落格還有許多的樣式選擇,其他的,能選的真的不多,

是故,就以痞客邦的原始架構,製作了屬於D+的版面系列出來~

 

[ 部落格 ]

D+.png

M6 發表在 痞客邦 PIXNET 留言(32) 人氣()

因為有網友留言詢問,能不能修改噗浪在部落格的外掛,

希望能不要顯示上方的照片與個人資訊等項目,只簡單顯示出訊息和時間就好,

所以花了點時間上網搜尋相關資訊和文章,

發現,由於現在的噗浪部落格外掛是用 iframe 去做處理的,

因此,單靠CSS是無法做更動的,除了官方提供的改外掛顏色與長寬等簡單變動外,

如果希望能多點自訂的空間,可以試著用以下幾種方式來作替代方案:

 

(1) 使用RSS訂閱功能,在製作widget的網站上做一個自己的噗浪外掛

Plurk life

使用網站:http://www.widgetbox.com/widgets/make?code=feed

在 "Enter your blog or feed address (URL)." 的欄位,填入自己的噗浪訊息訂閱網址,

像我的網址是:http://www.plurk.com/66660000.xml

就是噗浪帳號後面,加上 .xml ,就是自己的訂閱網址了。

M6 發表在 痞客邦 PIXNET 留言(3) 人氣()

今天看到噗浪創辦人 alvin 分享了這位 紅眼兔 所繪製的桌布,超喜歡的! 所以趁著下午有空,就把它作成了噗版XD

Plurk your life

/*------------------------------------------------------------------------
*噗浪版型 Plurk CSS:Plurk your life
*設計出處 Design by Be Myself Inc. M6
*背景圖源 Background image from:http://www.plurk.com/BlackLight (紅眼兔)
*安裝網址 install:http://www.plurk.com/installDesign/3997864-4199b73f4d
*更多佈景 More Themes: http://www.flickr.com/groups/plurkcss
------------------------------------------------------------------------*/
/***僅開放個人套用做為噗版,商業性質及其他利用方式請勿使用,謝謝****/

 

活生生的噗浪世界,就這樣呈現到眼前來囉~

M6 發表在 痞客邦 PIXNET 留言(3) 人氣()

找更多相關文章與討論