如何將發燒網的插件置入 Facebook 的即時文章 Instant Article

什麼是即時文章 Instant Article?

Facebook 在 2015 年底推出了即時文章的功能,讓粉絲頁可以把部落格的文章同步放在 Facebook,也就是說 Facebook 讓你的網頁內容直接儲存在臉書的伺服器上。聽起來好像是 Facebook 偷用你的內容,處心積慮的想把網友留在封閉的社交環境(確實也是),但這個舉動其實是為了讓手機的體驗更好,因為很多網頁內容的速度很慢,超過幾秒網友就不想看,間接影響了網友在臉書閒逛的經驗值。其二,Facebook 也希望藉此在這些頁面上埋入 FB 的聯播網廣告,與版主分潤。否則 Facebook 把人潮導入網頁後,廣告都被網頁上的 Google Adsense 賺走了!目前使用最多的是媒體內容網站。

好,介紹完畢。那麼如果你已經在使用 Instant Article,發燒網今天要教大家的是,如何在 Instant Article 嵌入發燒網的活動插件,讓網友可以直接在臉書內參加你的活動(投票/心理測驗…等)。

使用方式很簡單,就是在 Instant Article 內貼上我們進階版的的插件代碼。

進入後台的活動外掛插件設定:選取貼碼時,請使用進階版。

plugin

 

進入粉絲頁 Instant Article 的編輯區,選擇你要編輯的文章,然後把 1+2 的代碼貼入你要安插的位置,上下用 <figure> 以及 <iframe> 標籤(藍色的部分)包圍(如下),這樣就大功告成了!

<figure class="op-interactive">
<iframe class="no-margin">

<script id="fe-plugin">
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
var host = (‘https:’ == document.location.protocol ? ‘https://s3.amazonaws.com/widget.fever38.com’ : ‘http://widget.fever38.com’);
js.src = host + “/fever-sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘fever-jssdk’));
</script>
<div class="fe-root fe-114833″ data-domain="www.feversocial.com" data-ptype="join" data-promoid="114833″ data-sponsorid="6851″ data-scheme="0″ data-width="500″ data-uri="m.feversocial.com" data-hasFrameBorder="1″ ></div>

</iframe>
</figure>

 

如果你想看看插件在 Instant Article 的效果,請把下面這篇文章分享到你自己的塗鴉牆,再從手機 APP 進入自己的頁面點入!

 

了解更多插件應用

 

討論版

Powered by Facebook Comments