【1分解説!】インスタグラムの投稿をブログに埋め込む方法!

1分解説 インスタグラム埋め込み #ブログ運営

はじめに

どうも!しゅんです!

今日はインスタグラムの投稿をブログに埋め込む方法をご紹介したいと思います!

とても簡単なので、ぜひやってみてくださいね!

 

Instagramを埋め込む方法

 

まずブラウザでInstagramを開きます!

スマートフォンのアプリからでは出来ないので、必ずブラウザ版を開くようにしてください◎

 

 

埋め込みたい投稿を開き、右上の「」マークをクリック。

 

 

埋め込み」をクリックし、

 

 

キャプションの有無を選択し、「埋め込みコードをコピー」をクリック!

(*ちなみにキャプションとは投稿に載っている文章のことです。)

 

あとはコピーしたコードをHTMLとして貼りたい部分にペーストすれば完了!

 

 

この投稿をInstagramで見る

 

Shunsuke Hashimoto / しゅん(@shu__n_p)がシェアした投稿

 

左に寄っていますね。しかも少しでかい。できれば少し小さくして真ん中にしたい…

ということでその方法もご紹介します!

 

投稿を真ん中にしたい!

 

まずは

.instagram-center {
margin:0 auto;
}
こちらをコピーし、外観→カスタマイズ→追加CSSにペースト!

 

記事ページに戻り

<div class=”instagram-center”>埋め込み用のコードをここにコピペ</div>
このコードを使ってもう一度埋め込むと…

 

 

この投稿をInstagramで見る

 

Shunsuke Hashimoto / しゅん(@shu__n_p)がシェアした投稿

 

いい感じのサイズで真ん中になってくれています!

これ以外にも2列(スマートフォンでは1列)にしたりなど、いろんな方法があるので是非いろいろ試してみてくださいね!

 

この投稿をInstagramで見る

 

Shunsuke Hashimoto / しゅん(@shu__n_p)がシェアした投稿

 

この投稿をInstagramで見る

 

Shunsuke Hashimoto / しゅん(@shu__n_p)がシェアした投稿

 

さいごに

インスタグラムの埋め込み。簡単だし見た目も綺麗なのでこれからどんどん使っていこうと思います!

しゅん
質問等あればお気軽に!Instagram/TwitterのDMでも対応しています!