讓 Blogger 首頁能點擊圖片就進入文章頁面

最近接到一個需求:「能不能點擊首頁文章的大圖,就直接跳到文章網址?否則要點 "繼續閱讀" 才能進入」。仔細想想的確很有道理,這才是友善的操作介面設計,以前怎麼都沒想過! 於是現在 WFU BLOG 首頁文章封面圖,改為以最大尺寸呈現,並且加上文章頁面的連結...
繼續閱讀全文Adsense 相關文章廣告 (相符內容功能) 使用心得

去年 Adsense 推出一個「相符內容功能」外掛,效果就跟一般部落格常安裝的相關文章工具類似,目的是用來增加訪客停留在網站的時間,就像常見的「 Blogger 相關文章 V2 」、「LinkWithin」等。 當時看到並沒什麼興趣,主要是這工具裝了也不能增加收入;若是談美觀...
繼續閱讀全文WordPress 如何快速搜尋(修改) 佈景主題範本或外掛中的字串﹍String Locator

由於朋友經營了幾個 WordPress (簡稱 WP) 網站,之前幫忙處理版面配置、修改外掛、寫客製程式等等問題,在 Blogger 範本已經十分熟悉的前提下,面對 WP 範本的修改,一開始說實在很頭大。 例如要在佈景主題或外掛中搜尋一個特定字串來修改,或是要找到網頁上的某個...
繼續閱讀全文如何提交 Google 表單後, 跳轉到指定網址?

前陣子發佈了「 使用 Google 表單取代 Blogger 聯絡表單 」之後,最近接到一個需求:「 希望當訪客填寫完 GoogleForm 後,點 "提交" 的按鈕,可以連結到另一個 Thank You Page 的感謝網誌,我會在感謝網誌裡放入轉換追蹤的C...
繼續閱讀全文Blogger 處理行動版時的各種疑難雜症﹍FAQ 整理

在「 Lazy Load 圖片延遲載入 」留言 #6, +Ala Go 提出了一個觀點:「我的行動版即使使用"網頁版",載入也頗快的,就用"網頁版"頂著先」。 根據與他的一系列對話,以及其他讀者的相關提問,覺得可以將處理 Blogge...
繼續閱讀全文更換第四台業者心得﹍雖然「北都」給的優惠很多,但最後我下決定的因素是這個...

2018.8.14 公告: 由於北都未信守承諾,目前已不續約,請見「 使用北都兩年後解約感想﹍第四台各種替代方案整理 」。 2019.9.14 公告: 不看第四台之後,我做了一個可以線上合法收看多數台灣節目的選台器工具,無論是新聞、財經、政論、綜藝...各種節目一應俱全,推薦...
繼續閱讀全文使用 Google 表單(自訂樣式) 取代 Blogger 聯絡表單

Blogger 官方提供的「 聯絡表單 」工具很方便,可以輕易地放在網站上任何位置來充當留言板,訪客不需要登入帳號即可留言。 從使用以來,在收到的訊息之中,發現某些狀況不斷重演,例如訪客的留言不知道是針對那個主題、發問沒留下網址等等,這些現象也沒什麼好的解決方法,原因在於制式...
繼續閱讀全文迅速搜尋 Evernote 記事標題的技巧﹍自製各種快速鍵

隨著使用 Evernote 的時間越久,累積的記事數量相當可觀時,搜尋結果容易出現許多雜訊,得花不少時間過濾,才能找到真正需要的那則記事。 如果平常為記事命名標題時,有放入適當的關鍵字,那麼日後只需要針對 "記事標題" 搜尋,就能得到比較精確的結果。 ...
繼續閱讀全文讓手機版網頁 Youtube 影片能自動調整寬高尺寸

最近接到一個需求,在手機上的 Youtube 內嵌 Iframe 影片會超出版面,希望能解決這個異常現象。 會發生這個狀況,主要是 Youtube 提供的內嵌程式碼,預設尺寸大致為 560px 寬、315px 高,這樣的數值在網頁版是 ok 的,但手機的話寬度就不夠了。 ...
繼續閱讀全文讓 Google 表單(試算表) 定時寄出 PDF 報表

