Livefyre との統合

Livefyre の業界最高レベルのキュレーション機能を AEM 6.4 と統合する方法を説明します。これにより、ソーシャルネットワークからの有用なユーザー生成コンテンツ（UGC）をサイトに数分で公開できます。

はじめに

AEM 用 Livefyre パッケージのインストール

AEM 6.4 には、Livefyre 機能パッケージ 1.2.6 がプリインストールされています。このパッケージには Livefyre の AEM Sites との統合のみが含まれているので、更新パッケージをインストールする前に、まずアンインストールする必要があります。最新のパッケージでは、Sites、Assets および Commerce を含む、Livefyre と AEM の完全な統合を利用できます。

1. AEMホームページで、 ツール アイコンをクリックします。

2. に移動します。 導入/パッケージ.

3. パッケージマネージャーで、プリインストールされた Livefyre 機能パッケージが表示されるまでスクロールし、パッケージのタイトルをクリックします。 cq-social-livefyre-pkg-1.2.6.zip をクリックしてオプションを展開します。

4. クリック その他 > アンインストール.

   

5. Livefyre パッケージのダウンロード元 ソフトウェア配布.

6. パッケージマネージャーで、ダウンロードしたパッケージをインストールします。 AEMでのソフトウェア配布およびパッケージの使用手順については、 パッケージの操作方法.

   

   Livefyre-AEM パッケージがインストールされます。統合機能を使い始める前に、Livefyre を使用するように AEM を設定する必要があります。

   機能パックの詳細およびリリースノートについては、 機能パック.

Livefyre を使用するようにAEMを設定します。設定フォルダーの作成

1. AEMホームページで、 ツール アイコンをクリックし、 一般/設定ブラウザー.

   • 詳しくは、🔗設定ブラウザーのドキュメントを参照してください。

2. 「作成」をクリックして、設定を作成ダイアログを開きます。

3. 設定に名前を付けて、 クラウド設定 チェックボックス。

   これにより、の下にフォルダーが作成されます。 ツール/デプロイメント/ Livefyre 設定 指定された名前で置き換えます。

   

Livefyre を使用するための AEM の設定：Livefyre 設定 の作成

組織の Livefyre ライセンス資格情報を使用するように AEM を設定して、Livefyre と AEM の間で通信できるようにします。

1. AEMホームページで、 ツール アイコンをクリックし、 デプロイメント/Livefyre 設定.

2. 新しい Livefyre 設定を作成する設定フォルダーを選択して、「作成」をクリックします。

   

   メモ

   Livefyre 設定を追加する前に、フォルダーのプロパティでクラウド設定を有効にしておく必要があります。 設定フォルダーが作成され、設定ブラウザーで管理されます。

   設定の名前は作成できません。フォルダーのパスによって参照されます。設定はフォルダーごとに 1 つのみです。

   詳しくは、🔗設定ブラウザーのドキュメントを参照してください。

3. 新しく作成した Livefyre 設定カードを選択して、「プロパティ」をクリックします。

   

4. 組織の Livefyre 資格情報を入力し、「 OK.

   

   この情報にアクセスするには、Livefyre Studio を開き、に移動します。 設定/統合設定/資格情報.

   Livefyre を使用するように AEM インスタンスが設定され、統合機能を使用できます。

シングルサインオン統合のカスタマイズ

AEM 用 Livefyre パッケージには、AEM Communities プロファイルと Livefyre の SSO サービス間の標準の統合が含まれています。

ユーザーは、AEM サイトにログインすることで、Livefyre ソーシャルコンポーネントにもログインします。ログアウトしたユーザーが、写真のアップロードなど、認証が必要な Livefyre コンポーネント機能を使用しようとすると、Livefyre コンポーネントがユーザー認証を開始します。

デフォルトの認証統合は、すべてのサイトに対して完璧なわけではありません。サイトテンプレートの認証フローに完全に合致させるために、ニーズに合わせてデフォルトの Livefyre Authentication Delegate を上書きすることができます。次の手順を実行します。

1. CRXDE Liteを使用して、コピー /libs/social/integrations/livefyre/components/authorizablecomponent/authclientlib から /apps/social/integrations/livefyre/components/authorizablecomponent/authclientlib.

2. 編集して保存 /apps/social/integrations/livefyre/components/authorizablecomponent/authclientlib/auth.js を使用して、必要に応じて Livefyre Auth Delegate を実装します。

   Auth Delegate のカスタマイズの詳細については、 ID 統合.

   AEM Clientlibs について詳しくは、 クライアント側ライブラリの使用.

AEM Sites での Livefyre の使用

Livefyre コンポーネントのページへの追加

Livefyre コンポーネントを Sites 内のページに追加する前に、Livefyre クラウド設定を親ページから継承するか、設定をページに直接追加することで、ページ用の Livefyre を有効にする必要があります。サイトのクラウドサービスの追加方法について、実装を参照します。

ページ用に Livefyre が有効になったら、Livefyre コンポーネントを許可するようにコンテナを設定する必要があります。詳しくは、 デザインモードでのコンポーネントの設定 様々なコンポーネントを有効にする方法を参照してください。

1. 次の コンポーネント デザインモードのサイドパネルで、「 Livefyre メニューから選択して、リストを使用可能な Livefyre コンポーネントに制限します。

   

