「更新したツイッターやインスタグラムが反映される
サイトにしたい」
「SNSの投稿を 簡単に埋め込みできる
サービスは？」
更新感のあるブログを目指して
ブログにインスタグラムやツイッターの投稿を
埋め込んでいるサイトが 多いようです。
チャッピーも両方載せています。
こちらでは
＜こちらの記事は3分で読むことができます＞
SNSの投稿をカンタンに表示できるツール
【スナップ ウィジェット】の使い方を
ご紹介いたします。
パソコンの不得意な方でも ご安心ください。
たくさんの画像を使ってわかりやすく
説明していきます。
Snap Widget（スナップウィジェット） とは？
記事にインスタグラムを埋め込むと
こんな感じに。
Snap Widget とは
サイトやブログにフェイスブック、インスタグラム、ツイッターなど
の投稿写真を表示するためのツールです。
基本的な機能は無料。
あとはほったらかしておいても 大丈夫。
連動しているので
勝手に更新されていきます。
※ただし埋め込み投稿をクリックしても
直接インスタには飛びません。
クリックしたページは こんな感じでした。
インスタグラムのAPIは2020年３月で廃止
これから徐々に インスタグラムのAPIを利用した
外部ツールの使用ができなくなるようです。
【スナップウィジェット】はまだ使えるようですが
他のツールで作ったインスタグラムは
表示されなくなっているそうです。
使用に関しては 以上のことを加味した上で
お使いください。
APIとは？
Application Programming Interface）とは、広義では
ソフトウェアコンポーネント同士が互いに情報をやりとりするのに使用する
インタフェースの仕様である。
Wikipediaより
よくわかりませんね。
でも 今回ここは重要ではないので
説明ははぶきます(^_^;)
さっそくスナップウィジェット 使ってみましょう！
スナップウィジェットのページへ。
無料ウィジェットを入手
無料アカウントを作ります。
「名前」（ハンドルネームでOKです）
「メールアドレス」
「パスワード」（任意）
を 入力。
今回は インスタグラムを選びました。
テンプレートが出てきますが
この中で インスタグラムを選びます。
さらに 人気のあるグリッドを選びました。
ユーザーネームのところをクリック。
①レイアウト
インスタらしい スクエア配列
3×3に。
※見やすいようにサムネイルのサイズを300にしましたが
大きさを変えたい場合 数字を変更してください。
②背景色を変える場合は此方にHTMLカラーコードを。
③写真／パディング
写真と写真のスキマ幅。
④ホバー効果
・なし
・フェードイン
・フェードアウト
・ズームイン
・高評価とコメント
・キャプション
この中から選べます。
ポピュラーな「高評価とコメント」を選択。
⑤共有ボタン
ツイッターやフェイスブック。
なので「はい」を選択。
⑥レスポンシンブ「はい」を選択。
「ウィジェットを入手」
「クリップボードにコピー」
いよいよブログに埋め込み
「デザイン」
「スパナマーク」→「サイドバー」
※インスタグラムを配置する場所は 好きなところでOKです。
ちなみサイドバーは グランマ☆ライフの場合
こちらになります。
①モジュールを追加
②HTML
③Instagram（わかりやすい名前でOKです）
④先ほど「スナップウィジェット」で「クリップボードにコピー」
したものをこちらに「ペースト」
⑤「適用」
インスタグラムを貼りたい位置を 決めて
カーソルで移動させます。
チャッピーは「自己紹介」「日本ブログ村」の下に。
（後日「カテゴリー」の下へ移動）
最後に「変更を保存する」
このような感じで インスタグラムが埋め込まれました。
いかがでしたでしょうか。
きちんと表示されましたか？
インスタグラムのAPI廃止に伴って
いずれは消えてしまう運命のようで 残念です。
しばらく表示されるとよいのですが・・・
今回 スナップウィジェットのことを
いろいろ調べているうちに 気づいたのですが（API）
パソコンの苦手な方や 超初心者さんに向けて
練習のつもりで ブログを仕上げてみました。
画像が粗かったり 読みづらかったり
改善点も多くて
申し訳ありません。
これからも 少しずつですが
皆さんに読みやすいブログに育てていきますので
これからも
どうぞよろしくお願いいたします。
最後までお付き合いくださり
ありがとうございました。
