Open Graph タグとは？

Open Graph タグは og:title、og:description、og:image、og:url、og:type などの meta 要素で、SNS アプリにリンクプレビューの見え方を指示します。ないと Facebook や LinkedIn、Slack が弱いタイトルや誤った画像を推測することがあります。

必要な Open Graph タグは？

まず og:title、og:type、og:image、og:url。あれば og:description、og:site_name、og:locale を追加。入力したフィールドだけを出力し、og:type はデフォルト website です。

og:image のサイズは？

絶対 https URL を使います。Facebook や LinkedIn では 1200 x 630 px の横長が一般的です。小さいとトリミングや小さなサムネイルになることがあります。

Twitter Card タグも必要？

X (Twitter) は Open Graph を読めますが、twitter:card、twitter:title、twitter:description、twitter:image で明示制御できます。オプションをオンにしてください。画像ありは summary_large_image、なしは summary です。

HTML はどこに貼る？

HTML ドキュメントの head 内（またはフレームワークの metadata API）に貼ります。og:url に設定した公開 URL のページ上に置き、クローラーが読めるようにします。

入力内容は端末の外に出ますか？

いいえ。Open Graph タグジェネレーターはブラウザ内だけで動作し、タイトル、URL、画像リンクはサーバーに送られません。

SEOツール

Open Graph タグジェネレーター

ブラウザで Open Graph と Twitter Card のメタタグを作成します。ページタイトル、説明、URL、画像、タイプ、サイト名、ロケールを入力し、生成された HTML を head に貼り付けると、Facebook、LinkedIn、Slack などできれいなシェアカードが表示されます。画像 URL がある場合、Twitter Card は…

ページタイトル

0文字

説明

0文字

ページURL

画像URL

推奨サイズ 1200 x 630 px。絶対HTTPS URLを使用してください。

og:type

サイト名

ロケール

en_USやes_ESのようなOpen Graph形式を使用してください。

HTMLタグ

タグを生成するには、タイトル、説明、URL、または画像を入力してください。

ソーシャルプレビュー

共有画像をプレビューするには、画像URLを追加してください

www.example.com

あなたのページタイトル

リンクが共有されると、ここに説明が表示されます。

Open Graph タグジェネレーターについて

Open Graph タグジェネレーターの使い方

ページタイトル、説明、正規 URL、画像 URL を入力します。
og:type（website、article、product、profile）を選びます。
必要ならサイト名とロケール（例: en_US）を追加します。
Open Graph のみ必要な場合以外は Twitter Card タグをオンにします。
HTML をコピーしてページの head 内に貼り付けます。

Open Graph タグジェネレーターの例

ブログ記事のシェアカード

タイトル「ブログ記事用 Open Graph タグ」、type article、1200 x 630 の画像、記事 URL から og:title、og:type、og:image、og:url が生成され、記事テンプレートにそのまま貼れます。

サイト名付きホームページ

type website、ブランドを og:site_name、ホーム URL を指定すると、Slack や LinkedIn でタイトル下にブランド名が表示されます。

商品ページ

type product にタイトル、価格訴求の説明、商品 URL、ヒーロー画像を設定すると、Facebook や iMessage で購入しやすいカードになります。

引用符とアンパサンド

Shop "A & B" のようなタイトルは Shop "A & B" にエスケープされ、貼り付け後も HTML が有効です。

Open Graph タグ完全ガイド

完全なガイドを読む

Open Graph タグジェネレーターの使い方：完全ガイド（2026年版） - 5 分の読書

Open Graph タグジェネレーターに関するよくある質問

Open Graph タグとは？: Open Graph タグは og:title、og:description、og:image、og:url、og:type などの meta 要素で、SNS アプリにリンクプレビューの見え方を指示します。ないと Facebook や LinkedIn、Slack が弱いタイトルや誤った画像を推測することがあります。
必要な Open Graph タグは？: まず og:title、og:type、og:image、og:url。あれば og:description、og:site_name、og:locale を追加。入力したフィールドだけを出力し、og:type はデフォルト website です。
og:image のサイズは？: 絶対 https URL を使います。Facebook や LinkedIn では 1200 x 630 px の横長が一般的です。小さいとトリミングや小さなサムネイルになることがあります。
Twitter Card タグも必要？: X (Twitter) は Open Graph を読めますが、twitter:card、twitter:title、twitter:description、twitter:image で明示制御できます。オプションをオンにしてください。画像ありは summary_large_image、なしは summary です。
HTML はどこに貼る？: HTML ドキュメントの head 内（またはフレームワークの metadata API）に貼ります。og:url に設定した公開 URL のページ上に置き、クローラーが読めるようにします。
入力内容は端末の外に出ますか？: いいえ。Open Graph タグジェネレーターはブラウザ内だけで動作し、タイトル、URL、画像リンクはサーバーに送られません。

Twitterカードジェネレーター

カードタイプ、タイトル、説明、画像、サイトハンドルからTwitterカード/Xメタタグを生成します。ライブHTMLとプレビュー付きの無料のtwitter:cardジェネレーター。

メタディスクリプションチェッカーと SERP プレビュー

無料 SERP 長さチェックとメタディスクリプションプレビュー。ライブ文字数と Google スニペットプレビュー - または下書き生成。150-160 文字目安。

スラッグジェネレーター

タイトルやフレーズをクリーンな SEO 向け URL スラッグに。小文字、アクセント除去、ハイフン/アンダースコア選択 - 無料・即時・非公開。