FeaturesPricingBlogResourcesAboutContact
Sign inGet Started Free

Pinterestウィジェットで、ピンタレストのボードをあなたのホームページに

Pinterestを連携し、ボードを1つ選ぶか、すべてのピンを表示するかを決め、40種類のレイアウトと16種類のテーマがそろったデザインスタジオで見た目を整えたら、コードを1つホームページに貼り付けるだけです。ピンが切り取られることはなく、ウォール系のレイアウトでは、ボードと同じようにどのピンも本来の高さのまま並びます。それ以降は、Pinterestにピンを保存することが、そのままホームページの更新になります。新しいピンは、無料プランなら24時間ごとに、最上位のプランなら最短5分ごとに自動で反映されます。

7日間の無料トライアル(すべてのレイアウトと3件のソース)、クレジットカード不要。無料プランはずっと無料です。

@thistlebrook季節の花を、育てて、束ねて
暗い色の木の上に置いた、麻ひもで束ねたピンクと白のシャクヤクのブーケ保存302件
明るい窓辺で、細長いガラスの瓶に挿した深紅のダリア1輪
テラコッタ色のアーチ型の板に飾った、黄土色のバラと赤茶色のアスチルベのドライアレンジ
白く塗られた窓辺で、透明なガラスの花瓶に挿した2本のピンクのチューリップ
使い込んだ木のテーブルの上で、淡い色の筒形の器に挿した小さなデイジーと白い野の花保存148件
逆光で花びらが透けて見える、ピンクとコーラルのジニアと黄色いルドベキア
灰色のスレートの上に並べた、ユーカリ、赤い実の枝、暗い色のドライの穂
緑の葉を背景に、正面から写した満開のピンクのバラ1輪
透明なガラスの花瓶に挿した、オレンジのルドベキア、青い矢車菊、白い小さなデイジーの花束
くすんだローズ色の背景の前に立つ、淡いピンクのラナンキュラス1輪と、隣の茎のつぼみ保存
保存271件

色を塗った板の前にラナンキュラス。飾り立てず、合う背景を選んだだけです。

@thistlebrook

Thistlebrook Flowersは、このモックアップのために作った架空のデモアカウントで、住所も架空です。ボードの並び方とピンの形はウィジェットのものです。ピンに付いている数字は、モックアップ用の例です。

40
スタジオのレイアウト
16
標準のテーマ
7
無料プランのレイアウト
10
1つのフィードに混ぜられるプラットフォーム

登録なしで、いまここでPinterestウィジェットをデザイン

結局のところ知りたいのは「うちのホームページに合うかどうか」だと思います。それを確かめるために、メールアドレスを先に渡す必要はありません。レイアウトを切り替え、テーマを試し、キャプション・日付・アイコン・バッジの表示をオンとオフにして、ボードがクリックのたびに変わる様子を見てください。ご自分のアカウントの接続は登録のあと、Pinterest公式のログイン画面で行います。

レイアウト
テーマ
表示
表示中 Masonry Minimal
使い込んだ木のテーブルの上で、淡い色の筒形の器に挿した小さなデイジーと白い野の花

道ばたのデイジーを、棚の奥から出してきた器に。4分で完成です。

くすんだローズ色の背景の前に立つ、淡いピンクのラナンキュラス1輪と、隣の茎のつぼみ

色を塗った板の前にラナンキュラス。飾り立てず、合う背景を選んだだけです。

暗い色の木の上に置いた、麻ひもで束ねたピンクと白のシャクヤクのブーケ

麻ひもだけで束ねて、ワイヤーは使いません。摘んだばかりに見えるように。

灰色のスレートの上に並べた、ユーカリ、赤い実の枝、暗い色のドライの穂

今年うまくドライになったものを全部並べました。このあとリースになります。

明るい窓辺で、細長いガラスの瓶に挿した深紅のダリア1輪

ダリア1輪と、窓1つ。10月のお店は、これで全部です。

色あせた灰色の板の上に広げた、ピンク、紫、オレンジのチューリップ

水に入れる前に、まず箱の中身を仕分けます。

