Photo


I'm Wei

Traveler / Photographer / Designer

旅行除了美麗的風景,最重要的是途中發生的點點滴滴,唯有照片與文字的交織,才能讓美麗的回憶不朽。這本部落格是份珍貴的禮物,獻給多年後的自己,有那麼一天,曬著午後慵懶的日光,溫習當年青春的味道。部落格取名為 Dribs & Dribs,為 "點點滴滴" 之意。

▸ Facebook:Dribs & Drabs

▸ Facebook:Dribs & Drabs - Designs

▸ Instagram:dribs__drabs

▸ Mail:weilife.blog@gmail.com

▸ Pixnet訂閱:weilife

s

Blog_1_s

每次幫版面取名都想好久,最後決定了 "小清新",這次分享的圖文部落格與非圖文部落格都很適合喔!雖然版面非常簡單,但簡單的東西反而是最耐看的。採兩欄式版面,左方為部落格標題、公告區塊、側欄和頁尾,右方是文章區塊,點擊文章區塊即可進入該篇文章。

 

使用規定 <<<<<< 必看

 

 

CSS語法

對著文字框按右鍵可以全選,複製貼上至管理後台"自訂樣式"->"CSS原始碼編輯"

 

嫩芽綠
Blog_1_ss

櫻花粉
Blog_2_ss

薰衣紫
Blog_3_ss

 

版面設定

1 - 請至後台 > 側邊欄位設定,將所有有用到的元件移至側欄2

2 - 文章中,圖片最大寬度為600px

3 - 為了版面美觀,已將個人覺得礙眼的東西刪除,若需要的話請自行修改CSS

 

Q&A

1 - 請問如何增加文章區塊的寬度?

要注意,加大文章區域寬度可能導致小螢幕電腦無法完整顯示部落格。

以下範例為加大200px文章寬度修改的CSS部分

body{min-width: 1100px;} 加大200

#container{width: 1000px;} 加大200

#article-area{width: 700px;} 加大200

#navigation{margin-left: 680px;} 加大100

*   如果上述沒有你的問題,可參考另一篇 Q&A問答集

 

更新

2014/12/16  解決滑鼠移至圖繪會縮放的問題

2015/01/13  新增兩種顏色 - 櫻花粉、薰衣紫

2015/12/15  更新版面

 

♥ 更多部落格版面分享: http://weilife.pixnet.net/blog/post/434454491

♥ 部落格CSS語法教學: http://weilife.pixnet.net/blog/post/437150992

文章標籤
創作者介紹

Dribs & Drabs 點點 滴滴

Dribs & Drabs 發表在 痞客邦 PIXNET 留言(124) 人氣()


留言列表 (124)

