新着お知らせ EmbedSocial MCP: connect your data to any AI tool
BlogProduct Updates

PinterestのボードをWEBサイトに埋め込む方法まとめ!

「Pinterest」はインターネット上に散らばる画像を簡単に検索・保存出来るサービスとして世界中で人気を博しています。そんなPinterestでボードに集めた画像は、Pinterest上で確認するだけでなくWEBサイトに埋め込みギャラリーとして活用することが可能です。

esbasicmath
View as Markdown
PinterestのボードをWEBサイトに埋め込む方法まとめ!

esbasicmath

EmbedSocial Team

「Pinterest」はインターネット上に散らばる画像を簡単に検索・保存出来るサービスとして世界中で人気を博しています。そんなPinterestでボードに集めた画像は、Pinterest上で確認するだけでなくWEBサイトに埋め込みギャラリーとして活用することが可能です。今回はPinterestの画像の埋め込み方法をご紹介するとともに、各パターンごとのおすすめ設定方法を解説いたします。

※本記事はPinterestおよびEmbedSocialシステムの埋め込み機能の使い方を解説することを目的としており、WEBサイトでの埋め込みにおいて、画像の使用における正当性の一切を保証するものではございません。Pinterestの機能を使用して埋め込む場合には、Pinterestの利用規約・著作権に関する法律等をご参照のうえ自己判断で実施いただきますようお願いいたします。なおEmbedSocialでは、自らが作成した画像または使用許可を得た画像のみを埋め込みとして活用することを推奨しています。

Pinterestとは?

インターネットやPinterest上の画像を保存しまとめることができる画像検索サービスで、クリエイターを中心に人気を集めています。画像をもとにしたアイデアの探索といった側面から検索エンジンとしても活用することができるほか、自分の作品を画像として投稿することも可能です。

ソーシャルメディアと検索エンジンの中間的な立ち位置として、米国を中心として世界的に人気なサービスです。

PinterestのボードをWEBサイトに埋め込む方法

Pinterestで保存した画像一覧(ボード)は、Pinterest上で閲覧するだけでなく埋め込みコードを発行してWEBサイト上に表示させることもできます。Pinterestを自分のポートフォリオとして活用し、投稿した画像をWEBサイトと同期させたい場合などに便利です。

Pinterestのボードは「ウィジェットビルダー」より埋め込みコードを発行することができます。表示させるボードのURL・サイズを指定し、表示されたコードを案内に従ってページに埋め込めば表示させることができます。

1. 埋め込みを行うボードのURLを入力します

2. 表示箇所に合わせたサイズを選択します

3. 最後に、取得したコードを指定箇所に埋め込めば表示が完了します

Pinterestのウィジェットは表示が不安定?

上記箇所にはPinterest公式のウィジェットを埋め込んでいますが、ブラウザに依存することなく一部のCMSなどでは稀にウィジェットが表示されないことがあります。<a> タグでウィジェットが構成されていることが一因とも考えられますが、もし表示が不安定な事態が発生する場合には、公式ツール以外の方法を検討してみるのも良いかもしれません。

Pinterestのボードをレスポンシブに埋め込む方法

上記の手順でPinterestのボードを埋め込むことができますが、ボードをレスポンシブに表示させるためには追加のコーディングが必要となる場合があります。コーディングを行うことなくレスポンシブに表示させたい場合には、外部ツールを活用することでPC・スマートフォン両方に適した状態で表示させることが可能です。

ここでは、SNS埋め込みツール『EmbedSocial』を活用してPinterestのボードをレスポンシブに埋め込む方法をご紹介いたします。

EmbedSocialをご利用いただくには、すべての機能がお試しいただける7日間の無料トライアルからぜひお試しください。Pinterestのボードを簡単に、スタイリッシュなレイアウトでウェブサイトに表示することができます。
embeddeed-free-trial-banner-pinterest

1. Pinterestを収集先として選択する

EmbedSocialを使って埋め込みを希望するソースの中から「Pinterest」を選択します。
embedfeed-select-platform-Pinterest

2. PinterestとEmbedSocialを接続する

Pinterestへとリダイレクトされるため、アプリのアクセスを許可します。これでEmbedSocialがPintrestと接続され、ボードの収集が可能になります。
embedfeed-connect-Pinterest-app

3. 表示したいボードを選択します

接続完了後、WEBサイトに表示したい埋め込みを行うボードを選択します。
embedfeed-select-Piterest-board

4. WEBサイトに表示させるデザインを選ぶ

サイト上に表示させるデザインを、テンプレートから選びます。テンプレートはカスタマイズ可能ですし、テンプレートなしでスクラッチから作成することもできます。CSSも利用できます。
embedfeed-select-Pinterest-widget-template

5. 埋め込み表示用のコードを組み込む

最後に、自動生成されたコードをうぇびさサイトに埋め込めばレスポンシブでの表示が完了します。
enbedfeed-copy-code-embed-Pinterest

これで設定は完了です。WEBサイトに以下の様に表示することができます。
Embed-Pinteres-on-web-example

Pinterestボードのレスポンシブ埋め込み表示例

Pinterestのボードを他のSNSとミックスして埋め込む方法

SNS埋め込みツール『EmbedSocial』では、PinterestだけでなくInstagram・Youtube・TikTokなどの様々なソーシャルメディアから画像・文章・動画コンテンツを収集し、WEBサイトに埋め込み活用することができます。

Pinterest以外にも様々なSNSにコンテンツを展開している場合には、EmbedSocial(エンベッドソーシャル)を活用することで複数のSNSの埋め込みを一括に管理し・自由自在に組み合わせることができ大変便利です。