Masonry: ピンそれぞれの縦横比を保ったまま並べる段組みなので、ボードと同じ形になり、切り取られる部分がありません。

自分のボードで作ってみる

ここに表示しているのはプレビューで、本物のレンダラーではありません。テーマの色は製品が使っているテーマ定義から直接読み込み、レイアウト名も実際の名前ですが、形はこのページのために描いたものです。正方形に切り取って描いている形もありますが、それはこの図の描き方で、ウィジェットがピンを切り取ることはありません。MasonryとPinterest Feedのレイアウトではどのピンも本来の高さのまま並び、横にスクロールする帯のレイアウトでは、ピンが読み込まれても列の高さが変わらないよう、縦長のピンは正方形の枠に収まる大きさに縮め、左右に余白を付けて表示します。実際のスタジオには40種類のレイアウトと16種類のテーマ、すべてのプランで使えるテーマビルダーがあり、編集中は本物のウィジェットが描画されます。Thistlebrook Flowersは私たちが作った架空のデモアカウントで、住所も架空、写真はCC0の差し替え画像です。カードの数字はモックアップ用の例です。

ピンタレストへのリンクではなく、ボードそのものをホームページに埋め込む

多くのサイトは、Pinterestをフッターの小さな赤いアイコンで済ませています。それは、すでにあなたのページにいる訪問者に、ページを離れてくださいとお願いすることです。下のウォールはもう1つの選択肢で、ボードそのものを、あなたのドメインのページに、あなたのサイトの色で、どのピンも保存されたときの高さのまま並べます。

わたしたちのボードから
@thistlebrook季節の花を、育てて、束ねて
暗い色の木の上に置いた、麻ひもで束ねたピンクと白のシャクヤクのブーケ保存302件
白い角皿の上に、巻いた竹のマットと濃いピンクのカーネーション。奥の花瓶には淡いピンクのバラと紫の小花保存243件
古い缶に挿したヒマワリと、木のテーブルに置いた古い本、封筒、はさみ
くすんだローズ色の背景の前に立つ、淡いピンクのラナンキュラス1輪と、隣の茎のつぼみ
テラコッタ色のアーチ型の板に飾った、黄土色のバラと赤茶色のアスチルベのドライアレンジ
麻布の上の小さなガラス瓶に挿した緑の花1本。奥には開いた本とグラス
白く塗られた窓辺で、透明なガラスの花瓶に挿した2本のピンクのチューリップ
緑の葉を背景に、正面から写した満開のピンクのバラ1輪
やわらかなライラック色の背景の前で、横から光を受けた深いバーガンディのラナンキュラス保存198件
灰色のスレートの上に並べた、ユーカリ、赤い実の枝、暗い色のドライの穂
木の板の上に1本ずつ並べた、白と濃いピンクのダリアと淡い色のキンギョソウ
木の棚に置いた青、ピンク、薄紫のアジサイ。奥には淡い色の花瓶
Thistlebrook Flowersはデモ用のアカウントで、写真はCC0の差し替え画像です。4列の並びと、切り取らないピンの高さはウィジェットのものです。ピンに付いている数字は例で、製品の指標ではありません。
プロフィールへのリンクと、ウィジェットを並べると
  • 訪問者がたどり着く先:Pinterestの中、あなたのサイトの外 → あなたのページの中、買い物の途中のまま
  • 最初に目に入るもの:Pinterestが表示すると決めたもの → あなたが選んだボード
  • デザインの設定:なし。あなたのページではないため → 40種類のレイアウトと16種類のテーマ
  • 表示されるピン:すべて → あなたが残したものだけ
  • ほかのプラットフォーム:リンクがもう1つ増える → 10のプラットフォームを1つのウォールに

フッターのアイコンは無料で、本当にフォローしたい訪問者にとっては、まさにぴったりの道具です。残しておいてください。上の一覧は、何かを買うつもりだったのに、そこでページを離れてしまった訪問者の話です。

ピンタレストのボードを1つだけ、またはすべてのピンをホームページに表示

