今回ホームページにインスタグラムの記事を埋め込みたい場合の方法をご紹介していきます。
参考のインスタグラムのユーザーに渡辺直美さんのインスタを参考にしていきます。
まず最初に渡辺直美さんのホーム画面にいきます。
記事の中で、ホームページに反映させたい記事をクリックします。
そこの右下に「・・・」のメニューバーがありますのでクリックしてください。
そうすると「埋め込み」というメニューがありますので、そこクリックして、
ホームページに反映させたい箇所に貼りましょう。
これだけでできてしまいます。
あとは横幅の調整などは、div要素でwidthを設定しましょう。
画像のアルバムを簡単に埋め込む方法で、instawidgetを使います。
instawidget
自分のインスタグラムのアカウントトップページにいってください。
https://www.instagram.com/watanabenaomi703/?hl=ja
上のURLは渡辺直美さんのインスタのトップページのURLです。
そこのURLをinstagram.com/から次の/までの間をコピーします。
渡辺直美さんの場合はwatanabenaomi703です。
初期状態でも問題ないですが、いろいろカスタムができるのでとても便利
このままでは、スマフォに対応していませんので、スマフォから見ても大丈夫なように、設定します。
コピーしたコードの最後にwidthが書かれている部分がありますので、そこに100%とすることでレスポンシブ対応は問題ないでしょう。
画像と記事を表示させたい場合はSnapWidgetでできますので参考にしてください。
これを使用する場合はユーザー名とパスワードが必要なため今回は割愛させていただきます。
https://snapwidget.com/
新規登録が必要ですが、簡単にできちゃいます。
