---
title: "Feedエディターが刷新！主要SNSの投稿収集とウェブ埋め込みが速く簡単に"
date: 2021-12-13
modified: 2024-12-11
canonical_id: embedfeed-new-editor-onboarding
locale_slug: embedfeed-new-editor-onboarding
author: "esbasicmath"
category:
  - blog
  - product-updates
summary: "インスタグラム、ツイッター、Youtube、TikTok等主要SNSの投稿をウェブサイトに埋め込むツールエンベッドソーシャルのエディター画面をリニューアルし、操作性が向上しました。リニューアルのポイントとエンベッドソーシャルを使ったインスタグラム投稿のウェブ埋め込みの方法をご紹介します。"
draft: false
seo:
  title: "Feedエディターが刷新！主要SNSの投稿収集とウェブ埋め込みが速く簡単に"
  description: "インスタグラム、ツイッター、Youtube、TikTok等主要SNSの投稿をウェブサイトに埋め込むツールエンベッドソーシャルのエディター画面をリニューアルし、操作性が向上しました。リニューアルのポイントとエンベッドソーシャルを使ったインスタグラム投稿のウェブ埋め込みの方法をご紹介します。"
  og_image: "https://embedsocial.jp/hp/wp-content/uploads/2021/12/ver.4-for-blog-header.jpg"
  og_image_alt: "embedfeed-new-editor-pr-visual"
  og_image_width: 1500
  og_image_height: 800
  structured_data: article
---

インスタグラム、ツイッター、フェイスブック、Youtube、TikTok等主要SNSやGoogleマップから、投稿や口コミを集めてウェブサイトへ埋め込み連携ができるツール「エンベッドソーシャル」。  
この度、フィード機能（EmbedFeed）のエディター画面をリニューアルしました！操作性が向上し、ウィジェットの作成やカスタマイズが速く、簡単にできるようになっています。今回はそのリニューアルのポイントと、エンベッドソーシャルを使ってインスタグラムの投稿をウェブサイトへ埋め込む方法をご紹介します。

## 目次