Pinterestのソースは2種類のどちらかで、どちらにするかはプランの機能ではなく、設定のときにあなたが選ぶものです。X以外のプラットフォームはすべて無料プランで使えるので、どちらも無料プランに含まれます。

すべてのピン

アカウントのピンを新しい順に表示します。接続した時点の新しいピンから始まり、そのあと保存したピンが加わっていきます。プロフィール全体がブランドに合っていて、ウォールが自然に埋まっていくのがいいなら、これを選びます。

初期設定
ボードを1つ

ボードを1つ選ぶと、ウィジェットはそのボードのピンだけを表示し続けます。ウェディングのページには「ウェディングのテーブル」、別のページには「冬の枝もの」のボード、という使い分けができます。

設定のときに選択
これから保存するピン

新しいピンは、プランのスケジュールに合わせて自動で届きます。ウォールから外したいピンは、モデレーションの画面でいつでも除外できます。埋め込みコードを貼り直す必要はありません。

無料プランは24時間ごと
ウィジェットに取り込むものを選ぶ
すべてのピンピン159件
ウェディングのテーブルピン34件
春の切り花ピン58件
ドライと押し花ピン21件
アトリエの日々ピン46件

Pinterestのソースは、ボード1つか、アカウントのすべてのピンのどちらかです。ボードを選ぶと、ウィジェットはそのボードについていき、あとから保存したピンも自動で届きます。

ウェディングのテーブル
暗い色の木の上に置いた、麻ひもで束ねたピンクと白のシャクヤクのブーケ保存302件
白い角皿の上に、巻いた竹のマットと濃いピンクのカーネーション。奥の花瓶には淡いピンクのバラと紫の小花
暗い背景の木箱に並んだガラス瓶の花と、手前に広げたピンクのバラと白い花
このボードの一覧は、接続したあとにソースの選択画面に出るものです。ボードの名前と件数は、モックアップのために作ったものです。Pinterestから受け取るのはピンとボードを読み取るためのアクセスだけなので、ウィジェットがアカウントに投稿したり、何かを編集・削除したりすることはできません。
Pinterestが渡してくれるもの、渡してくれないもの
  • 読み取り専用のアクセス。Pinterestに求める権限は、アカウント、ピン、ボードの読み取りだけです。ウィジェットには投稿、編集、削除、リピンの権限がないので、万一何かがおかしくなっても、アカウントを変えることはできません。
  • 反応の数は取り込んでいません。Pinterestのピンについては、保存数もコメント数も取り込んでいません。反応の欄があるカードでは数字が0と表示されるため、Pinterestのフィードでは、デザインスタジオの「Show Likes & Comments」をオフにしてください。
  • トークンの期限は30日。これはPinterestのルールで、私たちが決めたものではありません。ウィジェットは期限が切れる前に裏側で更新し、Pinterestが更新を受け付けなかった場合は再接続をお願いします。

ピンタレストの見た目ではなく、あなたのホームページの一部に

良いフィードウィジェットの目標は、最初からそのページの一部だったように見えることです。40種類のレイアウト、16種類のテーマ、すべてのプランで無料のテーマビルダー、そして日付・アイコン・バッジ・キャプションの表示切り替えがあります。下は1つのボードをそのうち3つのレイアウトで描いたもので、ほかのいくつかはページ上部で実際にクリックして試せます。

