訂製Facebook分享連結：Facebook 分享連結產生器 / How to Share to Facebook with Custom Parameters: Facebook Share Link Builder
作為一位網站管理者，總是希望使用者可以更容易地將網站訊息分享到Facebook上。除了使用AddThis或SumoMe之外，我們也可以直接使用網址來開啟分享到Facebook的功能，還能夠客製化引言、圖片、網址標題、網址介紹、網站標題等資訊，讓使用者分享訊息更為搶眼喔！
我參考「Share to Facebook with custom parameters」這篇的做法，製作了一個「Facebook 分享連結產生器」供大家使用，讓大家也能夠提升社群媒體的整合力吧！
Facebook分享連結產生器 / Facebook Share Link Builder
小結 / In Closing
關於使用Facebook分享資料的做法，大致上有兩種：sharer.php跟Facebook應用程式。
在這篇「Facebook 分享連結產生器」使用的是連線到 https://www.facebook.com/sharer/sharer.php?u=[URL] 的傳統做法。比較簡單，但是這個網址可接受的參數似乎一直在改。有些早期的做法是使用p[url]這種的參數，例如「Facebook share button and custom text」這篇，但這種做法已經無法正常運作。這種傳統做法現在是使用u、title等參數，其中「Share to Facebook with custom parameters」是我看過最完整的使用介紹。可惜該網頁的介面不太容易操作，所以我乾脆另外自己寫一個給大家用。
另一種做法是使用Facebook的SDK，以FB.ui()來開啟分享的視窗。這做法在Facebook開發者官方的網頁「Dialogs」上有詳細的敘述。我本來也想要用這種方式來作，但開始設定的時候發現困難重重。要使用SDK必須先申請Facebook開發者、建立Facebook應用程式。而Facebook的應用程式會限制可分享的網域，必須是Facebook認證的網域才能拿來分享。因為我有需要分享不固定網域的需求，這種在應用程式上的分享方式就不太適合我，因此作罷。
這個「Facebook 分享連結產生器」所應用的第一個作品是「滑塊拼圖遊戲 Image Puzzle」，大家有興趣的話也可以來玩玩看滑塊拼圖，並且幫我分享到Facebook吧。
有可能寫成通用的 bookmarklet 嗎? (不用填表格, 可以像 https://chrome.google.com/webstore/detail/share-to-facebook/kbgplcfihfeioiaddclapccnefggiddn?utm_source=chrome-app-launcher-info-dialog 的使用方式一樣)
回覆刪除可以啊，換成locatio.href就可以了
刪除在書籤列加入這段JavaScript的按鈕吧：
````js
javascript:window.open("https://www.facebook.com/sharer/sharer.php?u=" + encodeURI(location.href), "_blank", "toolbar=0,status=0")
````
布丁大,請問如何在blogger上實現類似這篇文章的線上工具功能?
回覆刪除你好，
回覆刪除請使用iframe
https://www.w3schools.com/tags/tag_iframe.asp
了解,謝謝布丁大迅速回覆
刪除打擾了，想請教一下測試您的產生器，發現分享時顯示的縮圖並非您範例內指定的「http://lh3.googleusercontent.com/-6qwdHih3tFk/Vv6N0dTaICI/AAAAAAACuRA/AsKTNm9c_Bg/s0/post-avatar.png」，而是其他預覽圖，這是什麼原因呢？
回覆刪除另一方面，若將產生器稍微修改僅將網址換為「https://www.google.com」，分享時則不會有任何預覽圖片，請問如果要產生預覽圖片、自訂標題、自訂描述，這個要件是什麼？謝謝。
您好，
刪除Facebook修改了API，這個方法現在沒辦法指定縮圖。
Facebook會抓取網站裡面的內容，找出最適合的圖片作為網址的縮圖。
如果網頁裡面有指定Facebook偏好的<meta>標籤，那Facebook會優先抓取標籤內的參數，例如：
<meta property="og:image" content="http://static01.nyt.com/images/2015/02/19/arts/international/19iht-btnumbers19A/19iht-btnumbers19A-facebookJumbo-v2.jpg" />
詳細資訊請參考Facebook的說明：
https://developers.facebook.com/docs/sharing/webmasters/
如果在Facebook分享網址時，它沒有抓到任何預覽圖片
表示該網頁預設是不提供圖片給Facebook的爬蟲抓取
很多使用AJAX動態產生、變化的網頁都有這種設計