內嵌應用程式

使用Livefyre.js內嵌程式碼結構,將Livefyre應用程式新增至您的網頁。

本檔案適用於技術觀眾。 有關應用程式的非技術資訊

本節說明您在網站上內嵌Livefyre應用程式時,在頁面範本中必須包含的程式碼結構。

  1. 使用Livefyre預留位置建立。html檔案。

    在您選擇的文字編輯器中建立新的。html檔案。 建立預留位置Livefyre <div>元素,應用程式將嵌入其中。

    <html> 
       <head> </head> 
       <body> 
          <div id='livefyre'> </div> 
       </body> 
    </html>
    
  2. 包含Livefyre.js程式庫。

    然後,加入Livefyre JS程式庫。 在<head>元素的<script>元素中放置以下引用。 然後,在瀏覽器中開啟您的頁面,並使用瀏覽器的網頁偵測器確認Livefyre已載入。

    <head> 
       <script src='@{livefyre_js}'></script> 
    </head> 
    
  3. 建構Livefyre應用程式。

    使用Livefyre.require傳入您計畫使用的Livefyre套件,以建構核心和SDK應用程式。

    1. 建立核心應用程式。

      若要建立核心應用程式(注釋、即時部落格或聊天),請使用下列結構:

      Livefyre.require(['fyre.conv#@{fyre_conv_version_prod}'], function(Conv) { 
           new Conv(networkConfig, [convConfig], function(widget) {});  
      });  
      
    2. 建立SDK應用程式。

      若要建立SDK應用程式,例如「媒體塗鴉牆」或「動態消息」,請使用下列結構:

             Livefyre.require(['app#{version_number}'], 
         function (App, SDK) { 
            var app = new App({ 
            el: document.getElementById('app'), 
         }); 
         var collection = new SDK.Collection({ 
            network: "`labs.fyre.co`", 
            environment: "livefyre.com", 
            siteId: "315833", 
            articleId: 'livefyre-tweets' 
         }); 
         collection.pipe(feed); 
      }); 
      

      請參閱有關特定應用程式的詳細資訊。 建議您釘選至最新的主要套件版本(可透過Livefyre.require找到),以避免意外的整合中斷。

下一步:將驗證新增至您的網站,讓您的使用者張貼意見。

本頁內容

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now