Grid
暗い色の木の上に置いた、麻ひもで束ねたピンクと白のシャクヤクのブーケ
灰色のスレートの上に並べた、ユーカリ、赤い実の枝、暗い色のドライの穂
明るい窓辺で、細長いガラスの瓶に挿した深紅のダリア1輪
色あせた灰色の板の上に広げた、ピンク、紫、オレンジのチューリップ
Masonry
くすんだローズ色の背景の前に立つ、淡いピンクのラナンキュラス1輪と、隣の茎のつぼみ
木の棚に置いた青、ピンク、薄紫のアジサイ。奥には淡い色の花瓶
使い込んだ木のテーブルの上で、淡い色の筒形の器に挿した小さなデイジーと白い野の花
白く塗られた窓辺で、透明なガラスの花瓶に挿した2本のピンクのチューリップ
Pinterest Feed
Inspiration BoardSave All
白い角皿の上に、巻いた竹のマットと濃いピンクのカーネーション。奥の花瓶には淡いピンクのバラと紫の小花
木の板の上に1本ずつ並べた、白と濃いピンクのダリアと淡い色のキンギョソウ
逆光で花びらが透けて見える、ピンクとコーラルのジニアと黄色いルドベキア
木の棚に置いた青、ピンク、薄紫のアジサイ。奥には淡い色の花瓶
同じボードを40種類のレイアウトのうち3つで描いています。GridとMasonryは無料プランに含まれ、3つ目のPinterest Feedは製品独自のボード風レイアウトで、有料のレイアウトです。Gridの正方形の枠はこの図の描き方で、実際のウィジェットはピンを切り取りません。

最初に選ぶならMasonryで、無料です。どのピンも本来の高さのまま並ぶので、ボードがもともと持っている形そのものです。有料の33種類の中にはPinterest Feedというボード風のレイアウトもあり、4列の段組みの上に見出しが付きます。無料の7種類のレイアウトはGrid、List、Carousel、Masonry、Mosaic、Slider、Staggerで、ホームページに公開するには十分です。

MasonryとPinterest Feedは、画面の幅が狭くなると列の数を自動で減らします。スマホで見ても、パソコンと同じ列数のまま詰め込まれることはなく、埋め込みコードも同じままです。

Pinterestウィジェットのホームページへの設置は4ステップ

実際に出てくる順番に4つのステップを、それぞれが何を生み出すかと一緒に示します。開発者が必要なステップは1つもありません。途中で私たちがパスワードを聞くことはなく、ログインはPinterest公式の画面で行います。

  • Pinterestのアカウント個人用でもビジネス用でもかまいません。どちらのアカウントでも、PinterestのAPIでピンとボードを読み取れます。
  • トークンの更新は自動Pinterestのアクセストークンは30日ごとに期限が切れるため、裏側で自動的に更新します。Pinterestが更新を受け付けなかった場合は、再接続をお願いします。
  • 開発者は不要コードを一度貼るだけです。ピンが増えても、コードは変わりません。
  1. 01

    Pinterestを接続する

    無料で登録してフィードを作り、ソースにPinterestを追加して、Pinterest公式のOAuthの画面で接続します。そのあとボードを1つ選ぶか、すべてのピンのままにします。求めるのは読み取り専用のアクセスなので、ウィジェットにできるのはボードの一覧とピンを読むことだけで、アカウントにそれ以外のことはできません。

    クレジットカード不要
    ソースを追加
    Pinterestアカウント全体、またはボード1つ接続

    ここからPinterest公式のログインと権限の許可画面が開きます。パスワードを私たちが見ることも、保存することもありません。

  2. 02

    表示するピンを選ぶ

    取り込んだピンはCollectの画面にカードで並び、承認・除外のボタンが付きます。説明文はその場で編集でき、有料プランと7日間のトライアルでは先頭へのピン留めもできます。「Pre-approve posts」をオンにすると、承認するまでどのピンも訪問者に表示されません。

    表示を決めるのはあなたです
    取り込んだピン新着3件
    麻ひもだけで束ねて、ワイヤーは使いません。摘んだばかりに見えるように。
    今年うまくドライになったものを全部並べました。このあとリースになります。承認済み

    キーワードルールとAIコンテンツフィルターで入ってくるピンをふるいにかけ、引っかかったピンをホームページに出さないようにできます。

  3. 03

    ウィジェットをデザインする

    40種類のレイアウトと16種類のテーマから選び、日付・アイコン・バッジ・キャプションの表示を切り替えると、プレビューがクリックのたびに描き直されます。

    プレビューは本物のレンダラー
    デザインスタジオ
    GridMasonryCarousel+37
    +12

    スタジオのプレビューは本物のウィジェットです。ここで確認した見た目が、そのまま公開されます。

  4. 04

    どこにでも埋め込む

    Get Code(コードを取得)を押して設置先を選び、出てきたコードをフィードを表示したい場所に貼り付けます。通常のHTMLにはスクリプト、WordPressにはプラグインかスクリプト、WixとSquarespaceにはiframe、NotionとGoogleサイトにはURLだけが渡されます。

    設置先に合ったコードが出ます
    コードを取得Plain HTML
    <link rel="preload" as="fetch" …><div id="collectsocials-4f9c21a7"></div><script src="…/api/widget"data-feed-id="…" data-token="…"data-container="…" data-api-base="…"defer></script>

    一部を省略しています。実際のダイアログでは、あなた専用のIDとフィードURLの属性が入ります。そこで設置先を選ぶと、それに合わせてコードの形が変わります。

