社交平台功能 - Facebook Post Embed


新功能......Wordpress應該有好多呢類插件,甚至本身已經有內置。

整完留言功能後,心諗反正都係,就開始加一啲同social network有關既新功能。Post embed係其中一項,今日簡短咁講下Facebook post embed呢樣野先。

如果有睇到我尋日個篇文章,應該已經開左Facebook for Developers既帳號。如果無既話就參考返我尋日個篇野啦。


有帳號之後就可以直接跳黎FB既呢一頁文件度啦。同樣地有代碼生成器,你只要根據返自己想要既設定填返好啲野就可以啦。


Step 1既代碼熟口熟面?無錯,就係上一篇文章要你放入去既個段Javascript。如果本身放左入去既話就可以剩係要第二段就得啦。因為網誌目前版本無用到Facebook既oEmbed endpoint黎抽出成段HTML,而只係硬揼左<div class="fb-post">...</div>呢段既同時刪左<blockquote>...</blockquote>個段既關係,成個過程無牽涉到AJAX或者JSONP。data-href既位就透過interactive interface去獲得。

基本上成個interactive既部份就交晒俾Sweet Alert 2去做,然後會用regex去檢查URL pattern。

不過呢個做法既唔好處係,佢只能夠對應網誌係「https://www.facebook.com/xxxx/posts/123456」呢種咁既格式。為左可以應付之後既狀況,應該會轉做用oEmbed endpoint黎拎返成段HTML黎做。遲下應該會出篇文章黎提醒自己做法同埋要注意既地方,因為做Twitter oEmbed個陣俾JSON同JSONP搞到一個頭兩個大......(簡單黎講就係新手常見錯誤之一)

實作之後就係咁啦。

Powered by Half-moon Production.

Copyright © 2011-2020 by 泣雨家的雜物房. Version 1.5.2.

社交平台功能 - Facebook Post Embed


新功能......Wordpress應該有好多呢類插件,甚至本身已經有內置。

整完留言功能後,心諗反正都係,就開始加一啲同social network有關既新功能。Post embed係其中一項,今日簡短咁講下Facebook post embed呢樣野先。

如果有睇到我尋日個篇文章,應該已經開左Facebook for Developers既帳號。如果無既話就參考返我尋日個篇野啦。


有帳號之後就可以直接跳黎FB既呢一頁文件度啦。同樣地有代碼生成器,你只要根據返自己想要既設定填返好啲野就可以啦。


Step 1既代碼熟口熟面?無錯,就係上一篇文章要你放入去既個段Javascript。如果本身放左入去既話就可以剩係要第二段就得啦。因為網誌目前版本無用到Facebook既oEmbed endpoint黎抽出成段HTML,而只係硬揼左<div class="fb-post">...</div>呢段既同時刪左<blockquote>...</blockquote>個段既關係,成個過程無牽涉到AJAX或者JSONP。data-href既位就透過interactive interface去獲得。

基本上成個interactive既部份就交晒俾Sweet Alert 2去做,然後會用regex去檢查URL pattern。

不過呢個做法既唔好處係,佢只能夠對應網誌係「https://www.facebook.com/xxxx/posts/123456」呢種咁既格式。為左可以應付之後既狀況,應該會轉做用oEmbed endpoint黎拎返成段HTML黎做。遲下應該會出篇文章黎提醒自己做法同埋要注意既地方,因為做Twitter oEmbed個陣俾JSON同JSONP搞到一個頭兩個大......(簡單黎講就係新手常見錯誤之一)

實作之後就係咁啦。