HubSpot CMSで作成したサイトにInstagramの投稿を掲載したい

HubSpotで作成したサイトにInstagramの投稿を掲載する時の方法を解説します

Instagramの表示方式で、反映できるものとできないものがあります。

Instagramのタイムラインを表示させたい場合

Instagramタイムライン

投稿をずらっと表示させたい場合、HubSpotでは現在(2024年2月時点)は実装が難しいのが現状です。

WordPressなどの他のCMSでは、表示のためのAPIがありますが、HubSpot CMSのAPIではございません。

専用に表示できるように開発などをする必要があります。

Instagramの特定の投稿を表示させたい場合

こちらの場合は簡単に実装が可能です。

パソコンで該当の投稿を表示させます。投稿の右上のメニュー「・・・」をクリックし、「埋め込み」を選択します。

埋め込みコードのメニュー位置

コードをコピーします

インスタグラムの埋め込みコードをコピー

ウェブページやランディングページに表示させたい場合

ページの編集画面で、「Custom HTML」というモジュールを、Webページの表示させたい箇所にドラッグ&ドロップします。

HubSpotCMSのカスタムモジュール

Custom HTMLの入力欄が画面左に表示されるので、「テキスト」内に先ほどコピーしたInstagramの埋め込みコードをコピーします。

HubSpotCMSのカスタムHTMLにコード記述

あとは記事を公開させれば反映されます。

HubSpotブログに表示させたい場合

ブログの入力画面の上部の「挿入」メニューから、「埋め込み」を選択します。

ブログ記事の編集-ここにブログ記事のタイトルを入力-

すると、埋め込みコードの記入欄が表示されるので、先ほどコピーした埋め込みコードを記述します。

ブログ記事の編集-ここにブログ記事のタイトルを入力- (1)

「挿入」をおし、記事を公開するとインスタグラムの投稿がブログ記事内に表示されます。