Combine Social Photos | Still BE

説明

Instagram 投稿を埋め込むことができるブロックを追加します。ブロックエディタに最適化された埋め込み機能を提供します。
1つのサイトで複数のアカウントを管理することができます。

ビジュアル編集は、すべてブロックエディタ上で行うことができより快適に、より柔軟に、よりスピーディーに目的のレイアウトを実現することができます。

自分の投稿、他のプロアカウントの投稿、ハッシュタグに関連する投稿を埋め込むことができます。

他のプロアカウントからの投稿を取得したり (Business Discovery)、ハッシュタグに関連した関連した投稿を取得するには、Instagram Graph API による認証が必要です。

Instagram から取得したデータは、より高速に表示するためにキャッシュされています。
キャッシュの有効期限が切れると、バックグラウンドで自動的にデータを取得し、再取得が完了した時点で更新されます。これにより、常に有効なキャッシュを利用することができます。

ブロック; Simple Grid

グリッド状に投稿を配置するブロック。
以下のカスタマイズが可能です。

  • 高度な投稿取得
    • 取得のタイプ
    • 他のユーザのユーザ名
    • ハッシュタグ
  • 動画オプション
    • 動画の表示
  • 外側の余白 (PC / タブレット / スマホ)
  • レイアウト (PC / タブレット / スマホ)
    • 列数
    • 行数
    • アスペクト比
    • 間隔
  • ハイライト
    • 表示 / 非表示
    • 位置 (左 / 上)
  • 投稿のキャプション
    • 表示 / 非表示
    • 行数
  • 投稿者
    • 表示 / 非表示
  • 投稿した時間
    • 表示 / 非表示
  • ヘッダー
    • 表示 / 非表示
    • 位置 (左 / 中央 / 右)
  • フッター
    • 表示 / 非表示
    • 位置 (左 / 中央 / 右)
  • ホバー時の演出
    • スリガラス効果
    • 回転効果
  • フォロー数
    • 表示 / 非表示
  • フォロワー数
    • 表示 / 非表示
  • いいね数 / コメント数
    • 表示 / 非表示

ブロック; Simple Slider

横スライドするブロックです。
以下のカスタマイズが可能です。

  • 高度な投稿取得
    • 取得のタイプ
    • 他のユーザのユーザ名
    • ハッシュタグ
  • 動画オプション
    • 動画の表示
  • 配置
    • 基本の幅
    • 最小の幅
    • 最小の列数
    • 列数
    • 行数
    • アスペクト比
    • 間隔 (横 / 縦)
  • 投稿のキャプション
    • 表示 / 非表示
    • 行数
    • 位置 (画像のホバー / 画像の下)
  • 投稿者
    • 表示 / 非表示
    • 位置 (画像のホバー / 画像の下)
  • 投稿した時間
    • 表示 / 非表示
    • 位置 (画像のホバー / 画像の下)
  • フッター
    • 表示 / 非表示
    • 位置 (左 / 中央 / 右)
  • ホバー時の演出
    • スリガラス効果
    • 回転効果
  • いいね数 / コメント数
    • 表示 / 非表示
    • 位置 (画像のホバー / 画像の下)
  • スクロール
    • 遷移時間
    • イージング関数 (Linear / InOutSine / InOutQuad / OutBounce)
  • ナビゲーションボタンの外部配置

Instagram アカウントの認証

Instagram のアカウントと簡単に連動できます。
複数のアカウントを管理でき、ブロックを作成する際に使用するアカウントを個別に選択できます。

3rd party resources

Font Awesome

WebSite: https://fontawesome.com/
License: https://fontawesome.com/license/free

スクリーンショット

  • Instagram アカウントの管理画面
  • トークン生成画面
  • アカウントの手動設定
  • ブロック; Simple Grid
  • ブロック; Simple Slider
  • グリッド配置のサンプル & ブロック設定
  • スライダーのサンプル & ブロック設定

ブロック

このプラグインは2個のブロックを提供します。

  • Instagram - Simple Grid Embed Instagram posts in a grid layout.
  • Instagram - Simple Slider Embed Instagram posts in a carousel slider.

インストール

  1. あなたの管理画面のプラグイン検索欄に「Combine Social Photos」と入力します。
  2. このプラグインを見付けたら、「今すぐインストール」をクリックしてインストールします。
    (他の方法) あなたの管理画面のプラグイン→新規追加から「still-be-combine-social-photos.zip」を直接アップロードして下さい。
    (他の方法) 解凍した「still-be-combine-social-photos」ディレクトリを /wp-content/plugins ディレクトリ以下にアップロードして下さい。
  3. WordPress のプラグインメニューから有効化する。

FAQ

ユーザ認証とは何ですか?

Instagram のデータは、あなたのアカウントを通じて取得されます。そのため、このプラグインがあなたに代わって Instagram にアクセスするので、あなたの許可が必要です。

許可を取り消すには、Instagram または Facebook のアプリ設定を確認してください。

“Basic Display API” と “Graph API” の違いは何ですか?

Basic Display API は、自分のアカウントの投稿のみを表示するための API で、Instagram アカウントと Facebook ページの連携は必要ありません。(認証は Instagram のアカウントで行います)
手軽に利用できる反面、プロフィール画像やいいね数、コメント数などの詳細情報を取得することはできません。

Graph API は、API を通して様々な情報を提供するもので、Instagram と連携したプロアカウント (ビジネス、メディアクリエイター) と Facebook ページが必要です。(認証は Facebook アカウントで行います)
プロアカウントとして設定する必要がありますが、プロフィール画像、いいね数、コメント数のほか、他のプロアカウントの投稿やハッシュタグに関連する投稿を取得することが可能です。

