2016年3月31日

發現錯誤訊息不用擔心, Blogger 開始支援分享到 FB 顯示縮圖(以及相關的 Meta + OG 標記)

blogger-fb-share-debug-error-og-url-發現錯誤訊息不用擔心, Blogger 開始支援分享到 FB 顯示縮圖最近處理一個 case 需要幫忙設定 Facebook 的 Meta 標籤,也就是讓 Blogger 文章分享到 FB 時,可以正常出現縮圖、摘要...等等資訊,結果很意外的,使用「官方 Debug 工具」時,頻頻出現以下錯誤訊息:

"Errors That Must Be Fixed More Than One OG URL Specified: Object at URL 'http://xxx.com/' of type 'article' is invalid because it specifies multiple 'og:url' values:..."

這樣的訊息是最近才開始出現,查了一陣子才知道是 Blogger 預設的範本內容有了變更,開始正式支援 FB 分享的縮圖顯示。

不過這件事其實有好有壞,究竟是怎麼回事,請看本文的說明。

2016年3月28日

Blogger 按下標籤出現文章列表 V2﹍可切換摘要及標題模式

blogger-label-post-list-toc-2-Blogger 按下標籤出現文章列表 V2﹍可切換摘要及標題模式很多從其他部落格平台搬到 Blogger 的站長,都會詢問「按下標籤後顯示文章標題列表」這樣的功能。的確,站長們對自己的文章內容瞭如指掌,想要找站內的資料時,真的只需要看到文章標題就好。

但是站在訪客的立場,對於我們的文章內容、甚至網站風格都不太熟悉的時候,按下標籤若貿然只顯示文章標題,可能不具備足夠的吸引力來點擊,最好還是維持有封面圖、摘要等內容比較恰當。

那麼,有沒有這樣的工具,可以同時滿足站長及訪客的需求,能夠自由選擇按下標籤時,要出現文章標題列表、或顯示原有的封面圖及摘要呢?WFU 本篇研發的工具,將可完美實現這件事,同時兼顧兩種需求、而且安裝簡單方便,請見以下的介紹。


2016年3月24日

網頁圖片該怎麼處理, 顯示效果會比較清楚?

how-to-handle-website-image-size-lightbox-網頁圖片該怎麼處理, 效果會比較清楚?最近有讀者遇到一個狀況,網站使用的圖片都是 640px 寬,但在 Blogger 的文章區塊扣掉 padding 等等的數值後,可顯示寬度為 590px 左右。當圖片從 640px 縮小到 590px 的情況下,圖中某些文字因為變小而顯得比較不清楚(或是說效果比較差)。因此,希望我幫他調整文章區塊的版面寬度,讓圖片可以顯示 640px 這樣的寬度。

當然,調整版面寬度是一種解決方法,不過這麼做,是否一定可以讓網頁的圖片變得清楚呢?這件事需要考慮的因素,其實比想像中要來得多。

同時,部落格的圖片,該如何兼顧尺寸、美觀清楚、以及載入速度,算是還滿重要的考量點,因此寫一篇專文來討論此事。

(圖片出處: pexels.com)
2016年3月22日

FB「讚」按鈕與 Google「+1」按鈕最簡單安全的安裝方式﹍可解決對齊問題

在「Facebook 讚按鈕﹍四種安裝方式剖析」有讀者於留言 #2 表示 "不曉得刪除了哪個小工具的語法,所有文章都不會再顯示臉書專頁的讚按鈕了"。

如果對程式碼不熟悉的話,FB 官方提供的「HTML5 語法」,的確有可能安裝失敗、或發生彼此打架的情形。最安全、絕不會影響他處 FB 外掛的安裝方式,就是採取本文推薦的 IFRAME 安裝語法。

本篇除了介紹安裝 FB 讚按鈕的語法,也一併說明 Google「+1」按鈕最簡便的語法。同時,使用本篇的語法,還能有效排除「讚按鈕」與「+1按鈕」放在同一行時,無法上下對齊的問題,算是一石二鳥的解決方案。

(圖片出處: pixabay.com)
2016年3月20日

防止 Chrome 自動重新讀取分頁內容

最近發現使用 Chrome 時,對於已經開啟的網頁,只要切換到別的分頁一段時間後,再切回原來的分頁時,整個頁面就像自動按了「重新整理」一樣,會強制自動重新載入整個網站。

這樣的情形其實還滿困擾的,因為不會只有一個分頁需要重新載入,而當多個分頁都要花時間等待再度載入時,真的是滿浪費時間的。

其實之前並不會發生這樣的情形,想必是新版更新後造成的現象。那麼為何 Chrome 要這麼設計,又有什麼辦法可以關閉這個功能呢?請見以下的說明。

2016年3月14日

CC0 免費圖庫搜尋引擎﹍2016 更新版

cc0-high-quality-image-search-engine-2016-CC0 免費圖庫搜尋引擎﹍2016 更新版製作「CC0 免費圖庫搜尋引擎」已經將近一年,在這不算短的時間內,各大免費 CC0 圖庫產生了不少變化,收錄的網站也是有調整的必要。