2. Livefyre コンポーネントを選択して、ページ上の位置にドラッグします。

3. 新しい Livefyre アプリを作成するか、既存のアプリを埋め込むかを選択します。

   既存のアプリを埋め込む場合、アプリを選択するように促されます。新しいアプリを作成する場合、アプリは、コンテンツが表示される前に設定しておく必要があります。アプリは、Livefyre サイト、およびページ用に Livefyre クラウド設定を有効にした際に選択したネットワークに作成されます。

   コンポーネントの挿入について詳しくは、 ページのコンテンツの編集.

AEM ページ用の Livefyre コンポーネントの編集

Livefyre コンポーネントは、Livefyre Studio でのみ設定および編集できます。AEM で次の手順を実行します。

1. 設定する Livefyre コンポーネントをクリックします。
2. 次をクリック： 設定 アイコン（レンチ）を使用して、設定ダイアログを開きます。
3. クリック このコンポーネントを編集するには、Livefyre Studio に移動します。.
4. Livefyre Studio でアプリを編集します。

AEM Assets での Livefyre の使用

権限のリクエストと AEM Assets への UGC の読み込み

UGC Importer を使用して、Twitter および Instagram ユーザー生成コンテンツ（UGC）を Livefyre Studio から AEM Assets に読み込むことができます。読み込むコンテンツを選択したら、読み込みを完了する前に、コンテンツに対する権限をリクエストする必要があります。

UGC を AEM Assets に読み込むには：

1. AEMホームページで、に移動します。 アセット/ファイル.

2. クリック 作成​を選択し、「 UGC を読み込みます。

   

3. 次の方法でコンテンツを見つけます。

   • Livefyre からコンテンツを見つけるには、「UGC ライブラリ」タブをクリックします。フィルターおよび検索を使用して UGC ライブラリからコンテンツを見つけます。
   • Twitter および Instagram からコンテンツを見つけるには、「Twitter」または「Instagram」タブをクリックします。検索またはフィルターを使用してコンテンツを見つけます。

4. 読み込むアセットを選択します。選択したアセットは自動的にカウントされ、「 選択済み タブをクリックします。

5. オプション:次をクリック： 選択済み 「 」タブに移動し、読み込む UGC コンテンツを確認します。

6. 「次へ」をクリックします。

   

7. 権限リクエストについて、各アセットに対して次のいずれかのオプションを選択します。

   Instagram の場合：

   • 手動で権限をリクエスト をクリックして、コピー&ペーストできるメッセージを取得し、Instagramを使用してコンテンツ所有者に手動で送信します。
   • コンテンツ権限の手動属性設定 をクリックして、個々のアセットの権限を上書きします。
   メモ

   ビジネス以外のユーザーアカウントからのコンテンツの集計に影響する更新により、お客様に代わってコメントを投稿したり、作成者からの返信を自動的に確認したりできなくなりました。 詳しくはここをクリック.

   

   Twitter の場合

   • 作成者へメッセージ：コンテンツ所有者に、アセットに対する権限をリクエストするメッセージを送信します。
   • コンテンツ権限の手動属性設定 をクリックして、個々のアセットの権限を上書きします。

8. 「読み込み」をクリックします。

   Twitter の権限リクエストを送信する場合、コンテンツ所有者には、自身のアカウント上に権限リクエストメッセージが表示されます。

   

   メモ

   Twitter には、同じアカウントから来る同じリクエストに対して制限があります。2 つ以上のアセットを読み込む場合、メッセージを個別に変更して、フラグが設定されるのを避けます。

9. クリック 完了 をクリックして、権限リクエストワークフローを完了します。

   Livefyre Studio で、アセットに対する保留中の権限リクエストのステータスを確認できます。コンテンツが権限リクエストを保留している場合、権限が付与されるまで、AEM Assets でアセットが表示されません。権限リクエストが許可されると、AEM Assets にアセットが自動的に表示されます。

   Instagram の場合は、コンテンツ所有者の応答を追跡し、コンテンツへの権限が与えられている場合は手動で権限を付与する必要があります。

AEM Commerce での Livefyre の使用

AEM Commerce を使用した製品カタログの Livefyre への読み込み

AEM Commerce ユーザーは、既存の製品カタログを Livefyre にシームレスに統合して、Livefyre のビジュアライゼーションアプリのユーザーエンゲージメントを推進できます。

製品カタログを読み込んだら、製品がリアルタイムに Livefyre インスタンスに表示されます。AEM Commerce 製品カタログの項目を編集または削除する場合、変更は Livefrye で自動的に更新されます。

1. AEMインスタンスにAEM用の最新の Livefyre パッケージがインストールされていることを確認します。

2. AEMホームページで、に移動します。 AEM Commerce.

3. 新しいコレクションを作成するか、既存のコレクションを使用します。

4. コレクションの上にマウスポインターを置いて、「 コレクションのプロパティ （鉛筆アイコン）を使用します。

5. チェック Livefyre に同期.

6. 入力 Livefyre ページのプレフィックス このコレクションをAEMの特定のページにリンクする場合。

   ページのプレフィックスは、環境のルートパスを定義します（そこから製品ページの検索が開始されます）。Livefyre で、関連付けられた対応する製品を含む最初のページが選択されます。別の製品のための別のページを取得するには、複数のコレクションが必要です。

Livefyre アプリの AEM サポート一覧