ホームページに出すピンは、あなたが決めます

取り込んだピンはカードで並び、承認する、除外する、説明文をその場で編集する、のいずれかを選べます。有料プランとトライアル中は、先頭へのピン留めもできます。「Pre-approve posts」をオンにすると、新しいピンは承認するまでページに出ません。キーワードルールとAIコンテンツフィルターで、入ってくるピンを先にふるいにかけることもできます。ピンがすべて自分のものでも、商品の隣に置きたいのはその一部だけ、ということはよくあります。

📥 取り込まれたピン
↓
🔍 自動フィルター
キーワードルール・AIコンテンツフィルター
↓
👤 人の目による確認
↓
✓ 承認
公開される
⏸ 保留
確認が必要
✗ 除外
有害・誤った情報

取り込まれたピンがたどる流れです。まずキーワードルールとAIコンテンツフィルターを通り、そのあとCollectの画面で、残すか除外するかを選べます。「Pre-approve posts」をオンにすると、承認するまで保留されます。

設置先のサービスに合わせて、埋め込みコードを出し分けます

scriptタグは、どこにでもそのまま貼れるわけではありません。外部のコードをサンドボックスに閉じ込めるビルダーもあれば、削除してしまうビルダーもあります。そのため埋め込みの画面は、まずどこに設置するかを聞き、その環境に合ったコードを渡します。

スクリプト埋め込み

HTML、WordPress、Webflow、React

scriptタグ1つとコンテナのdiv1つです。ウィジェットはページに直接描画され、Shadow DOMの中で動くので、ウィジェットのCSSとサイトのCSSが干渉しません。

ラップしたスクリプト

Shopify

同じスクリプトを、ページ幅いっぱいに広げるラッパーで包んだものです。Shopifyのテーマはセクションをflexboxで並べるため、そのままだとコンテナが押しつぶされてしまいます。

iframe埋め込み

WixとSquarespace

どちらも、貼り付けたスクリプトをサンドボックスに入れるか取り除くため、iframeのコードを渡します。コード内の小さなスクリプトが動く環境では内容に合わせて高さが変わり、スクリプトが取り除かれる環境でも、フィードは固定の高さの枠の中でスクロールして表示されます。

URLだけ

NotionとGoogleサイト

スクリプトをまったく実行できないサービスには、高さを固定した枠をURLで渡します。中身は枠の中でスクロールします。

WordPressなら、コードを貼る代わりにCollectSocialsのWordPressプラグイン(英語)も使えます。プラグインのディレクトリからインストールでき、ブロックでフィードを配置します。

日本のホームページ作成サービスやブログをお使いなら

STUDIO、Jimdo、ペライチ、BASE、Ameba Owndなど、上の一覧にないサービスでも考え方は同じです。HTMLを貼り付けられるブロックがあるビルダーなら、Plain HTMLのコードをそのまま貼り付けます。上の4種類のうち、1つ目と同じコードです。ブロックの呼び名はサービスによって違うので、「HTML」「埋め込み」「カスタムコード」といった名前の項目を探してください。ブログサービスでも、記事やサイドバーにHTMLを貼り付けられる場所があれば同じです。

貼り付けたスクリプトが取り除かれてしまう場合は、埋め込みの画面でWixかSquarespaceを選んだときに出るiframe形式のコードを使ってください。フィード自体はiframeの中に表示されます。高さの自動調整はスクリプトが動くときだけ働き、動かない場合は固定の高さの枠の中でスクロールする表示になります。

