SNS

Instagramのブログパーツをサイトに設置する方法。

投稿日:2016-11-04 更新日:

 

今回は、ブログやホームページのサイドバー(もしくはフッター)にInstaglamを表示する方法について。

投稿写真1枚をサイトに埋め込むコードは、Instagram公式でもできるのですが、

 

「アルバムのように表示させたい!」

 

という時は、他のサービスを使わなくてはなりません。「ブログパーツ」というものですが、コードも生成してくれるので、まるっとコピーするだけの簡単作業。

私はホームページに設置するために作ってみました。

 

Instagramの写真だけ表示させたい

有名どころだとコチラのサイト。

WEBSTA Widgets for Instagram

 

メールアドレスの登録が必要ですが、無料でInstagramと連携することで作れます。

WEBSTA Widgetの使い方

メニューの「ウィジェットを作る」をクリックし、設定していきます。

「ウィジェット作成」ボタンを押すと、コードが表示されるので、Wordpressの場合、「ウィジェット」にテキストを挿入し、「内容」にコードを貼り付けるだけ。タイトルはお好みでどうぞ。

 

instagram_widget1

 

最後に「保存」ボタンを押します。

完成品はコチラ。

 

instagram_widget2

 

写真にカーソルを当てると、シェアボタンがを表示することも可能です。

 

写真だけでなく、フォローボタンも、ハッシュタグでも載せたい。

 

WEBSTA Widgetだと、写真しか表示できないので、フォローボタンは別途設置になります。

これをまとめて表示させたい。そういう時には、InstaWidgetを使います。

Get Free Instagram Widget for Website | InstaWidget

 

ユーザー登録も、ログインも不要なので、気軽に使えます。

 

InstaWidgetの使い方

instagram_widget3

 

枠の色や、写真効果も設定できたり、プレビューを見ながら作ります。

完成したら、コードをコピーして、WEBSTAと同じくウィジェットに貼り付けるだけです。

 

表示のタイプ

ホームページのサイドバーが狭いので(汗)

レイアウトを「1×3」にしてみました。

 

instagram_widget4

 

フィルムのネガっぽくてかわいい。

 

サイトのレイアウトを3カラムにしている方は、この使い方もあり。

ブログの記事、固定ページにコピーしたコードをまるっと貼りつけてみました。

 

ウィジット幅を「700」、レイアウトは「5×2」

 

instagram_widget6

 

記事にそのまま貼りつけてもいいですし、記事下などに常備固定で設置したい時に使えそう。

ブログはシンプルに載せるぐらいで良いとおもうのですが、写真や絵を投稿している方は、

 

サイトでポートレートとして表示もできるのでオススメです。

 

 

関連記事

  • この記事を書いた人
  • 最新記事

るしる(Lucir)

元バンドマンが10年のブランクを経て音楽活動をネットで再開し、DTMで楽曲制作したり、音楽ブログ運営してます。

-SNS
-

© 2021 るしるし