新たな投稿が埋め込んだフィードに表示されません。

投稿データがキャッシュされるまで、キャッシュの有効期限 (デフォルト:3,600秒) が経過するのを待ってください。
キャッシュの更新が遅すぎる場合は、設定画面から有効期限を短くしてください。

また、キャッシュ更新のための WP-Cron を無効にしている場合は、有効にしてください。
WP-Cron を無効にすると、Instagram CDN からメディアを表示できない場合にキャッシュの更新が実行されます。ただし、ユーザーにはキャッシュの有効期限が切れていることが表示され、ページの再読込が促されます。

クラシックエディタで使用できますか?

いいえ、サポートしていません。
このプラグインは、ブロックエディタ専用です。

ハッシュタグが変換できません。

ハッシュタグは ID に変換する必要があり、この変換作業は7日間で30回に制限されています。
多くのハッシュタグを変換している場合は、しばらく待ってから再度お試しください。

ハッシュタグ投稿が表示されません。

最新投稿の表示では、Instagram の仕様上、過去24時間以内の投稿しか取得できません。

しかし、一度設定すると、24時間以上前のデータをキャッシュするため、表示することができます。
つまり、ブロックを設定したタイミングの24時間前以降の投稿が表示されます。

ハッシュタグに関連する投稿の投稿者情報が表示されません。

これは Instagram の仕様です。
ハッシュタグに関連する投稿では、投稿者情報を表示することができません。

動画のサムネイルが自分の投稿以外表示されない。

Instagram の仕様です。

Version 0.8 以降では、動画を非表示にするか、自動再生するかを選択できるようになりました。

IE では表示されません。これは正しいですか?

はい、正しい動作です。
IE は2022年6月15日に Microsoft 社のサポートが終了しました。モダンブラウザ以外のブラウザでの動作は保証しておりません。

スライダーの外側にナビゲーションを表示する設定に変更すると、ナビゲーションの表示がされなくなります。

Simple Slider ブロックの外側に配置されるため、ブロックの親要素 (コンテンツエリアのコンテナ要素など) に “overflow: hidden;” が設定されている場合は表示されません。
テーマの設定をご確認いただくか、Simple Slider ブロックの外側にグループブロックを設定し、左右にナビゲーション用の余白を設けてください。

評価

このプラグインにはレビューがありません。

貢献者と開発者

Combine Social Photos | Still BE はオープンソースソフトウェアです。以下の人々がこのプラグインに貢献しています。

貢献者

“Combine Social Photos | Still BE” は1ロケールに翻訳されています。 翻訳者のみなさん、翻訳へのご協力ありがとうございます。

“Combine Social Photos | Still BE” をあなたの言語に翻訳しましょう。

開発に興味がありますか ?

コードを閲覧するか、SVN リポジトリをチェックするか、開発ログRSS で購読してみてください。

変更履歴

0.8.0

2022-08-03

動画の表示オプションを追加しました。サムネイルの表示、非表示、自動再生が選択できます。

ハッシュタグのついた最新投稿のキャッシュデータから、過去24時間以前も保持するように変更しました。

バグの修正。

0.7.1

2022-07-26

期限切れの画像をトリガーとしたキャッシュ更新処理のテストコードを削除。
グローバル変数に各サイトに適した URL を設定。

0.7.0

2022-07-26

ハッシュタグに関連する投稿を表示するオプションを追加しました。

期限切れの画像がある場合、キャッシュを更新する処理を追加しました。

中途半端なスクロールのときの動作をより改善しました。

0.6.1

2022-07-12

スクロールが半端な時、イージング関数が途中で中断される挙動を調整。

0.6.0

2022-07-10

以下の機能を追加。

  • Simple Grid ブロックの外側の余白
  • Simple Sliderブロックのスクロール動作 (遷移時間、イージング)

Smple Grid ブロックのエディタ用 CSS のパスを修正。

Facebook Graph API のバージョンを v14.0 にアップデート。

0.5.0

2022-05-23

投稿画面で Instagram アカウントの連携が自動的に設定されないバグを修正。
WordPress 6.0 での動作確認完了。

0.4.0

2022-05-08

“Instagram Graph API” のアプリレビューに承認。
Graph API の認証処理のバグを修正。

ダークモードに対応。

0.3.1

2022-05-05

Business Dicovery を実装。

0.3.0

2022-04-28

Instagram Graph API の処理を追加。(自分のデータ取得のみ実装済み)
各ブロックの詳細設定を追加。
キャッシュのデータ構造を変更し、キャッシュデータを格納するキー (条件のハッシュ値) が衝突しても、他のデータが失われないようにしました。
JS 用翻訳関数の読み込みタイミングを変更。
その他、細かいバグを修正。

0.2.4

2022-04-14

トークン生成ページを日本語に対応。

0.2.3

2022-04-11

バグを修正。

0.2.2

2022-04-11

Simple Grid ブロックにレスポンシブ設定を追加。

0.2.1

2022-04-11

フルサイト編集 (FSE) のためにすべての管理画面で管理用 Javascript を読み込むように変更。
Javascript 向けの翻訳関数を動作させるように wp_set_script_translations() 関数を呼び出すように初期化処理を変更。

0.2.0

2022-04-10

“Instagram Basic Display API” のアプリレビューに承認。

0.1.1

2022-04-09

WordPress プラグインディレクトリに公開

0.1.0

2022-04-07

初回リリース