ホームページを重くしない仕組みを、スコアではなく構造で示します

速度スコアのランキングは公開していません。ウィジェットのスコアは、ページのどこに置くか、フィードに何が入っているかで変わるからです。代わりに、どう作られているかを公開します。ブラウザの開発者ツールでご自身で確かめられる内容です。

ファイル1つ

deferのスクリプト1つと、コンテナ1つ

組み込みに必要なのはscriptタグ1つとdiv1つだけです。defer属性付きなので、ページの描画を止めることはありません。

並行して取得

スクリプトの読み込み中に、フィードも届きます

埋め込みコードがフィードのリクエストを先に始めておくので、ピンとコードが順番待ちをせず、同時に届きます。

Shadow DOM

サイトのCSSとぶつかりません

ウィジェットはShadow DOMの中に描画されます。サイトのスタイルシートがフィードを崩すことも、フィードがページを崩すこともありません。

なぜ速度スコアを載せないのか:8つのウィジェットを測って、やめました

同じウィジェットでも、置き場所しだいでスコアが10点以上変わります。iframe方式とスクリプト方式は、そもそも同じ物差しで比べられません。測定方法の全体と、ランキングの代わりに採用した構造の比較は、8つのInstagramフィードウィジェットを同じページで試した比較記事にあります。その検証でShadow DOMを使ってCSSを分離していたのは8つのうち1つで、それが私たちのウィジェットでした。

もう1つ、同意バナーを運用しているサイトに関係する点です。ウィジェット自体はCookieを置かず、localStorageやsessionStorageにも何も書き込みません。開発者ツールのApplicationパネルで確かめられます。

ホームページに必要なフィードが、ピンタレストだけとは限りません

1つのフィードに10のプラットフォームを組み合わせられるので、ピンの隣にInstagramの投稿、Googleの口コミ、YouTubeの動画を同じ区画に並べられます。X(旧Twitter)以外のプラットフォームはすべて無料プランで使えます。Xだけが有料なのは、XがAPIの利用に料金をかけているという1つの理由からです。無料プランで接続できるソースは1件なので、複数のプラットフォームを混ぜたウォールは7日間のトライアルか有料プランで使えます。ボードにいちばん近いのはTumblrのブログで、写真と文章を同じウォールに混ぜて並べます。

高橋さくら2週間前Google

写真を見て日の出のツアーを予約しましたが、写真以上でした。ガイドの方は、どこに、いつ行けばいいかを正確に把握していました。

海の上の嵐雲の下から夕日がのぞくなか、暗い溶岩の尾根に立つ小さな人影YouTube

尾根道の3日間、最初から最後まで

下から見上げた空中ブランコ。乗り手たちが澄んだ青空へ大きく振り出されているTikTok

ブランコが水の上まで大きく振り出されます

Atlas & Pine@atlasandpine · 3日前Twitter/X

日の出チームは、嵐が来る前に尾根までたどり着きました。写真はすべてホームページに載せています。

Atlas & Pine5週間前Facebook

ラグーンで過ごした一日。6艇で漕ぎ出して転覆はゼロ、水の色は午後のあいだずっとこのままでした。

石灰岩の断崖に挟まれたターコイズ色の入り江を進む、赤や黄色のカヤック
伊藤大輔1か月前Google

今年2回目の参加です。スケジュールはすべて時間どおりで、少人数制こそがこのツアーの良さだと思います。

明るい黄色の壁の前で、髪を顔の前に振り乱して踊る人Instagram

黄色い壁を見つけたので、もちろん踊りました。

大きく広がる太陽の光を背に、砂丘の稜線でシルエットになった2人。手前の砂には風紋Instagram

太陽より一足先に、稜線にたどり着きました。

夜明けの淡い色の奇岩の上を漂う熱気球Instagram

気球より先に起きていました。

Atlas & Pine7週間前Facebook