在這篇「 讓 Google 表單(試算表)能自動寄信 」,我們利用一段簡單的語法,就能讓填表者立即收到 Email 通知(例如訂購商品的項目),用來保存填表記錄。 如果是商業用途的話,Email 的純文字填表記錄,可能不足以展現專業度。 那麼本篇就來介紹,如何將表單的填寫...
繼續閱讀全文Google 表單自訂 CSS 版面樣式教學

最近接到一個需求,想要將原本內嵌到網頁的 Google 表單(問卷),改成可以符合現有網站風格的 CSS 版面樣式。仔細想了想,這個需求的確有其道理存在: 1. 雖然官方提供了不少樣式可以替換,但總是無法自訂所有細節,不一定與我們網站的風格有搭。 2. IFRAME 內嵌...
繼續閱讀全文讓 Blogger 文章頁面以最大寬度呈現(隱藏側邊欄)

這篇 "Blogger 論壇貼文" 詢問要怎麼樣才能「 觀看文章時,內文不會顯示側邊欄 」?意思就是希望調整部落格的版面,將側邊欄隱藏起來,那麼文章區塊就能延伸到最大的寬度。 的確很多站長都喜歡這種清爽的版面設計,友站「 小說界的李洛克 」就是這樣的風格,...
繼續閱讀全文Blogger 樹狀標籤 V2.1﹍切換標題模式