PinterestとInstagramの画像を組み合わせて表示させる場合

Pinterest・Instagramにそれぞれ投稿した画像をシステム上で組み合わせ、WEBサイト上で一つのウィジェットとして表示させることができます。複数のSNS上で異なるブランドや作品の認知拡大に活用し、WEBサイトのコンテンツとして活用したい場合におすすめです。

5つの異なるSNSから収集した画像を組み合わせて表示させる場合

EmbedSocialでは上記の2つに加えて、Twitter・Facebook・Youtube・TikTok・Vimeoの合計7種類のSNSから画像・動画・テキストなどを収集することができます。EmbedSocialへと収集したコンテンツについては、自由自在に組み合わせてホームページ上に表示させることが可能です。

Pinterestのボード画像を特殊なレイアウトで表示させる場合

EmbedSocialでは、2022年8月現在8種類のレイアウトでPinterestのボードをサイト上に表示させることができます。全てのレイアウトはレスポンシブ対応となっているため、追加のコーディングなくスマホ・PC両方に最適化した露出が可能です。

Gridレイアウト

Carouselレイアウト

Pinterestのボード画像に対し、外部リンクを付け加える場合

またEmbedSocialを活用して表示させる場合には、各画像に対して独自の外部リンクを追加することが可能です。投稿をクリックした際にPinterestへと遷移することなく商品ページやお問い合わせページなどへと誘導することができるようになります。

EmbedSocialならSNSとWEBサイトの自由自在な連携が可能に

以上のように、EmbedSocialを活用するとPinterestのボードをレスポンシブの状態で埋め込むことができるだけでなく、サイトデザインに合わせたレイアウトの変更・任意ページへの誘導などSNSを活用したHP更新の自動化・集客促進などに活用することができます。

2022年8月現在、EmbedSocialは一週間の無料トライアルやWEB会議でのご案内などを実施しております。興味をもたれた方はお気軽にお問い合わせくださいませ。

[include file=‘blog_cta’]

Nick Poggi, TrovaTrip Ryan Hazlewood Zanna Ollove, Boston College Brooks Hitzfield, Seven Sons
400,000社以上のブランドに選ばれています

ソーシャルプルーフを成果につなげる

レビュー、SNS、UGCを集約。EmbedSocialのウィジェットであらゆるウェブサイトに表示できます。

無料トライアルを開始

いつでもキャンセル可能。全機能をご利用いただけます。

関連記事

View all posts
ECサイトにInstagram投稿・リールを埋め込む方法と効果

ECサイトにInstagram投稿・リールを埋め込む方法と効果

ECサイトにInstagram投稿・リールを埋め込むと購買率が向上します。HTMLコード・API・ツールの3つの方法と、EmbedSocialで実現するEC特化の活用術を解説。Shopify・WordPress・BASE・カラーミーショップへの対応手順や、商品ページへのUGC配置でCVRを高める実践ノウハウも網羅。

ソーシャルリスニング実践:Threads × キーワード収集 × 人気ドラマ編|データの読み方から活用まで

ソーシャルリスニング実践:Threads × キーワード収集 × 人気ドラマ編|データの読み方から活用まで

Threadsキーワード収集で集めた人気ドラマ関連の投稿550件を事例に、ソーシャルリスニングのデータ確認・分析・UGC活用まで実践的な手順を解説します。EmbedSocialを使った一気通貫ワークフローも紹介。

MEO運用をn8nで自動化する方法|EmbedSocial × n8n 実践ガイド【2026年版】

MEO運用をn8nで自動化する方法|EmbedSocial × n8n 実践ガイド【2026年版】

MEO運用の「自動化できること・できないこと」を整理し、EmbedSocial × n8n × ClaudeによるMEO自動化の3レイヤー構造を紹介。実践例としてEmbedSocial × n8nのワークフローを解説。他社MEOツールとのAPI連携比較も掲載。

UGC二次利用許諾の取り方3選|キャンペーン・Instagram・TikTok別に解説【2026年版】

UGC二次利用許諾の取り方3選|キャンペーン・Instagram・TikTok別に解説【2026年版】

UGCを安全に二次利用するには、事前同意・事後申請の2つのアプローチがあります。ハッシュタグキャンペーンでの事前同意方式と、EmbedSocialを使ったInstagram・TikTokの許諾リクエスト自動化をステップで解説します。

多店舗のMEOをAIエージェントに任せる─ EmbedSocial for MEO 完全ガイド

多店舗のMEOをAIエージェントに任せる─ EmbedSocial for MEO 完全ガイド

EmbedSocial for MEOは、AIと自動化で多店舗・複数拠点のMEO運用を効率化するプラットフォームです。本記事では2026年の市場変化や全機能、導入事例、既存ツールとの違いを網羅。店舗数増加による運用負荷に悩むチェーン本部や代理店にとって、最適なツール選定と意思決定を支援する決定版ガイドです。

【検証】Claudeに「Instagramセクションを作って」と頼んで見えた、LLMの限界とUGCツールの必要性

【検証】Claudeに「Instagramセクションを作って」と頼んで見えた、LLMの限界とUGCツールの必要性

ChatGPTやClaude等でUGCセクションは作れるのか?マーケターが実際に検証。AI単体では架空のUGCが生成され景表法違反のリスクがあり、API連携や許諾管理などの運用基盤も構築できません。LLMで戦略・コピーを作りUGCツール(EmbedSocial)で運用する、正しい相互補完の最適解を解説します。