フェスティバルの最後に、風船を一斉に空へ。10秒ほど、誰もひと言も話しませんでした。

澄んだ青空へ一斉に昇っていく、たくさんの色とりどりの風船

架空のブランドのデモフィードで、接続できる10のソースのうちいくつかを1つのウォールに並べています。投稿、口コミを書いた人、反応の数はすべて例で、製品の指標ではありません。カードに載っている項目はどれも実際のウィジェットが描画するものですが、このウォール自体はウィジェットが配信したものではなく、このページのために描いたものです。

無料プランも、ちゃんと使えるプランです

デザインスタジオのすべての機能を7日間、クレジットカードなしで試せます。トライアルが終わっても、実際に公開中のホームページで使い続けられるプランが残ります。

無料(期間の制限なし)
  • 40種類中7種類のレイアウト(Masonryを含む)
  • 16種類のテーマすべてと、テーマビルダー
  • モデレーション(承認・除外・編集・キーワードルール)
  • 24時間ごとの自動同期
  • すべてのピン、または好きなボード1つ

無料プランのウィジェットには、小さなCollectSocialsのクレジットリンクが入ります。

有料プラン:月額$29から
  • 40種類のレイアウトすべて(Pinterest Feedを含む)
  • より速い同期、最短5分ごと
  • より多くのソースと、より高い上限
  • ピン留め(好きなピンを先頭に固定)
  • クレジットリンクを外せる
  • 唯一の有料プラットフォーム、X(旧Twitter)

Xが有料なのは、XがAPIの利用に料金をかけているからです。料金表の奥に埋めておくより、はっきり書いておくほうがいいと考えています。料金の詳細(英語)。

Pinterestウィジェットについて、よくある質問

Pinterestウィジェットとは何ですか?

ピンタレストのアカウントからピンを取り込み、ホームページ上に自動で更新される一区画として表示する、埋め込み型の部品です。一度接続して、すべてのピンかボード1つを選び、見た目を整えてコードを1つ貼り付ければ、それ以降はアカウントの更新に自動でついていきます。訪問者はPinterestへ移動せず、あなたのページにとどまったままピンを見られます。

ピンタレストのビジネスアカウントが必要ですか?

いいえ。個人用アカウントでもビジネスアカウントでも、PinterestのAPIでピンとボードを読み取れるので、どちらでも使えます。私たちが求めるのは読み取り専用のアクセスで、ボードの一覧を取得してピンを読む権限だけです。ウィジェットがアカウントに投稿したり、ピンを編集・削除・リピンしたりすることはできません。そのための権限を、最初から求めていないからです。

ピンタレストのボードを1つだけホームページに埋め込めますか?

できます。設定のときに、ソースの選択画面にボードの一覧が出るので、そのうち1つを選びます。ウェディングのページにはウェディングのボード、別のページには別のボード、という分け方ができます。すべてのピンのままにすれば、アカウント全体についていきます。どちらの場合も、あとから保存したピンは自動で届きます。

ピンのいいねやコメントの数も表示されますか?

Pinterestのピンについては、反応の数(保存数・コメント数)を取り込んでいません。反応の欄があるカードでは数字が0と表示されるため、Pinterestのフィードでは、デザインスタジオの「Show Likes & Comments」をオフにしてください。

Pinterest公式のウィジェットビルダーの代わりに使えますか?

使えます。CollectSocialsのウィジェットでは、表示するピンをあなたが決められ、見た目は40種類のレイアウトと16種類のテーマから選べます。トライアル中と有料プランでは、Instagramの投稿やGoogleの口コミなど、ほかのプラットフォームと1つのウォールにまとめることもできます。ボードに新しいピンを保存すれば、コードを貼り直さなくてもホームページに届きます。Pinterest公式のツールは検証していないため、このページでは比べていません。

Pinterestウィジェットを設置すると、ホームページが重くなりませんか?

