公佈欄

2016年9月12日 星期一

設定Blogger 背景心得 (一)

由於回憶是個 Blogger 新手,想說今天來換個美美的背景圖衝個瀏覽人數~


1.在對樣板做任何修改前請先備份,以免發生改不回來的情況
2.本文圖片如果太小可以點選圖片來放大




看起來好像還不錯,只是圖片似乎右邊被切掉了?

等等... 這我自己都看不下去了 =_= |||

造成上述情況的原因 ↓


可以看到第一個選項 對齊  -- 預設為左上對齊,所以右邊被切掉了
            第二個選項 拼貼  -- 此為預設值,意思為將不足的部分用同一張圖片補齊
                                                (換句話說就是以上面的對齊方式為基準向四方延伸)

不管你有沒有懂,換換看選項就知道了





我們可以看到圖片置中了,可是下方出現空白 (代表圖片不夠大)

我們再來看看這張圖片


看起來似乎遠超過所需的大小?  (這也是選這張做說明的原因)
俗話說做事要追根究柢,所以回憶一不做二不休把網頁原始碼的圖片抓下來看看



恩... 看來存在圖片太大被壓縮的可能 (抑或是 Blogger 自動把圖片縮小了)
那我們試著取消勾選 隨頁面捲動


很明顯看到圖片依然有部分被截掉了

此時圖片是固定的

那換個方式,直接上傳到圖床如何?

Google 圖床 ↓                                      Imgur 圖床↓
   
   

附上原圖做比較:


可以看到兩圖床都有一定的裁切,另外依然會有圖不夠大的問題。

如果要堅持使用 隨頁面捲動 目前回憶想到的方法只有一個
去找 (或製作) 一張很長的圖  長寬比大概 4:1
這樣才夠覆蓋整個 BLOG
什麼? 你說你要範例?    回憶的 BLOG就是了....


檔案較大的圖建議上傳到圖床,使用內建上傳很可能會模糊

因為使用了非內建的功能,我們需要更改一些程式碼
什麼? 你說你不懂語法?   沒關係我也不懂
儘管沒有完全懂,但修改一些簡單的項目還是做得到的

首先,我們先隨意換一張內建的圖片 (隨便一張都可)




在這裡我們選擇  編輯 HTML




將滑鼠點擊紅色區塊任意地方後按下 Ctrl + F
在新出現的 Search 欄位中填入

將 url (...) 括號中換成你圖片的網址
在這裡解釋一下紅框中四個參數的意義

第一個參數可用選項: 第二個參數可用選項: 第三個參數可用選項: 第四個參數可用選項: 在了解上述程式碼的意思,就可以改成你自己想要的啦~
在這裡回憶選擇的是 no-repeat fixed top center

1 則留言: