• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

FOXWP

WordPressの始め方と使い方をわかりやすく解説!

  • HOME
  • WordPressブログの始め方
  • お問い合わせ
FOXWP / プラグイン / 10Web Social Photo Feedの使い方

10Web Social Photo Feedの使い方

最終更新日:2021年5月25日

目次 非表示
1 10Web Social Photo FeedってどんなWordPressプラグイン?
1.1 10Web Social Photo Feedの特徴・機能
2 10Web Social Photo Feedを使うべき方
3 10Web Social Photo Feedの使い方
3.1 アカウント接続
3.2 フィードの追加
3.3 フィードの表示
4 10Web Social Photo Feedの設定方法
4.1 フィードの設定
4.2 Lightboxの設定

10Web Social Photo FeedってどんなWordPressプラグイン?

10WebSocial10WebSocial

Author(s): 10Web

Current Version: 1.4.34

Last Updated: 2022年5月13日

wd-instagram-feed.1.4.34.zip

92%Ratings 40,000+Installs WP 4.6+Requires

10Web Social Photo Feedは、インスタグラムのフィード表示ができるWordPressプラグインです。

10Web Social Photo Feedの特徴・機能

  • 接続したインスタグラムアカウントのフィード表示
  • 特定パラメータによるフィードの並び替え
  • Lightbox表示機能

10Web Social Photo Feedを使うべき方

  • インスタグラムのフィード表示を行いたい方

10Web Social Photo Feedは簡単にインスタグラムのフィード表示が行えます。

ただし、複数ユーザーのフィード表示には対応していません。

複数のユーザーをまとめて1つのフィードとして表示したい方は、Smash Balloon Social Photo Feedの利用をおすすめします。

10Web Social Photo Feedの使い方

ここでは、10Web Social Photo Feedの基本的な使い方を解説します。

10Web Social Photo Feedの基本的な使い方は、以下の通りです。

  • アカウント接続
  • フィードの追加
  • フィードの表示

10Web Social Photo Feedをインストールし有効化すると、WordPress管理画面のメニューに「Instagram Feed」の項目が追加されます。

10Web Social Photo Feedの設定画面を開くには、WordPress管理画面のメニューにある「Instagram Feed」をクリックします。

アカウント接続

WordPress管理画面のメニューより、「Instagram Feed」をクリックし設定画面を開きます。

Settingsの見出しの下にある「Connect an Instagram Account」ボタンをクリックします。

すると次のポップアップが表示されます。無料版ではPersonalしか選択ができません。有料版で利用できるBusinessを選択すると、ハッシュタグによるフィルターをかけることができます。

今回は、Personalを選択して解説を行います。Connectボタンをクリックし、次へと進みます。

続いて、インスタグラムのフィードを表示したいアカウントへログインを行います。

ログインが完了したら、情報リクエストの許可画面が表示されます。「許可する」ボタンをクリックします。

WordPress管理画面に戻り、接続したアカウントが表示されます。

以上でアカウント接続は完了です。

アカウント接続が完了すると、WordPress管理画面のメニューに表示されるInstagram Feedのサブメニューの項目が追加されます。

フィードの追加

フィードを表示するために、フィードを追加します。

WordPress管理画面のメニューより、「Instagram Feed ≫ Feeds」をクリックします。

するとFeedの新規追加画面が表示されます。

Feed Titleを入力し、Media欄にあるUserから接続を許可したアカウントを選択します。

Feed TitleとUserの選択ができたら、フィードを表示させるための最低限の設定は完了です。Updateボタンをクリックします。

以上でフィードの追加は完了です。続いて、フィードの表示を行います。

フィードの表示

追加したフィードの表示方法を解説します。

Feedの表示方法は、各フィードの編集画面で見ることができる「How To Publish Feed」に記載があります。

フィードを表示するには、次の4つの方法があります。

  • ショートコード
  • エディター
  • PHPコード
  • ウィジェット

ショートコード