重くならないように作っています。deferのスクリプト1つとコンテナ1つだけで、フィードのリクエストはスクリプトのダウンロードと並行して始まり、描画はShadow DOMの中で行われるのでサイトのCSSに触れません。速度テストのランキングはあえて公開していません。スコアはフィードをページのどこに置くか、何が入っているかで変わるからです。そう判断した理由は、テストデータと一緒に、8つのInstagramフィードウィジェットを同じページで比べた検証で説明しています。

無料プランではどこまで使えますか?

Pinterestとの連携は、アップグレードなしで無料プランのまま使えます。40種類のうちMasonryを含む7種類のレイアウト、16種類のテーマすべてとテーマビルダー、モデレーション、そして1日1回の自動同期が含まれます。無料プランのウィジェットには小さなCollectSocialsのクレジットリンクが入り、有料プランでは外せます。7日間のトライアルでは、すべてのレイアウトとモバイル用の別デザインを含むデザインスタジオの全機能を、クレジットカードなしで使えます。

新しいピンは、どのくらいの頻度で自動更新されますか?

プランのスケジュールに合わせて自動で同期されます。無料プランは24時間ごとで、上位のプランほど間隔が短くなり、最上位のプランでは5分ごとです。Pinterestのアクセストークンは30日ごとに期限が切れますが、ウィジェットが裏側で自動的に更新します。Pinterestが更新を受け付けなかった場合は、再接続をお願いします。手動で更新したり、コードを貼り直したりする必要はありません。

ホームページに表示するピンを選べますか?

はい。取り込んだピンはモデレーションの画面にカードで並び、承認・除外と説明文の編集ができます。新しいピンは初期設定ではそのまま表示され、フィードの設定で「Pre-approve posts」をオンにすると、承認するまで表示されません。承認・除外・説明文の編集はすべてのプランで使え、ピン留めは有料プランと7日間のトライアルで使えます。キーワードルールとAIコンテンツフィルターで、入ってくるピンを先にふるいにかけることもできます。自分のボードでも役に立つ機能です。ピンはすべて自分のものでも、商品の隣に置きたいのはその一部だけ、ということはよくあります。

スマホでも崩れずに表示されますか?(レスポンシブ対応)

MasonryとPinterest Feedのレイアウトは、画面の幅が狭くなると列の数を自動で減らします。スマホ用のコードを別に用意する必要はなく、埋め込みコードは同じままです。横にスクロールする帯のレイアウトでは、縦長のピンは正方形の枠に収まる大きさで表示されるので、ピンが読み込まれても列の高さは変わりません。スマホだけ別のレイアウトとテーマにしたい場合は、トライアル中と有料プランのデザインスタジオで設定できます。

STUDIOやJimdo、ペライチで作ったホームページや、ブログにも貼り付けられますか?

HTMLを貼り付けられるブロックがあるビルダーやブログなら、Plain HTMLのコードをそのまま貼り付けられます。スクリプトが取り除かれてしまう場合は、埋め込みの画面でWixかSquarespaceを選んだときに出るiframe形式のコードを使うと、フィード自体は表示されます。高さの自動調整はスクリプトが動くときだけ働き、動かない場合は固定の高さの枠の中でスクロールする表示になります。WordPressなら、コードを使わずにプラグインのブロックで配置することもできます。

ピンタレスト以外のSNSも、同じウィジェットに表示できますか?

できます。1つのフィードに、Instagram、Facebook、YouTube、TikTok、Googleの口コミを含む10のプラットフォームを組み合わせ、1つのウォールにできます。X(旧Twitter)以外のプラットフォームはすべて無料プランで使えます。Xだけが有料なのは、XがAPIの利用に料金をかけているという1つの理由からです。無料プランで接続できるソースは1件なので、複数のプラットフォームを混ぜたウォールは7日間のトライアルか有料プランで使えます。Pinterestのウォールと組み合わせやすいInstagramについては、専用のページで説明しています。

自分のボードで試すなら、今夜からでも

Pinterestを接続し、ボードを選び、レイアウトを決めて、コードを1つ貼るだけです。7日間のトライアルではデザインスタジオのすべての機能が使え、クレジットカードも求めません。

WordPress、Shopify、Wix、Squarespace、Webflow、Notion、そして通常のHTMLで使えます。