發表留言
  • 流江
  • 哇~ 這一次的版面也超讚的!棒棒^^b
  • 流江~好久不見啊 >/////<

    Dribs & Drabs 於 2014/12/05 22:51 回覆

  • 蕾蕾
  • 謝謝分享:)
  • 看到你套用後版面有些問題,所以剛修改了一下,再麻煩你重新套用 :)

    Dribs & Drabs 於 2014/12/05 22:50 回覆

  • 春奈
  • 設計不錯!
  • 感謝你的支持 ヾ(*´∀`*)ノ

    Dribs & Drabs 於 2014/12/06 09:30 回覆

  • 流江
  • 呵呵,忙演唱會去了XDDDD
    現在又有時間來這裡玩啦^^
  • 感覺流江的生活彩多姿呢 :D
    是飛到韓國嗎?你會不會是李先生台灣粉絲團的團長吧?哈哈哈

    Dribs & Drabs 於 2014/12/07 19:57 回覆

  • chanjay
  • 小清新這名字取得很好XD
    馬上來套用看看~
    謝謝你分享~~~
  • 感謝支持 :)

    Dribs & Drabs 於 2014/12/07 19:48 回覆

  • Hyun Woo
  • 很愛這次風格 (^_^)/
    謝謝分享##
  • 感謝支持 :D

    Dribs & Drabs 於 2014/12/07 20:58 回覆

  • 悄悄話
  • 蕾蕾
  • 你好~
    已重新套用囉:)
    謝謝你(啾~
  • 不客氣 :D

    Dribs & Drabs 於 2014/12/09 13:35 回覆

  • 夜安然
  • 這次很天然喔~超嫩綠的~love~
  • 忍不住想接這句~天然A最水,哈哈哈

    Dribs & Drabs 於 2014/12/10 08:20 回覆

  • Fei
  • 每次只要有新的樣式就會想要用用看
    這次也是不意外的好看 ♥
  • 感謝你的支持 :D

    Dribs & Drabs 於 2014/12/16 08:19 回覆

  • Linda
  • 謝謝分享唷 好好看耶!已經套用了
  • :D

    Dribs & Drabs 於 2014/12/16 13:00 回覆

  • Mashon
  • Very nice looking!!! =)
  • Thanks :D

    Dribs & Drabs 於 2014/12/19 08:54 回覆

  • 小米
  • 超喜歡的~~~綠綠
    一直覺得你的樣式做的超棒
    是我喜歡的風格
  • 謝謝你的支持,超開心的 :D

    Dribs & Drabs 於 2014/12/20 21:16 回覆

  • 艾chan
  • 謝謝~
    依舊很喜歡啊!
    而且是清新的湖水綠
    ^^
    如果想把圖片變大為900該如何改CSS呢?
    哈哈!還是得麻煩版主了
  • 修改以下CSS
    #container{width: 1000px;} 加大300
    #article-area{width: 700px;} 加大300
    #navigation{margin-left: 680px;} 加大150
    不過要注意,這樣修改的話可能小螢幕的電腦有部分內容看不到喔
    感謝你的支持 :D

    Dribs & Drabs 於 2014/12/20 21:16 回覆

  • 艾chan
  • 謝謝版主的立馬回覆
    完全解決了我的問題啊
    很喜歡
    ^O^
  • :D

    Dribs & Drabs 於 2014/12/21 10:36 回覆

  • 大妞
  • 大大不好意思...我沒將版權拿下,是電腦不知道為什麼只要我用自訂樣式貼上任何CSS,就是一直在Loading!!!
    所以我先換回痞客邦內的樣式,回家後再用自己的電腦套用(我真的很喜歡妳的樣式),我不知道為什麼公司電腦會跑不到> <
  • 原來是這樣 :)
    難怪我看你的版面有些地方感覺沒有套用到,應該是語法的後半段不見了!

    Dribs & Drabs 於 2015/01/08 08:13 回覆

  • 大妞
  • 對的,我一開始不知道版權不見,我只覺得有些連結顏色沒變化> <
    非常抱歉造成困擾,謝謝妳的提醒!
  • 沒關係啦~知道不是刻意就好 :D

    Dribs & Drabs 於 2015/01/08 10:51 回覆

  • Zona
  • 真的好喜歡這個樣式 ^____^
    我把它跟另一個樣子的背景結合了~~~
    覺得版主分享的每個樣式都超棒的!!!
    謝謝分享~~~ <3
  • 謝謝你的肯定 :D

    Dribs & Drabs 於 2015/01/09 09:11 回覆

  • Dimple_嫺兒
  • 每次都做得很簡潔又乾淨的樣式
    真的很喜歡 ^_^
  • 謝謝你的支持 >////<

    Dribs & Drabs 於 2015/01/11 19:56 回覆

  • 悄悄話
  • 悄悄話
  • Claudia Mom
  • 再次又看到你那美麗的版面分享,好棒!
  • :D

    Dribs & Drabs 於 2015/01/16 09:14 回覆

  • 歛歛歛
  • 好喜歡你的設計>//////<
  • 謝謝你的支持 :D

    Dribs & Drabs 於 2015/01/16 22:27 回覆

  • 蕾蕾
  • 換上粉紅色囉:)
    thank you~
  • 粉紅很適合你的部落格唷 :D

    Dribs & Drabs 於 2015/01/16 22:28 回覆

  • 尹諾海
  • 帶走樣是 很喜翻~~ >w<
  • 感謝支持 :)

    Dribs & Drabs 於 2015/01/24 20:38 回覆

  • 悄悄話
  • 夏美
  • 好喜歡這個版面的設計,還是我喜歡的小清新風格~
    套用了去自己的博客了~謝謝你的分享!
  • :D

    Dribs & Drabs 於 2015/01/25 18:34 回覆

  • Twins
  • 讚!! 我也套用了,妳真的好棒~~
  • 感謝你的支持 :)

    Dribs & Drabs 於 2015/01/28 09:20 回覆

  • 淺淺唷
  • 很美很好看~感覺起來很舒服~已套用!
  • 感謝支持 :)

    Dribs & Drabs 於 2015/01/28 11:11 回覆

  • VIVIYU
  • 您好:不好意思,想要請教一下,不知道為什麼套用您設計的這個版型之後文章文字會變成紅色,我想要改為黑色,像您所顯示的這樣,想請教應該怎麼修改才好呢?
    謝謝~
  • 我自己套用和其他人套用都沒有這個問題喔,你可能要檢查一下你其他的語法,可能是其他語法造成的!!

    Dribs & Drabs 於 2015/02/10 16:18 回覆

  • VIVIYU
  • 您好,不好意思,我找到問題所在了,謝謝!
  • :)

    Dribs & Drabs 於 2015/02/10 16:19 回覆

  • 悄悄話
  • 悄悄話
  • えい ♥
  • 你好,很喜歡您的版面,可是照片都沒有顯示呢 >_< 可否教我怎麼修改嗎?
  • 範例裡面的照片是文章內容喔,不是這個版面附加的!

    Dribs & Drabs 於 2015/02/12 13:45 回覆

  • 米拉‧Mira
  • 你的樣式我都好喜歡 謝謝分享!!
  • 謝謝你的支持,美麗的工程師 :D

    Dribs & Drabs 於 2015/02/13 16:10 回覆

  • 悄悄話
  • 翎婧.
  • 謝謝您的分享!您的作品都很有特色!
  • :D

    Dribs & Drabs 於 2015/02/19 12:22 回覆

  • 悄悄話
  • 訪客
  • 謝謝您的分享!請問為什麼我的fb like box底色會是白色呢?這問題要如何解決?
  • 到後台查看該app,應該有可以設定的地方

    Dribs & Drabs 於 2015/02/27 08:41 回覆

  • 訪客
  • 請問有辦法把文章的寬度增加一些嗎?
    當我並排照片的時候有時候太窄了,會跑到下一行。
  • 請看Q&A - 1

    Dribs & Drabs 於 2015/02/27 08:55 回覆

  • 訪客
  • 請問可以幫我看看為什麼我套用樣式後文章結束後到留言列表之前會有一個很大的空白呢?謝謝
  • 請用痞客邦帳號留言,我才知道你的部落格網址
    另外猜測那個空白是廣告區塊,你的瀏覽器有檔廣告所以廣告出不來,但區塊還是會存在!

    Dribs & Drabs 於 2015/02/27 10:30 回覆

  • 悄悄話
  • 悄悄話
  • 悄悄話
  • 榊崎
  • 套用了OWO
    謝謝分享wwwww
  • 不客氣 :D

    Dribs & Drabs 於 2015/03/15 17:03 回覆

  • 悄悄話
  • 悄悄話
  • 悄悄話
  • 貝蒂
  • 很喜歡這個風格!
    謝謝分享~
  • :D

    Dribs & Drabs 於 2015/03/22 18:33 回覆

  • kaoruxtsai
  • 版主您好,非常喜歡您的設計>\\\<
    但是有個問題不知道為甚麼會讓版面跑掉呢?
    就是點入文章後下方:
    發表在 痞客邦 PIXNET 留言(0) 引用(0) 人氣(0) edit this article delete this article
    跟 email轉寄
    這兩行字會重疊在一起><
    不好意思麻煩您了,真的非常感謝。
    也期待您繼續分享喔^_^!!!超棒~
  • 到後台把mail轉寄的APP停用就不會有問題了!

    Dribs & Drabs 於 2015/03/25 22:22 回覆

  • Claire
  • 剛剛遇到跟樓上一樣的問題(而且時間還差不多)
    就是email轉寄會重疊再一起,然後剛好就看到您回復了!!!
    真是幫了好大一個忙Q_Q本來找CSS找了好久,原來是在APP那邊~~~
    謝謝您提供的樣式~真的很喜歡小清新>///<
  • 感謝你的支持 ヾ(*´∀`*)ノ

    Dribs & Drabs 於 2015/03/27 07:48 回覆

  • 小球凜花 ✿
  • 超漂亮!!!!!!!!!!!!
    帶走♥感謝分享
  • 謝謝支持(*˘︶˘*)

    Dribs & Drabs 於 2015/04/02 09:41 回覆

  • 悄悄話
  • 丁哆啦's
  • 好漂亮~
    謝謝你的分享^__^
    辛苦囉~
  • :D

    Dribs & Drabs 於 2015/04/06 13:30 回覆

  • Sylvia
  • 又跟了^^~很舒服的版面。謝謝!
  • 感謝你的支持 :D

    Dribs & Drabs 於 2015/04/22 17:04 回覆

  • 悄悄話
  • 悄悄話
  • 悄悄話
  • 悄悄話
  • 悄悄話
  • 悄悄話
  • 悄悄話
  • 悄悄話
  • Doris
  • 謝謝你的分享
    很感激
  • 不客氣,謝謝你的支持 :D

    Dribs & Drabs 於 2015/06/24 21:38 回覆

  • 悄悄話
  • 悄悄話
  • Vvn
  • 打包囉 很喜歡
    謝謝 :)
  • 謝謝支持 :)

    Dribs & Drabs 於 2015/07/29 19:08 回覆

  • 血月
  • 謝謝分享>w< 覺得超美~
    帶走囉XD
  • 謝謝支持 :D

    Dribs & Drabs 於 2015/08/26 20:03 回覆

  • 村傻_咩兒♥
  • 版大,你好:D
    我套用這款樣式後
    文章下方會亂碼耶,(→ 發表在 痞客邦 PIXNET 留言(3) 引用(0) 人氣(616))
    請問這要怎麼修復@_@?
    那個...要怎麼從bolg去到管理後台
    真的很喜這個樣式,如果版大能回答的話 真的很感謝:)
  • 我沒有看到亂碼@@ 一切正常的感覺
    從blog無法連到後台,我都是直接把後台網址存在最愛裡
    http://panel.pixnet.cc/blog/article

    Dribs & Drabs 於 2015/08/28 20:38 回覆

  • 村傻_咩兒♥
  • 我把應用程式刪除後它就不會亂碼了
    好的,瞭解 謝謝版大的解答❤
  • 不客氣 :)

    Dribs & Drabs 於 2015/08/29 10:24 回覆

  • 昭
  • 好美好清新!!!謝謝分享~~
  • 不客氣,謝謝支持 :D

    Dribs & Drabs 於 2015/08/30 07:46 回覆

  • 悄悄話
  • 悄悄話
  • 郭佳郭佳 ♥
  • 謝謝版主的分享
    覺得版主很用心,所有的風格都好特別唷
  • 大部分樣式是以前使用的版面,所以都很用心在設計,謝謝你的稱讚 :)

    Dribs & Drabs 於 2015/09/20 16:56 回覆

  • 人類
  • 你好~~
    謝謝你設計美好的版面分享給大家

    我套用紫色以後
    發現段落設定好像怪怪的
    單按一次enter的時候不會換“段”
    只會像按shift+enter一樣換“行“
    不過我之前套用您分享的別的版型不會有此問題
    我現在自己blog已經加語法更改了
    回報一下:)
  • 好滴,我測試看看喔,謝謝你的回報 :D

    Dribs & Drabs 於 2015/10/04 06:35 回覆

  • 悄悄話
  • enchantedgossip
  • 謝謝版主,帶走我最愛的粉紅色。
    你的版面是我開版套用的,清新的風格很舒服。

  • 謝謝你的支持 :)

    Dribs & Drabs 於 2015/10/31 14:15 回覆

  • 史貝思接接
  • 謝謝版主分享 :D 帶走綠色樣式囉~
  • 謝謝你的支持 :D

    Dribs & Drabs 於 2015/11/04 17:57 回覆

  • 悄悄話
  • 水星女孩
  • 謝謝版主 很喜歡你設計的風格:)
  • 謝謝你的支持 :D

    Dribs & Drabs 於 2015/12/04 22:46 回覆

  • 悄悄話
  • Ting
  • 套用囉~謝謝分享:)
  • 不客氣 :)

    Dribs & Drabs 於 2015/12/18 14:18 回覆

  • 羽靜
  • 套用樣式囉!
    這次套用了自己很喜歡的紫色:)
  • 感謝支持 :D

    Dribs & Drabs 於 2015/12/26 10:02 回覆

  • tzan tzan
  • 妳好^^ 我套用淺紫~ 這款好喜歡 : ) thank you
  • 謝謝支持 :D

    Dribs & Drabs 於 2016/01/06 21:41 回覆

  • 佟纓啊
  • 套用囉 感謝分享 很好看 <3
  • 不客氣 :D

    Dribs & Drabs 於 2016/01/24 23:17 回覆

  • Kelly 凱莉
  • 套用樣式了~~~謝謝分享:))))
  • 不客氣,謝謝你喜歡 :)

    Dribs & Drabs 於 2016/04/15 19:57 回覆

  • 悄悄話
  • 玟伶
  • 好美 打包薰衣草紫^_^
    感謝分享:D
  • 不客氣 :D

    Dribs & Drabs 於 2016/05/25 14:13 回覆

  • ashley1205
  • 謝謝您的分享
    版型好美又清爽
    超厲害的!!
  • 謝謝你 :)

    Dribs & Drabs 於 2016/05/27 09:07 回覆

  • yuu0624
  • 謝謝!已套用~~還在慢慢摸索中
  • 不客氣 :)

    Dribs & Drabs 於 2016/05/27 09:07 回覆

  • 悄悄話
  • 悄悄話
  • Millie
  • 謝謝分享
  • 不客氣 :D

    Dribs & Drabs 於 2016/06/23 19:28 回覆

1 2
找更多相關文章與討論