WordPress管理画面のメニューより、「Instagram Feed ≫ Feeds」をクリックします。

追加済みのフィード一覧が表示されます。

表示したいフィード欄にあるShortcodeをコピペして、エディターで貼り付けを行なってください。

エディター

エディターの機能を使って、簡単にフィードの追加が行えます。

ブロックエディターに「Instagram WD」の項目が追加されています。

フィードを表示したい箇所で、「Instagram WD」をクリックします。

Select Instagram WDとその下にプルダウンが表示されます。

プルダウンをクリックし、表示したいフィードのタイトルを選択します。これでフィードの表示が行えます。

PHPコード

PHPコードは、テンプレートファイルに直接記載する際に利用します。

WordPress管理画面のメニューより、「Instagram Feed ≫ Feeds」をクリックします。

追加済みのフィード一覧が表示されます。

表示したいフィード欄にあるPHP functionをコピペして、テンプレートファイルの表示したい箇所に貼り付けを行なってください。

ウィジェット

ウィジェットにフィードを表示することができます。

WordPress管理画面の外観メニューより、ウィジェットをクリックします。

Instagram WD Widgetの項目がありますので、クリックします。

追加できるウィジェットエリアが表示されますので、表示したいウィジェットエリアを選択して「ウィジェットを追加」ボタンをクリックします。

選択したウィジェットエリアにInstagram WD Widgetが追加されます。これでウィジェットにフィードの表示が行えます。

設定項目がありますので、表示したいフィードや数をお好みに合わせて変更してください。

10Web Social Photo Feedの設定方法

フィードの設定

フィードでは、Userを選択する以外に並び順を決める項目の設定やクリックされた場合の挙動を決めることができます。

Sort Media Byの項目では、日付、いいね、コメントの数の順番またはランダム表示から選択ができます。

Sorting Orderでは、昇順または降順を選択できます。

クリックされた際の挙動では、ライトボックスを開く、インスタグラムへ移動する、移動するURLを決める、何もしないから選ぶことができます。

フィードの設定では、さらに細かい設定が行えます。それがLayout設定とAdvanced設定です。

Layout設定

Layout設定では、表示する列の数や表示する投稿の数を主に決めることができます。

Advanced設定

dvanced設定では、ヘッダーやユーザーデータの表示・非表示などを選択することができます。

Lightboxの設定

Lightboxの設定は、Lightbox Settingsのタブを開くことで行えます。

Lightboxで開いた際の幅や高さの設定などを行えます。

類似プラグイン
  • Smash Balloon Social Photo Feed
  • WPZOOM Social Feed Widget
  • Social Slider Widget
  • Feed Them Social
  • Easy Social Feed
関連記事
  • WordPressでおすすめのインスタグラムプラグイン7選(無料・有料)

Primary Sidebar

世界で一番利用されているWordPressテーマ

Divi WordPress Theme
レビューを見る

あなたの悩みは?

WordPress
セキュリティ
WordPress
トラブル
アクセスアップアフィリエイト
おすすめASP

最新ニュース

  • 【カラフルボックス】夏のキャンペーン実施中【2021年8月31日まで】

最近の投稿

  • WordPressでおすすめのバックアッププラグイン5選
  • WordPressのPHP設定を変更する方法(php.ini)
  • WordPressでおすすめの画像圧縮プラグイン5選
  • WordPressの投稿編集画面でその投稿を表示する方法
  • WordPressの管理画面に再利用ブロックの管理を追加する方法

カテゴリー

  • WordPress
  • お役立ち情報
  • アフィリエイト
  • ドメインレジストラ
  • レンタルサーバー
    • ColorfulBox
    • Conoha WING
    • mixhost
    • さくらのレンタルサーバー
    • エックスサーバー
    • エックスフリー
    • ロリポップ!
  • 便利ツール
WordPress学習方法
トップページへ

プライバシーポリシー|お問い合わせ
Copyright © 2023 FOXWP All rights reserved.