Blogger 圖片大瘦身！官方提供密技轉換成 WebP 格式
前陣子 FB 的 Blogger 社團分享了一篇「 Blogger 圖片無痛轉換 WebP 」，原來 Blogger 圖片網址加上特定參數後，就能直接轉換成 WebP 格式，檔案得以大瘦身，圖片載入時間縮短不少。 這對圖片為主的 Blogger 部落格站長可說是一大幅音，例如美...
繼續閱讀全文Blogger 使用錨點的操作方式(新版文章編輯器)
如果不熟悉 HTML 語法的話，要製作出錨點效果不太容易。Blogger 新版文章編輯器增加了不少功能，其中「錨點」算是非常實用的一個，就算不懂語法也能實現這個效果。 本篇會說明錨點的原理，以及如何在新版文章編輯器做出錨點。 (圖片出處: hippopx.com )
繼續閱讀全文讓 Blogger 文章標題及文末都出現編輯圖示，方便修改文章
為了方便站長們編修文章，Blogger 官方在後台提供了設定方法，可在文末指定位置顯示編輯文章的小工具圖示，點擊後可直接編輯文章，省下在後台搜尋指定文章再編輯的時間。 這功能算是很貼心了，但對我來說還不夠，因為捲到文末仍需要花一些時間，如果要做到最方便的話，我想在文章標題附近...
繼續閱讀全文讓 Blogger 官方 RWD 範本側邊欄小工具能預設展開
去年 Blogger 官方推出的 RWD 範本，側邊欄工具的設計我覺得有一點比較沒彈性，全部預設都是關閉的狀態，所以使用「 樹狀標籤 V2 」的讀者曾反應，希望小工具的內容預設為開啟的狀態。 當時解決的方法是在程式碼單獨處理，但這個作法無法套用到每個小工具，因此本篇提供比較好...
繼續閱讀全文讓 Blogger 首頁每篇文章都能顯示日期
2024.2.1 公告: 現在已經有更方便的作法，請參考「 Blogger 日期格式化詳解 」→「二、首頁每篇文章都顯示日期(新版)」 最近接到一個需求，希望Blogger 首頁每篇文章都能顯示日期，因為同一天發佈的文章只會顯示第一篇的日期。 官方會這麼設計也不能說不合...
繼續閱讀全文讓 Blogger 首頁能點擊圖片就進入文章頁面
最近接到一個需求：「能不能點擊首頁文章的大圖，就直接跳到文章網址？否則要點 "繼續閱讀" 才能進入」。仔細想想的確很有道理，這才是友善的操作介面設計，以前怎麼都沒想過！ 於是現在 WFU BLOG 首頁文章封面圖，改為以最大尺寸呈現，並且加上文章頁面的連結...
繼續閱讀全文[教學]Blogger 較新/較舊文章按鈕改造__(一)顯示文章標題
![[教學]Blogger 較新/較舊文章按鈕改造__(一)顯示文章標題](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL4186PHQsJOfM1r5FEM9m-k7ZoNt4B42ZTKeNqLvgKlzdtTlNlYOE6lhtxLNauSp_c1BLqckbXGOTZtqhquBuGZdG6eOZ87uKUA2uto98E221NgMgk5pUtBZ_bL6ccOacYFWfniMV1c4H/s1600/newer-older-post-button.jpg)
在這個「 Blogger社群討論串 」討論的主題為 "Blogger 較新的文章與較舊的文章之連結"，也就是 "上一篇/下一篇文章" 的功能(不是指首頁或搜尋頁面的 "上一頁/下一頁" 分頁功能)。在文章頁面時，這兩個 ...
繼續閱讀全文[教學]隨機顯示 Blogger 標頭(banner)圖片
![[教學]隨機顯示 Blogger 標頭(banner)圖片](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEgH8Tak-ZbobAllK__lmcirW0Rh6ftimnoJYdussWHS-JmRVPiFUzTvUui0_cysgeDiATX8qIV-A4oaVocRgc49Tm8oclcf9k8XLEw4LSi9J0MLxfDxM22Do0EP1dNeu5LBwDrjR_1u0M/s1600/blogger-random-banner.jpg)
在這個「 Blogger社群討論串 」有成員詢問 "如何令 blogger 標題圖片隨機出現 ?"，除了當時沒有閒暇研究 js 如何寫，另外就是直覺認為此功能或許使用率不高。 後來想想某些性質的網站，例如攝影、美食、旅遊、遊戲(模擬市民 ths sims)...
繼續閱讀全文[教學]Blogger 如何安裝兩個導覽列？
![[教學]Blogger 如何安裝兩個導覽列？](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguEwpq5STIiYpdSMRYlZ8Qb4nNBhdOsLz_2wyquHtQhtKBG-hZ_9sgiE3MN9Xki1BmTVuQaMJQAGH4Sj-JqtWCvqoQ3Vd_C6jsdId-8QWDVZXORaqnvOevHPaQvh7R-8PqUQziAipLZYvw/s1600/blogger-two-navigation-bar.jpg)
常可在一些知名的網站看到，在網站名稱(標頭)的上方放置了一排導覽列，在網站名稱的下方也有另一排導覽列。一方面可能是網站的主題很多，一方面也可將主要與次要的導覽項目區隔開來。 不過 Blogger 預設只能安裝一個導覽列，如果想要在部落格顯示兩個導覽列的效果，請參考本文以下的說...
繼續閱讀全文[教學]Blogger 如何安裝兩個相同的小工具？
![[教學]Blogger 如何安裝兩個相同的小工具？](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjw0BKVgepCpVksxJakg9vgWZpu7t5k4m45iw85bLApfputxz5aCNUSJFqoieoDimdpKLeckXosCQozKFjIWY2e-XVMvsMnyUHwBia9BVRxIc3P3uM1Hve4u2ygB9flgWIbJGslI5pCQ9dq/s1600/blogger-two-same-widget.jpg)
這個問題看起來不像是個問題，只要重複安裝兩次不就好了？其實官方提供的小工具中，有某些只准安裝一次，因而這些「獨一無二」的小工具，無法在部落格上重複出現。 本文除了介紹如何重複安裝這些「獨一無二」的小工具，也探究一下有哪些合適的應用情境。
繼續閱讀全文[教學]讓 Blogger 能在文章下方顯示作者簡介
![[教學]讓 Blogger 能在文章下方顯示作者簡介](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje854y03yx3ZMicRoBPqeaAHd__nZNMcNJNn3ggUJV6cZw1ZgxhJdYcK27BMtfRSeynzpWIkas8-G-Ngp58OQyKh0mJa-A1bqgmKpwTo2QLeM5fShNZscB84txhDj4aRfA0RJoFjttPTs1/s1600/blogger-author-profile.jpg)
(Pic from: iconfinder.com ) 對於從搜尋引擎而來的訪客，首次拜訪對於作者總是不太瞭解，在不熟悉的情況下看完文章很容易直接離開。如果自認經歷能夠引起陌生訪客的注目，那麼文末放個作者簡介會是個留住讀者的好主意。 感謝 +Almighty Demiurg...
繼續閱讀全文讓 Blogger 有快速載入的展示(DEMO)頁面
(Pic from: midches.com ) 有時我們可能需要一些「展示頁面」，來秀出某些網頁效果(例如語法教學網頁)、或展示特定資訊(例如「 文章列表 」)，這樣的頁面最好能載入速度快，頁面上只需要出現 DEMO 的主題，不需要出現側邊欄、其他小工具。因此，在 Blogg...
繼續閱讀全文Blogger 修改「G+ 追蹤者」小工具的版面及編輯按鈕
Blogger 最近推出顯示 G+ 追蹤者的小工具，有人的反應是與 Google Freind Connect 的性質重疊，而 G+ 專頁也會顯示追蹤者頭像，如果再加上這個小工具，那版面真是好不熱鬧。 目前我暫時在網頁上只擺這個 G+ 追蹤者的小工具，可以裝作看起來很有人氣的...
繼續閱讀全文[教學]將 Blogger「標籤」小工具放在導覽列實作
![[教學]將 Blogger「標籤」小工具放在導覽列實作](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTIbCUw80NLOawW5RK3j9sPp7JlGnMDpAS-rqG5HWrrbq-mLcJ6AGW7emFv2WTPUIrqT4qfbjTPHvJFlPojWQL_LOZXbWiG3MucUP2vjvYx7A0VE0H7mU_cwUDc83tv8rJEj-Vnrw2ga-G/s1600/label-pagelist.jpg)
(Pic from: Office Worker ) 之前在「 +Shu-Yuan Tien ── Office Worker 」看到標籤出現在導覽列覺得挺神奇的，研究了一陣後發現可以在後台先把導覽列用滑鼠拖曳到網頁最上方，接著再把「標籤」小工具拖曳到導覽列，那麼網站所有的...
繼續閱讀全文讓「Blogger標籤/搜尋頁面」能隨時切換標題模式與文摘模式
(Pic from: iconfinder.com ) 2016.3.28 公告： 2016.3.28 公告： 目前已發佈新版，請前往「 Blogger 標籤文章列表 V2 」 Abin 大發表的「 標籤/搜尋頁面只列出標題 」非常實用，過去曾使用過一段時間，但最後還是將此...
繼續閱讀全文[小工具]Blogger 最新文章＋任意尺寸縮圖﹍Json 縮圖資料解析
![[小工具]Blogger 最新文章＋任意尺寸縮圖﹍Json 縮圖資料解析](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEfN4HmRWTdVEHbjMtISeABb1e-aq3lY-Wak6ziGpRnWltPePb2kmd8FM-nJAPmZRYvDFiTNr7nlJ0Z91bEN92IjbXxCnDmFdEMaOVuZiIdtzlz5kLpBISMW0_f4HJ11zclfO-gg06NZWj/s1600/new-post.jpg)
(Pic from: designdownloader.com ) 2015.10.21 公告： 此工具目前已更新到 V2 版，請前往新版安裝頁面：「 Blogger 最新文章 V2﹍任意尺寸縮圖 + HTTPS 」。 改完「 熱門文章縮圖 」功能後，下一個要動手的便是「...
繼續閱讀全文[小工具]Blogger 熱門文章＋任意尺寸縮圖__兼談圖示製作技巧
![[小工具]Blogger 熱門文章＋任意尺寸縮圖__兼談圖示製作技巧](https://3.bp.blogspot.com/-W2pGpR3JY5c/UA99IsJnUkI/AAAAAAAADfE/IzADoe2Kbyk/s1600/popular-post.jpg)
(Pic from: psdgraphics.com , dreamstime.com ) 2016.8.15 公告： 已推出 V2 版本，請前往這篇「 Blogger 熱門文章 V2﹍卡片式縮圖 + 自適應尺寸 」。 Blogger 內建的熱門文章小工具，附帶了一個美觀的...
繼續閱讀全文[教學]讓網頁文字使用各種底線圖案__(1) 安裝與使用 (CSS 技巧)
![[教學]讓網頁文字使用各種底線圖案__(1) 安裝與使用 (CSS 技巧)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDDaAhrD5srZojohjvbhxwC2XnjrjGud5N9bNftVLCK_PfuUHmvAr6UhAV1tjIKMfwm8QpN39wLVC_l82EPRGOzPxQ5uwsvELzGarZgp5zVeMnxf7kijnO8cODHuMUKMnZvmtmbu74wldH/s1600/underline.jpg)
以文字內容為主的部落格，先天上吸引目光的能力已經輸旅遊、美食、攝影等以圖片為主的部落格一大截，如果整篇文章都是密密麻麻的文字，那麼再有深度的內容，也會如同嚴肅的講課內容一般，讓人昏昏欲睡。 幫純文字上色、讓文章的可看性加點分大致有兩個途徑，一個是改變標題、關鍵字的顏色，另一個...
繼續閱讀全文[教學]Blogger 網誌清單的妙用＋網站小圖示的調校
![[教學]Blogger 網誌清單的妙用＋網站小圖示的調校](http://1.bp.blogspot.com/-sAmuYbV5EGM/UAZupm8WD0I/AAAAAAAADLQ/kNxJDl4XMe0/s1600/BlogList.jpg)
之前在友站看到交換連結清單，發現竟然除了基本的網站名稱之外，還能夠抓到最新文章的標題、時間等等資訊，而且 就像即時排行榜一樣 ，只要交換連結發佈了最新文章，該網站就能立即攀上排行榜第一名，位置自動跳到最頂端！ 當時覺得實在太神奇了，這是那個強大的外掛竟然可以做到這一點，後來才...
繼續閱讀全文Blogger 能否一次修改多篇文章的文字或內容？
曾在 BBS 看過有人詢問能否一次編輯多篇文章的內容，得到的回答是只能一篇篇修改；由於當時沒有這樣的需求所以沒有深究這個問題。等到最近自己遇上幾個類似的問題── 想要一次修改全部文章的標籤名稱 、 一次修改文章內部標題的顏色 ，尋找答案後發現要達到這個目的還真是困難。一般而言，要...
繼續閱讀全文