1.  [エンベッドソーシャル フィード機能（EmbedFeed）とは](#anchor1)
2.  [操作性の向上で、ウィジェット作成がより簡単・短時間で可能に](#anchor2)
3.  [アカウント設定後、ウィジェット作成までのステップはたったの3つ](#anchor3)
4.  [並べ替えなど詳細設定も簡単にできる](#anchor4)
5.  [エンベッドフィードを使ってインスタグラムをウェブサイトに埋め込んだ例](#anchor5)
6.  [エンベッドソーシャルはSNSとWEBのシームレスな連携を実現します](#anchor6)

## エンベッドソーシャル フィード機能（EmbedFeed）とは

当社製品「エンベッドソーシャル」のフィード（EmbedFeed）機能は、インスタグラム、ツイッター、フェイスブック、Youtube、TikTok、Vimeoから投稿や動画を収集し、ウェブサイトに埋め込むことができる機能です。

皆さんのSNSのアカウントから投稿を集めたり、指定のハッシュタグが付いた投稿を集めることができ、集めた投稿を一つのウィジェット（ウェブ上のパーツ、コンテンツ）にしてウェブサイトに表示します。複数のSNSで集めた投稿を一つのウィジェットにまとめて表示することも可能です。  
詳しくはこちらのWeb担記事「[SNS埋め込み活用ツールEmbedSocialを使ってSNSとWebのシームレスな連携を実現しよう](https://webtan.impress.co.jp/u/2021/08/05/41241)」でもご紹介しています。

![embedsocial-main-visual-japanese-sns-web-sync](https://embedsocial.jp/hp/wp-content/uploads/2021/12/Group-1363.png)

## 操作性の向上で、ウィジェット作成がより簡単・短時間で可能に

今回のリニューアルのポイントは、操作性の向上によるウィジェット作成の簡便化、時短化です。具体的には以下のようなリニューアルを行いました。

-   　全設定メニューを左側に配置、カテゴリーを見直しすべてのオプションを見つけやすくしました。
-   　デバイス別のプレビュー画面でデザインを確認できるようになりました。
-   　カスタムCSSの設定メニューを独立させ、よりカスタマイズ作業をしやすくしました。
-   　ウィジェット作成までのステップが見やすく分かりやすくなりました。

## アカウント設定後、ウィジェット作成までのステップはたったの3つ

エンベッドソーシャルを皆さんのSNSアカウントと接続したあとは、3ステップでウィジェットが作成できます。

### ステップ１．SNSプラットフォームを選択

プラットフォームを選択します。ご覧の通り、主要SNSから投稿や動画の取得が可能です。さらに「Custom」を選択すると、他のSNSの投稿と同じようなコンテンツをオリジナルで作ることが出来ます。ここではご利用の多いインスタグラムを選択してみましょう。  
![new-onboarding-select-source](https://embedsocial.jp/hp/wp-content/uploads/2021/12/new-onbording-select-source.png)

### ステップ２．ハッシュタグ、アカウント、メンション、どのタイプの投稿を集めるか設定

投稿のタイプを選びます。自分のアカウントの投稿、自分のアカウントへのメンションが付いている投稿、指定のハッシュタグがついた投稿、のいずれかを選択します。ここではよく利用される、指定のハッシュタグが付いた投稿を選びます。  
![embedfeed-new-editor-onboarding-2-japanese](https://embedsocial.jp/hp/wp-content/uploads/2021/12/Frame-onboarding-2.png)

### ステップ３．集めた投稿をどのようなデザインで表示するかレイアウトを選びます

エンベッドソーシャルにはたくさんのレイアウトが用意されています。サンプル画像を見ながら、皆さんのウェブサイトにマッチした、ウィジェットのデザインをお選びいただけます。ここではコラージュを選んでみます。  
![embedfeed-new-onboarding-3-japanese](https://embedsocial.jp/hp/wp-content/uploads/2021/12/Frame-onboarding-3.png)  
これでウィジェットの完成です！このままで良い場合は「コードをコピー」をクリックして、ウェブサイトのbody部分に貼り付ければ、ウェブサイトに表示されます。  
![embedfeed-new-editor-1-japanese](https://embedsocial.jp/hp/wp-content/uploads/2021/12/Frame-editor-1.png)

## 並べ替えなど詳細設定も簡単にできる

さらに詳細な設定も可能です。新しくなったエディター画面ではこれらの設定も簡単です。  
ここではたくさんある詳細設定メニューの中でも、特におススメの機能をご紹介していきます。

### おススメ設定①　リンクボタンや商品タグの設置ができる

投稿ごとにCTA（コールトゥアクション）ボタンの設置や、商品にタグを付けることが出来ます。これにより投稿に設置されたボタンをクリックすると、お好みのECサイトやランディングページへリンクを貼ることができるようになります。  
![embedfeed-new-editor-link-japanese](https://embedsocial.jp/hp/wp-content/uploads/2021/12/Frame-link-setting.png)

### おススメ設定②　見せたくない投稿はモデレーションで非表示に

集めた投稿でウェブサイトに表示したくないものは非表示にすることが出来ます。ハッシュタグで広く投稿を集めると、集めたい投稿とは違うものが含まれていることがよくありますので、ここで表示・非表示の設定を行うことが出来ます。

### おススメ設定③　優先順位付けや固定ピンで投稿を自由に並べ替え

集めた投稿は皆さんの好きな順番に並べ替えることが出来ます。エンベッドソーシャルでは、固定ピンと優先順位付けで操作が出来ます。一部の投稿を常に最初に表示したい場合は固定ピンを、投稿を任意の順番で並べる場合は投稿ごとに表示順を設定します。  
![embedfeed-new-editor-order-japanese](https://embedsocial.jp/hp/wp-content/uploads/2021/12/Frame-order.png)

### おススメ設定④　CSSの適用でウィジェットをフルカスタマイズ可能

レイアウトを少し変えたい、日付の表示をしたくない、ボタンの色を変えたい、など、ウェブサイトに合わせたカスタマイズが必要になることも多いと思いますが、CSSを使って簡単にカスタマイズが出来ます。

## エンベッドフィードを使ってインスタグラムをウェブサイトに埋め込んだ例

先ほどの詳細設定で最初の投稿にCTAを貼り、投稿の順番を並べ替えてみました。設定方法のところでご紹介したエディター画面と少し体裁が違うのがお分かりいただけると思います。

{{embedsocial-hashtag:9da037ec72d002fb4f1b90e74ec12a71477d5d41}}

## エンベッドソーシャルはSNSとWEBのシームレスな連携を実現します

Webサイト上にSNS投稿を埋め込み・連携することで、ホームページやSNSを運用する事業者は以下のようなメリットを得ることが出来ます。

-   　ウェブサイト上にコンテンツが増えるので、ウェブサイトの滞在時間を伸ばすことできる
-   　SNSアプリ上では実現できないデザインや導線を追加できる
-   　消費者の口コミ投稿をUGC（ユーザー生成コンテンツ）として活用できる
-   　複数SNSアプリを一つのページにまとめて表示することができる
-   　ウェブ上でもフォロワーを獲得する機会を増やせる
-   　SNS投稿をいつでも誰でも更新可能なウェブサイト上のパーツとして二次利用できる

それぞれの詳細については以下のブログに詳しく書きましたので、こちらをお読みください。  
こちらも読む：[Web制作でSNS投稿をサイトに埋め込み連携することのメリット6つ](/ja/blog/advantage-for-embedding-social-media-on-website/)

今回のリニューアルでより使いやすくなった「エンベッドソーシャル」、ご興味を持たれたらぜひ一度当社までご連絡ください。

\[include file='blog\_cta'\]