instagram@ドメイン名でメールアドレスを取得する

SnapWidgetのアカウント開設にはメールアドレスが必要です。
アカウント開設用のメールアドレスを取得しましょう。
【メールアドレスの取得方法はこちら】

※ドメイン移管前・サーバー切り替え前の案件の場合も、instagram@ドメイン名で登録してOKです。（メール承認等はないので問題ありません）
ただし、サーバー切り替え後に必ず取得することだけ忘れないようにお願いします。

SnapWidgetでアカウントを開設する

※アカウント開設のフローを動画にまとめています。
パソコンでは5×1、スマホでは3×2で表示を切り替えたいケースだったため、2つコードを発行しています。
なお、Instagramのログイン画面の所はセキュリティ上表示されてなかったので、収録できていません。

アカウント登録

https://snapwidget.com/にアクセスし、「GET A FREE WIDGET」をクリック

Name：院名（日本語でOK）
EmailAddress：↑で取得したinstagram@のメールアドレスを入力
パスワード：ランダムパスを設定してください。

ログイン

HERO用にアカウントを開設しています。その情報を利用してログインしてください。
▼ログイン情報
https://hero-innovation.cybozu.com/k/41/show#record=168

Widget作成

「CHOOSE A SERVICE」
→「INSTAGRAM」
→好きなレイアウトを選ぶ（写真のみのグリッド、写真と本文などいろんなレイアウトがあります）
→「CONFIGURE WIDGET」

有料アカウントにする誘導をされるので、かわしていきます。

→ポップアップのボタンは「OK」をクリック
→スクロールして下に行くとNo ready upgrade？Continue to use a free widget.という文章がありますので、青い「Continue」のリンクをクリック

無料アカウント用のページが表示されます。

Widget設定

画面左側の設定情報を入力していきます。

Username
クリックすると、instagramのログイン画面に誘導されます。動画だと表示されていないんですが、ログインをしています。
情報の共有、承認等を確認されますので、すべてOKにしてどんどん進めていってください。
※きちんとアカウント名が医院様のものになっているか確認しましょう。
過去に何回かSnapWidgetで埋め込みをしている場合、過去のアカウント情報が残っていることがあります。

設定が正しく完了すると、右側にプレビューが出てきます。
（※今回設定したアカウントは何も投稿がなかったので空っぽです…この場合は、ディレクターに連絡して、何件かテスト投稿してもらうようにお願いしてください）

Description
空欄でOKです

Thumbnail size
サムネイルの表示サイズを設定できます。
（※今回はデザインカンプが200pxだったので、200pxにしました。適宜好きなサイズにしてください）

Layout
横の枚数×段数になります。

Photo border
写真に枠線を付けるか設定できます。

Background Color
背景色が付けられます。

Photo Padding
写真と写真の間の間隔を設定できます。
（※今回はデザインカンプが20pxずつ空いていたのでそのように設定しています。）

Hover effect
ホバー時のエフェクトがつけられます。欲しい場合は好きなものを設定してください。

Share buttons
シェアボタンの有無を変えられます。

Pesponsive
レスポンシブの有無を設定できます。
（※今回はパソコンは5画像×1段、スマホは3画像×2段で表示したかったので、別々にコードを取得しています。
パソコン版はレスポンシブにする必要がないのでNoにしています。スマホはYesにしています。）

設定が終わったら、「GET WIDGET」のボタンをクリックしてください。
コピペするコードが表示されますので、そのままコピーすればOKです。

KintoneにID・パスワードを登録する

顧客パスワードに下記情報を控えておきましょう。

・SnapWidgetのアカウント開設をしたID、パスワード
・メモ欄にディレクターからもらったinstagramのID、パスワード