WFU

2016年5月28日 星期六

[Blog] 如何「在部落格用大圖,讓 Facebook 抓小圖」?

作者:許君豪醫師 (職業醫學科)



部落格圖片的寬高比通常不受限。但分享網頁連結到 Facebook 時,圖片會自動被裁切為寬高比 1.9:1。若部落格原圖非 1.9:1,「自動裁切」可能帶來麻煩。如何讓部落格、Facebook 圖片「寬高比」各唱各的調呢?


以下用部落格圖片寬高比 1.5:1 為例,說明部落格、Facebook 不同調,所帶來的困擾,和其解決辦法。


大圖 (1.5:1):部落格顯大器,Facebook 被裁去


以下面左邊這張圖為例,分享到 Facebook 後,圖片下面被裁切。原本完整的電車硬生生被切半。這很可能不是我們想要的擷圖。

更麻煩的是,Facebook 對不同圖片的裁切區塊不同,也就是,除了從下面切,也可能從上面切,或者上下各切一些。這在分享網頁到 Facebook 時,頗為麻煩。



小圖 (1.9:1):部落格不很好,Facebook 剛剛好


「與其讓 Facebook 切,不如我自己切!」

既然 Facebook 固定擷 1.9:1 的圖,那我們主動把圖片裁成這個比例,放到部落格,不就好了?是的,這可以讓 Facebook 不去動你的圖片,如下圖:




但如果原始圖片很漂亮,我們希望在部落格原汁原味呈現、不裁切,而且不想在分享時被 Facebook 亂裁切,該怎麼做呢?

這個問題可以化約成:有沒有辦法「在部落格用 1.5:1 的圖」,而且「讓 Facebook 抓 1.9:1 的圖」呢?

有的。很簡單,三步驟解決


1. 發布文章,用小圖 (1.9:1)




2. 分享到 Facebook






3. 回部落格改為大圖 (1.5:1)






大功告成!

這招能成功,原因在於首次分享網頁連結至 Facebook 時,它會從網頁中抓圖、裁成 1.9:1。之後在 Facebook 分享同一個網頁時,即使你已經改過圖片,它仍會用原本那張擷圖,除非你通知它修改。

是的。就算你把原來的美食圖改成雲海圖,若不指示 Facebook 修改,之後分享時它仍會顯示美食圖。修改的方式之一,是到這裡 debug

利用 Facebook 不自動重新抓圖的特性,我們解決了這個問題。


延伸閱讀


[PPT] 如何快速查詢「隱藏投影片」總頁數?


關於作者