同時使用上,發現一些不太正常的現象,例如搜尋結果有時會出現 "非 CC0 圖庫網站" 的圖片。雖然常使用 CC0 圖庫的愛好者,可以一眼看出某些搜尋結果是不正確的,但畢竟不是每個使用者都很熟悉這一點,因此「CC0 免費圖庫搜尋引擎」必須減少這樣的搜尋結果產生,這是改版要解決的首件要事。

此外 2016 更新版還有一些友善設計,而更多新版的變化,請見本文的說明。

2016年3月11日

H1 標籤使用圖片代替文字時, 該如何處理?

h1-image-replace-text-H1 標籤使用圖片代替文字時, 該如何處理?前陣子處理一個案子時,被詢問到「網站標題使用圖片的話,會不會比較不容易被搜尋到?」顯然這位讀者是具備 SEO 概念的,一般來說,網站標題會放在最重要的 H1 標籤,而且使用文字敘述。

由於 SEO 非我的專長,還是看看專家怎麼說比較保險。然而在尋找資料的過程中,發現用 "H1 標籤 圖片 代替 文字" 這幾個關鍵字去搜尋,前幾篇竟然全是錯誤的作法。

當然 SEO 的操作方法每一年都有可能變動,但是若排名在前的文章都不是正確資訊時,我相信沒幾個人知道這件事該怎麼做。為了讓讀者能接收到正確的訊息,還是寫一篇標準作法比較好。

(圖片出處: pickupimage.com)
2016年3月9日

Picasa 關閉之後, Blogger 要如何管理圖片?

google-drive-blogger-photo-management-PICASA 關閉之後, Blogger 要如何管理圖片?自從前陣子 Google 宣布「關閉 PICASA」之後,不少讀者擔心 Blogger 使用的 PICASA 圖片會不會受影響?另外一點就是,習慣用 PICASA 管理、編修圖片的使用者,將來要如何管理圖片?

Google 的意圖很明顯,收購 PICASA 取得關鍵技術後,PICASA 就不再重要,且逐漸將功能移轉到「Google 相簿」(Google Photo)。一方面圖床的功能會和平移轉到 Google Photo,一方面也將 PICASA 管理圖片的介面關閉。

不過讀者可以放心的是,PICASA 圖床原本的圖片仍然會保留、圖片外連也不會失效,Blogger 依然可以從後台上傳圖片(仍舊存放在 PICASA 圖床),因此這件事對 Blogger 完全沒任何影響

會受到影響的是,使用 PICASA 圖片管理介面的讀者,例如下載桌面端軟體、或使用 PICASA 網頁管理的功能。本篇會討論這些介面關閉之後,將來要如何管理圖片。

2016.8.2 補充:官方現在建立了一個「相簿封存檔案」的頁面,從這裡可以看到所有 Google 服務上傳的照片,例如 PICASA、Google+、Blogger...等等,因此 Blogger 網誌的圖片不用擔心看不到,從這個網頁都能找到。

不過這個頁面只有 "封存" 的功能,談不上 "管理",算是非常難用,真要找圖片的話滑鼠會捲到受不了。如果有管理的需求,建議還是按照本文的方式進行。

2016年3月7日

緊貼螢幕邊緣的浮動 FB 粉絲團外掛

這個不會隨著螢幕捲動而變換位置的 Facebook 粉絲團外掛,會黏貼在螢幕邊緣、只顯示垂直的 "Facbook" 字樣,當滑鼠經過時才將 FB 粉絲團滑動顯示出來,而滑鼠離開後則立即收合。這樣的外掛效果並不算少見,許多知名部落格都有設置。

最近處理一個案子需要安裝這個效果時,Google 到不少教學文章,程式碼多半都相同,主要來源為國外網站。由於這些 code 不是我自己寫的,語法看不太習慣,參數也很難調整、修改,於是乾脆重新寫一個。

本篇的版本把所有的參數都開放出來,整個外觀只要看得到的,不論是粉絲團設定、圖片、外觀、尺寸、位置都可修改,算是最方便自訂的一個版本了


2016年3月4日

Blogger 延伸閱讀 [小工具][文字版]

為了讓訪客看完文章不馬上離開,我們通常會在文末設計一個區塊,稱為 "延伸閱讀" 或 "您可能對這些文章有興趣" 等等,接著手動挑選、安插一些相關文章的連結。

手動複製這些連結自然是很麻煩,也是可安裝一些小工具來替我們做這件事。其實 WFU 已經寫過不少這一類的程式,而版本之多還可能讓讀者嚇一跳。

那麼為何還要再額外寫本篇的版本?究竟與其他版本的差異為何?請讀者先看以下各版本的功能比較,再決定安裝哪一個比較適合你的網站。



(圖片出處: lifeofpix.com)
2016年3月2日

部落格網站是否加強 SEO 就能帶來流量?

這是一個詢問度很高的主題,不少讀者請 WFU 檢視網站時會詢問 "SEO 有哪裡要加強"、或是 "SEO 要如何改善才能帶來流量"?

我想 "SEO" 對很多部落格站長而言,也許存在一些迷思,有些是把 SEO 當作一種解決方案,有的可能把 SEO 與流量視為因果關係。

不過 SEO 的定義實在太廣,把 SEO 與流量劃上等號這件事不是說 "對" 與 "不對",這樣的簡單二分法就能含混過去。那麼就藉這機會談談我的想法,也算是統一回答讀者的一篇心得。

(圖片出處: pixabay.com)