長時間看電腦螢幕，需要護眼族群的救星﹍富士通反射屏購買及安裝心得
對於電腦工程師、文字工作者等，這類需要長時間盯著螢幕上班的族群，幾年下來除了眼睛乾澀、不舒服，也代表肝臟受了很大的影響。基本上現在的螢幕背光，一代做的比一代更亮，就算有濾藍光這類的產品(或鏡片)，充其量都只是治標而已。 要真正治本、保護眼睛，就得摒棄螢幕強烈的背光，使用類似 ...
繼續閱讀全文讓搜尋結果排除你不想看到的網站﹍自製 Google 搜尋引擎教學
網站逛多了之後，相信我們會有自己的一份口袋名單，某些網站就是比較沒我們的緣，特別不想看哪些類型的網站。 有時我們就只是想好好的看個文章，但可能整個版面到處都是讓人分心的浮動區塊，或是不時彈跳出一個視窗來嚇人，這類網站就可能成為黑名單。 如果能在上網找資料時，讓搜尋引擎將這...
繼續閱讀全文讓每個網頁都能自動調整寬度，省下手動縮放的麻煩﹍Chrome 套件 Zoomy
使用 Full HD (1920x1080)的寬螢幕後，瀏覽網頁會有個小困擾，需要常常手動按 Ctrl + 放大網站的寬度，否則可視範圍及文字會過小。 如果是常逛的網站，其實調整過一次後，瀏覽器會記住設定，也就麻煩第一次而已。不過如果有這麼一個程式，可以 自動偵測網頁寬度，...
繼續閱讀全文Windows 筆電投影(追劇)心得﹍微軟無線顯示轉接器
現在網路有不少影音平台可以線上追電視劇、歐美影集，不必侷限於第四台的播出時刻，也不必浪費時間看廣告，還可以一次追完好幾季。比起過去為了等一集，常常得苦苦等上一個星期，真是太幸福了。 然而網路雖然方便，但 無論是盯著電腦螢幕、或是行動裝置，強烈的背光遲早會讓眼睛、健康受到嚴重傷...
繼續閱讀全文用 Google Apps Script 操作試算表 (2)搜尋、讀取資料庫
接續上一篇「 用 Google Apps Script 操作試算表 (1)製作資料庫 + 寫入資料 」的流程後，本篇來看如何用 Google Apps Script (GAS) 搜尋、讀取寫入試算表的資料。 (圖片出處: pixabay.com )
繼續閱讀全文PTT 停止 RSS 功能後，如何繼續訂閱個版文章﹍FEED43 自製 RSS 教學
除了使用「 RSS 閱讀器 」(例如 Feedly) 來訂閱各種網站的最新文章，PTT 個版也是非常重要的資訊來源。例如 WFU 會訂閱 Web_Design(網頁設計) 版，可以了解這個領域的同好最近有什麼新訊息、或討論哪些問題。 訂閱 PTT 個版已經好幾年了，但前陣子突...
繼續閱讀全文Facebook 留言框最簡單快速的安裝方式 + 常見問題整理
「 FB 留言外掛程式 」是協助架站時，安裝率滿高的一個工具。過去已經寫過「 Facebook 留言板安裝懶人包 」，由於 FB API 改版多次，加上現在的 API 版本已經支援 RWD，決定將安裝程式碼改得更為精簡，比舊版的 code 少了一半以上，本篇可以視為「FB 留言框...
繼續閱讀全文取得 Google 相簿圖片外連更好的方法﹍轉換為 Picasa 連結
在所有圖床之中，Google 相簿(Google Photo) 的圖片連結，可說是最詭異的一個，從網址字串你很難辨識出這是什麼，沒有路徑結構、沒有檔名，字元數多到相當於一篇小品文章。 這樣的連結型態，相當不適合用來當圖片網址，也不利於 SEO 。 在上一篇「 其實 Googl...
繼續閱讀全文其實 Google 相簿依然是 Picasa，你可能不太相信
自從「 Google 宣布關閉 Picasa 」之後，這段期間以來，每隔一陣子就需要跟案主、讀者安撫或解釋，是否該繼續使用 Picasa 圖床，要不要擔心 Google 把 Picasa 收起來。 說真的，比較需要擔心的反而是 Flickr 圖床的免費用戶，因為「 Yahoo...
繼續閱讀全文用 Google Apps Script 操作試算表 (1)製作資料庫 + 寫入資料
過去曾寫過「 利用 Google 試算表當小型資料庫﹍讀取+寫入+搜尋 」等 4 篇系列文，簡單列一下該系列使用方案的優缺點： 讀取、搜尋資料時， 需要發佈或分享試算表，因此適合安全性較低的資料 。 查詢資料很方便 ，Google 提供了各種 API，也可使用資料庫 SQL...
繼續閱讀全文自動備份 Blogger 文章的一些實驗，我找到了最佳方案
天有不測風雲，未雨綢繆會比出了意外再四處奔走來得從容。相信部落格站長都同意， "文章" 是最重要的資產，雖然發生意外的機率不高，但只要有一次，絕對會痛不欲生 ，就像「 Blogger 網站突然消失了怎麼辦？(網誌被刪除案例分析) 」，或是「 Blogger 文...
繼續閱讀全文協助痞客邦搬家到 Blogger 流程紀錄 + 常見問題解決
近期有一些痞客邦站長找本站協助，要搬家到 Blogger ，主要原因除了痞客邦為人詬病的廣告策略之外，也可參考「 Google搜尋結果將調降自動跳出蓋版或插頁廣告的網站網頁排名 」。另外則是有人說過 "痞客邦會大小眼，小咖的部落格比較容易不穩"，雖然我聽到的算...
繼續閱讀全文如何使用 Google reCAPTCHA 防止網頁被留垃圾廣告訊息
前陣子「 Blogger 中文論壇 」遭到垃圾訊息洗版，被機器人大量貼文，一次發了幾十篇，甚至有一次達到上百篇。雖說也不會造成太大困擾，因為 Blogger 後台一次能勾選 50 篇文章刪除，不用幾秒就全部消滅了，不過能夠事先預防總是比較省事。 於是想到 Google 的這個...
繼續閱讀全文將 Google 行事曆排程顯示在網頁﹍FullCalendar CDN 安裝懶人包
過去一段時間，網站業務的排程經常處於吃緊的狀態，於是決定好好利用「 Google Calendar 」，把行事曆的排程顯示在網頁上，業主可查詢案件何時能進入排程、以及案件的時程區間。 基本上，Google 日曆預設就有提供嵌入網頁的語法，如果是功能取向的站長，不一定需要另外瞭...
繼續閱讀全文使用 Blogger 免費範本，可能需要面對的問題有哪些？
使用 Blogger 的優點之一，就是有取之不盡的免費資源，網路上可找到各種美觀、符合自適應(RWD)、且又免費的版型可套用。 免費範本的確很方便，一陣子後覺得不合用、或想改個新鮮的版型，都可再另外找一個，如同免洗筷一般，再換一雙就好。 但在某種程度上，免費範本跟免洗筷還...
繼續閱讀全文Blogger 使用圖片的各種技巧：上傳+刪除+管理+取得網址 (Picasa 圖床)
協助許多使用者架站時，由於不少都是剛接觸 Blogger，不太熟悉這個部落格平台怎麼處理、操作圖片。他們可能用過台灣其他的免費部落格平台，習慣了有個可以專門上傳、管理圖片的後台介面，但在 Blogger 找不到這樣的東西，因此「Blogger 要如何上傳、管理圖片」，變成了常見的...
繼續閱讀全文[網頁設計] 有助於色盲使用者的友善體驗 (2)實作範例
![[網頁設計] 有助於色盲使用者的友善體驗 (2)實作範例](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMObqBozDq1rAdU1p6HM5w6z0EF3YZpOsuCFb3nJ8RQyaUVPcGKb-TQ94vZVznLXwsf_2veaAGtaaUhF_8yrimL6_5ba910xO6wblQhjD7JWDbQRP5QErgUmZiCZrWIgL-FvxHUrehlLcY/s1600/color-blink-web-design-2.jpg)
上一篇「 有助於色盲使用者的友善體驗 (1)設計構思 」，提出本站的設計方針為： 原本文章區塊為黃底黑字，另一套 CSS 將會使用白底黑字，用來增加對比。 原本文章區塊的連結無底線，另一套 CSS 將會使用底線。 本站文章常用紅字標示重點，同時教學程式碼中包含了大量的紅、...
繼續閱讀全文[網頁設計] 有助於色盲使用者的友善體驗 (1)設計構思
![[網頁設計] 有助於色盲使用者的友善體驗 (1)設計構思](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ_0kBqHynrpr0li1y5GMZ0hPyoFX0JuvrxXIHuzP1GiXEphDgVbcgzNePQrWFPWDxcZ-s26Ek4Qs9ZvQ7jEbuNaPiERILu0MnbJIGUq65P2WWIIC-7iCgzHMUfEPMeGPFxG7CIMbydkMu/s640/color-blink-web-design-1.jpg)
前陣子有讀者在「 Blogger 文章標題最佳化 」留言表示："建議WFU大，文章的字顏色對比可以強一點，或標個線?這樣對色弱色盲人土比較友善，我完全找不到紅字在哪"。這才發現過去接觸網頁設計的主題時，很少碰到這一塊，因此沒想過要研究這部分的設計。 經查詢...
繼續閱讀全文讓訪客能自行放大網頁文字，提升友善閱讀體驗
閱讀網路文章時，不免會遇到某些網頁的預設文字過小，不但看起來不舒服，也加重了眼睛的負擔。過去曾介紹過 Chrome 的外掛「 讓 Chrome 只放大縮小文字(Zoom Text Only 套件) 」，可以單獨調整文字的大小，讓我們閱讀文章時更舒服。 但並非每個訪客都會安裝這...
繼續閱讀全文利用 Google 試算表當小型資料庫 (4)使用 SQL 語法讓搜尋功能更強大
「利用 Google 試算表當小型資料庫」系列文已經寫過三篇，條列如下： (1)製作資料庫 (2)讀取、儲存資料庫 (3)簡易查詢與排序 (及新版試算表讀取流程) 上一篇提供了篩選資料的簡易查詢語法，以及對資料排序的方法，相信這對小型的資料庫處理已經足夠。 不過幾...
繼續閱讀全文讓 Facebook 留言框與粉絲團的留言能夠即時同步
前陣子有案主詢問，「看到有些 FB 粉絲專頁的留言，會自動同步到部落格文章的 FB 留言板，這個可以做嗎？」 如果不瞭解以上描述是什麼狀況的話，用畫面說明比較容易懂，例如下圖是「 粉絲團頁面的留言 」： 下圖是「 部落格如何處理結構化資料標記 」這篇文章的 FB 留...
繼續閱讀全文Line 處理待辦事項的技巧：讓已讀訊息保持未讀狀態
Line 已經越來越像傳統 Email 扮演的角色，以往收件匣未讀的信件就是我們的待辦事項，但現在越來越多待辦事項，會來自於 Line 的訊息，無論是上司、客戶、家人朋友，或是一大堆的群組。 但很可惜 Line 的訊息系統，無法像郵件軟體 (或 APP) 般好整理，除了不同...
繼續閱讀全文申請 Facebook 應用程式 APP ID 流程
FB 有些網頁 (部落格) 小工具在安裝或使用時，需要申請 APP ID 才能生效，這個流程不但有些麻煩，而且 FB 的網頁介面常常更改，不熟悉電腦操作的使用者可能會感到很頭痛。 有時我需要協助處理 FB 應用程式的相關事務，但會卡在 APP ID 的申請，因為這部分需要使用...
繼續閱讀全文部落格如何處理「結構化資料」標記 + 修復錯誤訊息
2018.3.15 補充： 「結構化資料」標記 現在已經有更好的作法，請參考這篇「 部落格使用結構化資料的最佳作法 JSON-LD﹍提供文章型態的範例程式碼 」。 關心 SEO 的站長，可能會研究「結構化資料標記」這個主題，而且使用「 結構化資料測試工具 」時，會發現不少錯誤...
繼續閱讀全文Blogger 自製真正的站內搜尋小工具﹍以日期排列
前陣子接到一個需求，希望 Blogger 搜尋結果能以日期排列。這個要求乍聽之下不太瞭解用意，一般來說，搜尋結果會依照 "關聯性" 來排列，對訪客而言，應該會希望越相關的文章，排越前面才對啊？ 不過由於案主是人氣很高的美食旅遊部落格，文章數量很多，她表示希...
繼續閱讀全文Blogger 相關文章 V4﹍行動版專用
不少讀者都詢問過「 相關文章 V2 (含縮圖功能) 」能否裝在手機版，實際上如果真的這麼做的話，一定馬上就破版，因為行動裝置有著各種不一樣的螢幕寬度，加上直立、橫躺的操作，各種專為行動版而設計的工具一定要符合 RWD 才行。 除此之外，V2 的版面也不適合做成 RWD，如果要...
繼續閱讀全文讓標題過長的多行文字自動省略﹍跨瀏覽器 CSS 技巧
之前寫過「 讓標題過長的文字自動省略﹍單行 CSS 技巧 」，用來處理單行標題過長的問題。不過最近處理多個網站時，剛好都是旅遊美食類型，文章標題比起一般部落格會長上許多。 在特殊版型下(例如區塊寬度不夠)，文章標題使用單行省略文字的方式，不容易辨識主題意涵，會導致點擊率下降。...
繼續閱讀全文Chrome 更新後, 無法正常開啟網頁的有效治本方法
似乎近年來 Chrome 更新版本後，出包的機率還滿大的。過去曾發生更新後，造成中文輸入法有問題；今年初的更新則是造成「 Chrome 會自動重新讀取分頁內容 」。 最近更新到 v54 版後，除了網頁、書籤列整個變大外，主要問題是三不五時就無法正常打開網頁，需要連續開第二次才...
繼續閱讀全文Google AMP 技術，號稱讓行動版網頁秒開，不過我的觀察心得有不同看法
前陣子讀者詢問如何在 Blogger 網站使用「 Google AMP 」技術，剛好免費資源網路社群發佈了這篇「 在 WordPress 網站使用 Google AMP 技術，提升頁面開啟速度教學 」，因此對這項技術也滿好奇的，便來瞭解一下詳情。 在手機測試使用 Google...
繼續閱讀全文專業又有質感的網頁文章註解外掛 BigFoot﹍CDN 安裝懶人包
前陣子有案主需要將文章中的註腳功能，結合資料庫進行管理，也就是讓多處重複的註解，可以直接從試算表讀取，而不必一筆筆註釋。 因為這個案子而接觸到這個文章註腳外掛「 BigFoot 」，測試之後覺得效果跟質感都很好，比之前在「 jQuery 展開收合效果安裝懶人包 」介紹的另一個...
繼續閱讀全文對抗 Blogger 垃圾留言全紀錄
雖然本站沒有限制 Blogger 帳號才能留言、沒使用字詞驗證，不過也不太擔心垃圾留言，因為我會 "手動標示" 垃圾留言，讓 Blogger 過濾系統好好學習判斷模式。因此現在若遇到一般的色情廣告留言，基本上都會被系統直接判定為垃圾留言，不太需要操心。 但...
繼續閱讀全文痞客邦搬家到 Blogger 後，SEO 問題要如何解決？
前陣子有位從痞客邦搬到 Blogger 的讀者，尋求 SEO 方面的協助。她表示「我計畫將主站從痞客邦搬到 Blogger，但遇到一個難解的問題，在 Blogger 發表的文章經常無法搜尋到，即使該文瀏覽數達數萬，可否提供專業協助？」 其實剛搬家的站長都可能遇到這個現象，在短...
繼續閱讀全文是否痞客邦、WordPress 的 SEO 比 Blogger 好，有這樣的事嗎？
許多站長在架站、或搬家前，很關心的一件事就是 SEO，想瞭解這個部落格平台的文章容不容易被搜尋到。四處打聽的結果，可能會接收到「痞客邦的 SEO 比較好」、或「WordPress 的文章比較容易搜尋到」這樣的訊息。那麼，由於 Blogger 在台灣的使用者本來就少，原本屬意在 B...
繼續閱讀全文本站 Blogger 即日起關閉訪客自刪留言功能
這是一篇公告文章，有可能在本站留言的讀者，請注意本篇內容，即日起在本站的任何留言，都將無法刪除。 (圖片出處: pixabay.com )
繼續閱讀全文過場效果華麗的 jQuery 圖片輪播外掛 Camera﹍CDN 安裝懶人包
之前曾介紹「 Camera 圖片輪播外掛安裝及使用詳解 」，他值得推薦的特色不少，除了多樣的炫麗過場特效，幾乎各種想得到的效果都能自訂，更重要的是支援 "自適應" 寬度，這在行動裝置是非常重要的。 可惜的是這個外掛不容易安裝， 需要支援目錄式的網路空間 (...
繼續閱讀全文解決 Blogger 行動版導覽列選單上「首頁」的異常現象
前陣子接到一個委託，表示 Blogger 行動版的導覽列選單，「首頁」這個項目沒有反應。 其實這個問題很久以前就有發現，只是自己的行動版沒有使用官方的「網頁」小工具，所以沒有深究這個問題。 這次有這個機會來審視一下這個異常現象，才發現要解決的話，還真是出乎意料的棘手，因此...
繼續閱讀全文電子書閱讀器 Kindle 8 購買及使用心得
使用多年的「 Kindle DX 」終於到了壽終正寢的時刻，為了眼睛著想，生活不能沒有 E-Ink 的電子書閱讀器。可惜 Amazon 已經不出 9.7" 的大尺寸，現在一律只有 6"，但規格版本之多，令人目不暇給，要如何選擇還真有點頭疼。 那麼本篇就紀錄...
繼續閱讀全文稍後閱讀，各種推送到 Kindle 的技巧整理﹍Chrome 網頁圖文 + Evernote 記事 + RSS 閱讀器
最近使用多年的 Kindle DX 9.7" 功成身退，買了兩個月前剛出的 Kindle 8，雖然螢幕小很多(只有 6")，不過最重要的是有了 Wifi 功能，不必再依靠會降低使用意願的 USB 傳輸線。 為了保護眼睛、減少看背光螢幕(包含行動裝置)的時間...
繼續閱讀全文為 UL LI 項目清單輕鬆加入圖示的各種 CSS 技巧﹍使用 Unicode + Font Awesome 字型
前陣子接到一個需求，希望在所有 UL LI 項目(列表)清單之前，插入一個小圖示。而且這個圖示，需要將來可以很方便地自行替換。 假如網頁的 UL LI 項目早已做好，那麼一個個手動加入 IMG 標籤的圖片，不但很麻煩，日後也不方便維護(更換圖示)。 其實這件事使用 CSS...
繼續閱讀全文接案經驗談：不斷要你報價，以及提出極低預算的業主
前陣子有個案主想製作 Blogger 網站，討論了滿長的時間，但最終提出來的預算十足讓我錯愕。 其實預算不足的案主所在多有，拋一兩句來詢價的也不少，但這次的案例，特殊在一開始規格拉得很高，但一直提不出預算、沒有明確需求、不斷要求報價，導致花了不少溝通時間，結果最後拋出的是 2...
繼續閱讀全文讓 Facebook 首頁動態只出現「搶先看」貼文
這個工具是依據我個人使用 FB 習慣所製作的，不一定適合每個人，如果剛好你的使用模式跟 WFU 類似的話，那麼可以嘗試看看。 FB 目前首頁動態的貼文內容，如果花點時間與耐心來設定的話，是完全可以只出現指定追蹤對象的動態。 不過有的時候，或許你會希望有更多的彈性，例如時間...
繼續閱讀全文免安裝外掛, 直接破解網頁「鎖右鍵+防複製」的方法 (使用書籤)
之前介紹的「 破解 "鎖右鍵+防複製" 的 Chrome 外掛 」， +Pulipuli Chen 布丁大留言表示，Quick Javascript Switcher 無法破解 CSS 的 "防複製" 語法。 雖然 CSS 這件事不難...
繼續閱讀全文[WP外掛] 讓網頁根據訪客語言設定, 自動轉換簡繁文字
![[WP外掛] 讓網頁根據訪客語言設定, 自動轉換簡繁文字](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNHLxkGrrMGgn_UkkVZ6Hwv0PNPMC1VtTHQes2VxdsoDHlg9T35VVFEnfkGPS7kyeZPo627KfqyuEodi5eVutCVV2_8F2wpEtv2yjqMmxxd3mhKiVWn93mUv9m011lR-zupxNbMFPGDKvL/s1600/tw-zh.jpg)
之前寫過「 讓網頁根據訪客語言設定, 自動轉換簡繁文字 (切換按鈕升級版) 」這個版本，因為有朋友的 WordPress 網站需要這個功能，所以改寫了本篇的版本。 雖然 WordPress 也可以直接安裝原版本，但有種種原因值得改為優化後的 WP 版本，以下會簡單介紹，而想直...
繼續閱讀全文Blogger「長期免費諮詢」+「付費諮詢」申請
Blogger 使用者無論在是架站或使用上，由於「 Blogger 沒有客服 」，很多問題都不得不自行摸索。 現在 WFU BLOG 將提供 Blogger 使用者，獲得長期免費諮詢的機會，沒有時間限制，意思就是說，WFU 將成為你 Blogger 網站的長期顧問，解決各種疑...
繼續閱讀全文替換 Blogger 所有預設留言頭像圖示 (CSS 技巧)
最近忽然發現，Blogger 預設的留言頭像有了變化，原本匿名留言的頭像，是無臉孔的圖案，但現在則變成完全空白。 除了這點可能會造成版面不佳，另外其他的預設圖示 (例如 Blogger 帳號的圖案) 尺寸只有 16x16 (px)，各種大小不一及完全空白的圖示，對於訪客的視覺...
繼續閱讀全文Facebook 粉絲團的訊息無法收到 Email 通知？可安裝各種平台的 Messenger 即時通
其實 Facebook 聊天室的訊息，在以前是可以設定為「以電子郵件通知」。但 WFU 不知從何時開始，就沒收到過 Email 通知了。 原以為是我曾經取消訂閱郵件通知，不過試了很久都找不到答案，最後在這個國外討論串「 How do I turn on email notif...
繼續閱讀全文Blogger 熱門文章 V2﹍卡片式縮圖 + 自適應尺寸 (RWD)
幾年前寫的「 Blogger 熱門文章＋任意尺寸縮圖 」，由於修改方式比較複雜，不熟悉程式碼的讀者，有可能不小心會把範本改壞。 本篇 V2 版，除了可算是懶人包，安裝十分簡單，版面也比較有設計感。以下先介紹改版特點，想直接安裝可跳至「二、準備動作」。 點此看範例網頁 ...
繼續閱讀全文Blogger 使用 Pagespeed Insights 網站速度效能檢測心得
經營部落格的站長們，一開始在意的是門面(版面)是否美觀；過一陣子之後，注意力可能會轉移到網站的效能、載入速度能否更快，其中最常使用的檢測工具就是 Google 的「 PageSpeed Insights 」。 這個 Blogger 中文論壇貼文詢問「 Pagespeed In...
繼續閱讀全文
