Contents ...
udn網路城邦
【教學】UDN改版大作戰
2008/08/23 01:36
瀏覽8,845
迴響17
推薦41
引用4

想跟EG一樣有自己風格的部落格嗎?

千萬別錯過~這次EG嘔心瀝血製作的教學唷!

只要八個流程就讓你從新手變高手唷!

準備好了嗎?要開始囉!

Tips:

1.請善用【Ctrl+f】搜尋關鍵字!

2.如果發現按下確認後無任何變化請按【F5】重新整理

3.EG推薦到Maggy的網頁圖片收集簿找素材唷!
或到EG的推薦連結《素材。網站》 尋找圖片素材唷!

4.別在下圖紅框區上傳圖片

流程一、選定模版

流程二、改背景

repeat為重覆
no-repeat為不重覆
這端看你找的素材適不適合重覆背景
ps.要換上背景時切記別在下面的【背景圖:】上傳背景圖!
因為更改語法後將不會變更,會維持原樣!
例如:不想讓背景重覆時,它還是會重覆!
請將你的背景圖存在相簿中,再複製圖片網址!
貼到background-image: url(圖片網址);/* 背景圖 */

2008/08/23
Photo by EG

流程三、改山頭

原版模的山頭→大改造

這裡的山頭圖~如果比山頭版寬小~EG見意將背景設為不重覆(no-repeat)
再則背景顏色也是看你需不需要加!
如果要換上山頭圖,請上傳到相簿之後將網址貼到
background:url(圖片網址)
background-position: center;/* 背景位置 */
right為靠右 left為靠左 center為置中
ps.要換上山頭時切記別在下面的【山頭圖:】上傳山頭圖!
因為更改語法後將不會變更,會維持原樣!
  關鍵字:【山頭區塊】
2008/08/23
Photo by EG

流程四、改網名位置

【font-family:】為更改字型語法
小叮嚀一下:如果改變字型可能別台電腦會看不到,
只看到預設的字型(通常為細明體)。
因為其他台電腦未必有您換上的字型。
  關鍵字:【山頭】網誌名稱
2008/08/23
Photo by EG

流程五、改作者和推薦區位置

  關鍵字1:【山頭】網誌簡短網址與作家  

  關鍵字2:【山頭】加入好友、推薦本網誌等

流程六、改搜尋位置

  關鍵字:【山頭】搜尋區塊

流程七、改橫式主選單位置

  關鍵字: 網誌橫式主選單的定位

流程八、變身成功

 

可利用以下的選色器找出你想要的顏色~

再從COLOR CODE:中取出色碼!

感謝星際訪客提供如此棒的另類色碼表!哈

最後還請各位高手多多指教囉^^

Update:2009/01/21

延伸閱讀:

網誌風格CSS架構圖解

玩模板》如何更改更改山頭圖檔?

玩模板》如何更改部落格名稱的顏色和樣式?

教學__『網誌改版面基本教學●1』

有誰推薦more
迴響(17) :
17樓. 回眸
2012/11/12 15:57
請教

到模板管理改網誌名稱[比如您是EG夢想樂園]一直沒成功,

可否詳細教導步驟.  謝謝.

抱歉~那麼晚回你!

看來你已經改好了^^

跟你說唷~如果你一直問不到人...可以直接問電小E或電小二唷!

他們人很好^^

─=☆EG☆=─2013/02/06 16:09回覆
16樓. 子靜
2011/07/07 09:59
請問一下

格子的山頭圖還是會重複

網誌標題也挪不上去

用了好多次都是一樣

請問問題何在呢?


首先別在下圖所示的地方上傳背景圖

再來就是在流程二的地方: background-repeat:no-repeat

─=☆EG☆=─2011/07/26 17:11回覆
15樓. 溫哥華 千里傳音
2010/08/23 12:55
感恩喔
請問如何讓部落格名稱, 如 REED 一樣閃 ?

謝謝!

Victor..
 不好意思我不太懂你的意思...
如REED一樣閃的意思是....?
─=☆EG☆=─2010/09/01 01:18回覆
14樓. 黃靜宜(辛蒂雅)
2010/04/21 22:16
請問
請問喔,步驟六「清空原本的CSS語法」要怎麼清空?我按了右鍵,但不會出現刪除的選項,所以沒法刪除,應該怎麼做呢?先謝謝了!

請先用滑鼠把滑鼠點在css編輯欄裡

先全選
方法1. 用滑鼠反白 
方法2. 快速鍵ctrl+A

然後清除 
方法1. 按BACKSPACE(enter上面那一個鍵"←") 
方法2. 按Delete

─=☆EG☆=─2010/04/22 23:05回覆
13樓. 壞阿壞-沒有你的日子我真的好孤單
2009/08/09 23:18
盡信書不如無書
看了好多書,對變更版面還是霧薩颯,還是你的教學簡潔有力又受用,這下可以好好改頭換面,重新做版了,感恩ㄋㄟ!

UDN的版不難改!

因為都有中文標題!

只要懷抱著一顆科學家的精神~try try try!!!

就可以改到你想到的版面囉

─=☆EG☆=─2009/08/10 22:46回覆
12樓. 鑽石公爵
2009/08/07 18:13
感恩捏~~
感恩捏~~   受益良多!  
 
見到您橫式主選單前的小圖示, 又不知如何製作呢?  

在"【網誌橫式主選單】小圖示"

欲更換小圖示,請修改url為圖檔所在地的絕對連結

範例:

background: url(http://album.udn.com/community/img/PSN_PHOTO/eg0501/f_2226802_1.gif) no-repeat  left center;

no-repeat是指圖示不重覆

LEFT CENTER為圖示靠左、右、中間

─=☆EG☆=─2009/08/09 01:01回覆
11樓. Jay Hsueh
2009/06/19 16:49
很棒的教學

妳的教學好清楚喔,對我這個想要把部落格裝潢一番的新手真的很有幫助呢!

HAVE FUN! ─=☆EG☆=─2009/06/21 00:13回覆
10樓.
2009/05/15 20:55
很棒喔~
最近也一直在研究改版型的方法,看到妳的教學受益良多
謝謝分享~不過我是慣用火狐瀏覽器,還要克服很多問題,謝謝你

不客氣唷!

我還是比較習慣IE呢!

火狐瀏覽器的確有些語法會走樣!

也請多多指教囉!

─=☆EG☆=─2009/05/15 23:21回覆
9樓. 蘆葦
2009/03/20 23:09
3Q~
原來不能用它提供的上傳去改背景啊,
難怪我之前改時一直有問題......


多謝教學~

輕輕的妳來了 正如妳輕輕的走

妳揮一揮衣袖 帶走了我天空所有的雲彩

^^

歡迎提出問題唷!!

教學相長!!!

─=☆EG☆=─2009/03/22 15:30回覆
8樓. 月亮小鬼
2009/03/14 11:48
謝謝

妳的教學真的是太清楚了

讓我這改版白痴都會改了

這是我第一次看懂如何改版

真的是很謝謝妳!


想去窺探月球的欲望,來自古人望月時的憂愁。

想飛奔去月亮的希望,來自從小美少女戰士的洗腦。

謝謝你的讚美!

能幫上妳的忙  我真的很開心^^

─=☆EG☆=─2009/03/15 13:16回覆
發表迴響

會員登入