「 Blogger 樹狀標籤 V2.0 」是安裝懶人包,適合新手安裝。本篇 V2.1 版加入了「切換標題模式」的功能,安裝上要多幾個步驟,建議使用 Blogger 一段時間以後再嘗試安裝。 以下先簡單介紹 V2.1 版的功能,想要直接安裝跳到「二、準備動作」。 (圖片出處...
繼續閱讀全文Blogger 文章分類﹍樹狀標籤 V2.0 -- 安裝懶人包

「 多層樹狀標籤 」是本站最熱門的 Blogger 工具,不過安裝、使用有問題而留言提問的數量,也是最多的。原因可能是安裝方式比較複雜,沒那麼容易一次成功。 這次 V2 改版使用了懶人包的安裝方式,相信可以大幅減少出錯的機率。同時改版最大的不同是加入「切換摘要及標題模式」,這...
繼續閱讀全文網頁使用程式碼高亮的最佳作法及推薦外掛

提供程式碼分享的網站,為了讓版面視覺效果美觀,通常會安裝「程式碼高亮」這樣的外掛。而帶來的影響是,網站的外掛裝越多也會影響網頁載入時間,尤其是沒有展示程式碼的文章頁面,也必須執行這個沒有必要載入的「程式碼高亮」外掛。 如果能夠需要展示程式碼時,才執行「程式碼高亮」外掛,相信會...
繼續閱讀全文Blogger 搬家匯入文章的各種疑難雜症整理

前陣子處理從痞客邦搬家到 Blogger 的案子時,在 "搬圖床到 PICASA" 、 "轉移對應文章的網址" 等問題都有辦法解決,反而是「匯入文章」這部分有些地方很棘手,不一定都有解決方案。 其實 Blogger 匯入文章的狀況還真不...
繼續閱讀全文Blogger 安裝 Adsense 網頁層級廣告(錨定/重疊/穿插)使用心得

"浮動廣告" 是 Adsense「 明文禁止 」的行為,原因是這樣的行為,屬於「 操控廣告的放送和顯示以吸引不必要的注意 」,會有比較大的機率吸引訪客點擊廣告,等於用不正當的手段增加收益,WFU 也曾在「 部落格浮動浮動廣告 」→「四、錯誤示範」提醒讀者這件事...
繼續閱讀全文Blogger 隨機文章 V2 + 輪播效果

前陣子介紹完最熱門的 jQuery 輪播外掛「 Owl Carousel 」,聯想到部落格文章結束處,經常會配置的 "推薦文章" 工具,例如「 相關文章 」,如果搭配輪播功能的話,應該會有不錯的效果。 要進行輪播之前,得先隨機抽出足夠的樣本數,而 ...
繼續閱讀全文Chrome 最好用的滾輪換頁及滑鼠手勢套件 SmartUp

原本我認為 Chrome 最好用的滑鼠滾輪外掛是「Mouse Stroke」,不過這個套件之前被 Chrome 商店下架,只能用安裝 .crx 檔的方式執行。而自從 Chrome 某次改版之後,只允許安裝在商店上架的套件,所有 .crx 檔的外掛都失效,因此只能從 Chrome ...
繼續閱讀全文Blogger 只要做到這幾件事, 就能輕鬆加強 SEO 搜尋排名

之前因為讀者對於 "搜尋排名" 的提問,整理了一篇「 Google 搜尋不到自己的文章嗎?搜尋結果不如預期狀況整理 」,以 FAQ 的形式回答了常見的疑難雜症。 不過有些讀者因為從其他平台轉換到 Blogger,對於操作還沒那麼熟悉,因此本篇以懶人包的方式...
繼續閱讀全文Blogger 官方留言板的優點及妙用﹍加強 SEO 搜尋排名

看到不少站長將 Blogger 官方留言板關閉,改用 G+ 或 Disqus 等其他第三方留言板,原因不外乎原生留言板功能比較陽春。其實這麼一來,可是白白損失一部份從搜尋引擎而來的流量。 或許你還不知道官方留言板與 SEO 之間的關連性,沒關係看完本篇之後,就會瞭解 Blog...
繼續閱讀全文CSS 製作各種 Ajax 載入動畫集錦

什麼是 Ajax 載入動畫呢?網頁跟後端請求資料,在等待的空檔,通常會先顯示 GIF 動畫,避免訪客等得不耐煩。這個過場動畫的英文名稱,就叫做 Ajax Loader。 由於 CSS 已經能處理細緻的動畫效果,那麼如果是簡單的過場動畫,就能用 CSS 來實現,不一定要讀取 G...
繼續閱讀全文矛與盾之爭, 破解「鎖右鍵+防複製」的 Chrome 外掛, 以及「保護著作權」的方法

2016.8.31 公告: 目前已發佈新工具「 免安裝外掛, 直接破解網頁 "鎖右鍵+防複製" 的方法 (使用書籤) 」,只要安裝這個書籤,不用安裝任何外掛,即可破解「鎖右鍵+防複製」。 網路的本質是資訊共享,知識的流通可以讓有需要、能應用的使用者創造出更...
繼續閱讀全文最熱門 jQuery 圖片輪播外掛 Owl Carousel﹍CDN 安裝懶人包

「 Owl Carousel 」可說是使用率最高的圖片輪播外掛,許多免費、付費下載的網頁模版或部落格範本,都是內建這個輪播效果。主要原因可能是行動裝置普及後,「Owl Carousel」不但 可顯示自適應(RWD)版面,還支援手指觸摸操作的效果,可輕易地在手機直接用手勢滑動輪播圖...
繼續閱讀全文Dropbox 外連產生器﹍可使用於非公開(Public)資料夾

2025.7.17 公告: 由於 Google Drive、Dropbox 都已不提供檔案外連,請改參考此篇「 JS 免費外連服務推薦 」來取得 JS 外連。 由於「 Google Drive 檔案外連功能將於 2016 年 8 月關閉 」,為了讓曾安裝本站各種工具的讀者,能先...
繼續閱讀全文Google Drive 檔案外連功能將於 2016 年 8 月關閉, 站長須即早準備

2025.7.17 公告: 由於 Google Drive、Dropbox 都已不提供檔案外連,請改參考此篇「 JS 免費外連服務推薦 」來取得 JS 外連。 如果你的網站使用了任何放在 Google Drive 的外連檔案,例如 JS / CSS / 圖片 / 影音 / P...
繼續閱讀全文Blogger 讓讀者以 Email 訂閱最新文章﹍任何位置都能擺放, 免註冊 FeedBurner

用「 RSS 」訂閱網站最新文章,是非常方便又強大的工具,可惜只有網路重度使用者比較知道 RSS 是什麼,一般的讀者並不熟悉 RSS、且不一定想要瞭解。 為了讓各種層次的讀者都能收到網站最新文章的通知,提供 Email 訂閱會是最簡單的方式,且操作方便、不需另外研究相關工具。...
繼續閱讀全文發現錯誤訊息不用擔心, Blogger 開始支援分享到 FB 顯示縮圖(以及相關的 Meta + OG 標記)

最近處理一個 case 需要幫忙設定 Facebook 的 Meta 標籤,也就是讓 Blogger 文章分享到 FB 時,可以正常出現縮圖、摘要...等等資訊,結果很意外的,使用「 官方 Debug 工具 」時,頻頻出現以下錯誤訊息: "Errors That M...
繼續閱讀全文Blogger 按下標籤出現文章列表 V2﹍可切換摘要及標題模式

很多從其他部落格平台搬到 Blogger 的站長,都會詢問「按下標籤後顯示文章標題列表」這樣的功能。的確,站長們對自己的文章內容瞭如指掌,想要找站內的資料時,真的只需要看到文章標題就好。 但是站在訪客的立場,對於我們的文章內容、甚至網站風格都不太熟悉的時候,按下標籤若貿然只顯...
繼續閱讀全文網頁圖片該怎麼處理, 顯示效果會比較清楚?

最近有讀者遇到一個狀況,網站使用的圖片都是 640px 寬,但在 Blogger 的文章區塊扣掉 padding 等等的數值後,可顯示寬度為 590px 左右。當圖片從 640px 縮小到 590px 的情況下,圖中某些文字因為變小而顯得比較不清楚(或是說效果比較差)。因此,希望...
繼續閱讀全文FB「讚」按鈕與 Google「+1」按鈕最簡單安全的安裝方式﹍可解決對齊問題

在「 Facebook 讚按鈕﹍四種安裝方式剖析 」有讀者於留言 #2 表示 "不曉得刪除了哪個小工具的語法,所有文章都不會再顯示臉書專頁的讚按鈕了"。 如果對程式碼不熟悉的話,FB 官方提供的「 HTML5 語法 」,的確有可能安裝失敗、或發生彼此打架的...
繼續閱讀全文2023 年防止 Chrome 自動重新讀取分頁內容

2023.3.17 更新: 因 Chrome 版本更新,原文方法已經失效,目前 2023 年適用的方法請跳至「三、2023 調整 Chrome 設定方法」。 最近發現使用 Chrome 時,對於已經開啟的網頁,只要切換到別的分頁一段時間後,再切回原來的分頁時,整個頁面就像自動...
繼續閱讀全文CC0 免費圖庫搜尋引擎﹍2016 更新版

製作「 CC0 免費圖庫搜尋引擎 」已經將近一年,在這不算短的時間內,各大免費 CC0 圖庫產生了不少變化,收錄的網站也是有調整的必要。 同時使用上,發現一些不太正常的現象,例如搜尋結果有時會出現 "非 CC0 圖庫網站" 的圖片。雖然常使用 CC0 圖庫...
繼續閱讀全文H1 標籤使用圖片代替文字時, 該如何處理?

前陣子處理一個案子時,被詢問到「網站標題使用圖片的話,會不會比較不容易被搜尋到?」顯然這位讀者是具備 SEO 概念的,一般來說,網站標題會放在最重要的 H1 標籤,而且使用文字敘述。 由於 SEO 非我的專長,還是看看專家怎麼說比較保險。然而在尋找資料的過程中,發現用 ...
繼續閱讀全文Picasa 關閉之後, Blogger 要如何管理圖片?

自從前陣子 Google 宣布「 關閉 PICASA 」之後,不少讀者擔心 Blogger 使用的 PICASA 圖片會不會受影響?另外一點就是,習慣用 PICASA 管理、編修圖片的使用者,將來要如何管理圖片? Google 的意圖很明顯,收購 PICASA 取得關鍵技術後...
繼續閱讀全文緊貼螢幕邊緣的浮動 FB 粉絲團外掛

這個不會隨著螢幕捲動而變換位置的 Facebook 粉絲團外掛,會黏貼在螢幕邊緣、只顯示垂直的 "Facbook" 字樣,當滑鼠經過時才將 FB 粉絲團滑動顯示出來,而滑鼠離開後則立即收合。這樣的外掛效果並不算少見,許多知名部落格都有設置。 最近處理一個案...
繼續閱讀全文Blogger 延伸閱讀 [小工具][文字版]
![Blogger 延伸閱讀 [小工具][文字版]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieEme0aVa0F1UJh1LAo9ecr57flsrggvxDxfnQlWdeC8dMQSAuknHLREqwOZO0O_WfGRVsVKb_gL8ja6hrkWqe1zfxbOv6vy997QsuPMPH7ZtZdBVGkor1g-BAB-4ajXh0soH_vc21WNQl/s1600/blogger-related-post-in-text.jpg)
為了讓訪客看完文章不馬上離開,我們通常會在文末設計一個區塊,稱為 "延伸閱讀" 或 "您可能對這些文章有興趣" 等等,接著手動挑選、安插一些相關文章的連結。 手動複製這些連結自然是很麻煩,也是可安裝一些小工具來替我們做這件事。其實 WF...
繼續閱讀全文部落格網站是否加強 SEO 就能帶來流量?

這是一個詢問度很高的主題,不少讀者請 WFU 檢視網站時會詢問 " SEO 有哪裡要加強 "、或是 " SEO 要如何改善才能帶來流量 "? 我想 "SEO" 對很多部落格站長而言,也許存在一些迷思,有些是把 SEO...
繼續閱讀全文讓 WIN8 / WIN10 平板關閉螢幕後能繼續播放(Youtube)音樂, 不會進入睡眠

在運用零碎時間、或做些不必使用眼力的活動時,我會同時聆聽一些 Youtube 演講、或不錯的節目片段,使用的工具是把富有行動力的 Asus T100 平板,當成音樂、影音播放器,因為電池續行力比手機強。 沒想到測試之後,Windows 8 / 10 系統也碰到跟 Androi...
繼續閱讀全文Blogger 使用文章編輯器的技巧, 及各種疑難雜症整理

前陣子幫讀者調整部落格版面及字體 CSS 時,被詢問到「我已經按照 " 網頁中英文字型跨平台設定最佳化 " 的教學來設定,為什麼文章的字型還是顯示 "新細明體"?」。其實這樣的案例 WFU 遇到不少,問題出在 Blogger 文章編輯器的使...
繼續閱讀全文檢查你的 Google Analytics 是否安裝了兩次, 那麼數據也會乘以二喔!

最近幫讀者檢視及優化 Blogger 範本內容時,發現 Google Analytics (以下簡稱 GA) 安裝碼出現了兩次,根據「 優化網站效能該注意哪些事? (1)最關鍵的考量因素 」,範本中的 JS 執行應該盡量減少,因此順手移除了其中一個。 原本認為這不是什麼大不了...
繼續閱讀全文Blogger 行動版改用自適應(RWD) Adsense 廣告, 讓版面更美觀

最近幫讀者處理行動版時,發現 Adsense 若改用「 自適應(RWD)廣告單元 」,效果會比想像中來得好。 使用原始固定尺寸的廣告時,在不同行動裝置的效果都不一樣, 小尺寸手機有可能超出頁面,而在大尺寸裝置或平板,則可能版面顯得空曠 。總之,有一好就沒兩好。 那麼本篇就...
繼續閱讀全文運用 PTT 蒐集各種(旅遊)資訊﹍不可不知的操作及搜尋技巧

「BBS」看似是一個古老、過時的平台,但是在搜尋特定資訊時,跟 Google 相較之下,有時它會是我心目中的第一把交椅。 在多數情況,Google 能幫我們找到問題的正確解答。但是當搜尋的資訊牽涉到商業行為時,那麼 Google 到的資料就很容易包含大量雜訊,我們需要分辨哪些...
繼續閱讀全文瞭解 Blogger 動態檢視範本 + 行動版範本的特質

這個 Blogger 中文論壇貼文詢問「 動態檢視範本如何修改 」,其實本站寫的許多小工具,不時也有讀者詢問怎麼安裝到動態檢視範本(Dynamic Views)、或官方行動版範本,因為顯示不出來。 雖然 Blogger 是個自由度很高的平台,什麼都能改、什麼都不奇怪,不過 ...
繼續閱讀全文部落格行動版的首頁設計﹍欣賞這 9 個網站的版面效果

雖然 WFU 已經幫不少 Blogger 平台的站長做過行動版,不過自己的行動版網頁卻是一直沒有好好進行規劃,原因跟網站性質有關,讀者多半會在網頁版閱讀程式碼及操作,且 WFU BLOG 的行動裝置訪客大約只有 10% 左右,所以改造行動版這件事遲遲沒有排進待辦事項。 不過像...
繼續閱讀全文WFU BLOG 外連 JS 變更及操作說明

2025.7.17 公告: 由於 Google Drive、Dropbox 都已不提供檔案外連,請改參考此篇「 JS 免費外連服務推薦 」來取得 JS 外連,並可忽略本篇內容。 這是一篇公告文章,本站提供的各種 Blogger Hack 及 工具,若包含了 JS 檔外連,...
繼續閱讀全文Blogger 何時該發佈「文章」, 何時該發佈「網頁」?

這個 Blogger 中文論壇貼文詢問「 "文章" 與 "網頁" 的差別 」,對於剛接觸 Blogger 的使用者,的確很難區分這兩者的差異、以及使用的時機。 Blogger 的官網「 建立及編輯文章 」、「 在網誌中新增網頁 」這兩個...
繼續閱讀全文部落格寫作軟體的選擇, 以及確保文章寫作安全的技巧﹍如何進行版本控制, 當內容被覆蓋或誤刪時可以救回

有讀者在「 Blogger 文章不小心誤刪了怎麼辦? 」留言表示,在 Blogger 後台編輯時出了意外,文章發佈前就不小心把內容覆蓋,詢問是否有機會救回? 答案很簡單:沒辦法。然而這案例發生的機率很低,所以本篇不會針對極端的狀況進行分析,主題著重在事前要如何預防意外。 ...
繼續閱讀全文使用 Font Awesome 圖示速查表(cheat sheet), 安裝快速不麻煩

最近使用「 Font Awesome 」替換了網站各處所有的小圖示,包含「 社群分享按鈕 」、各式側邊欄及網頁底部圖示。由於官網並未提供方便的安裝語法查詢管道,導致必須一一點開個別圖示的頁面來複製語法,因而浪費不少時間。 於是整理了本篇的 Font Awesome 圖示一覽表...
繼續閱讀全文Google 搜尋不到自己的文章嗎?各種搜尋結果不如預期的疑難雜症整理

這個 Blogger 中文論壇貼文詢問為何「 Google搜尋結果找不到文章 」?相信站長們都很關心自己網站的文章,在搜尋引擎的能見度,畢竟搜尋結果會直接影響網站流量。如果能弄清楚 Google 的一些運作原理,就能知道哪些事是我們的基本動作。 類似的提問並不算少見,然而細節...
繼續閱讀全文