Open Graph ジェネレーター

このツールについて

Slack、Twitter、Facebookなどにリンクを貼り付けたときに表示される、ちょっとしたプレビューカードをご存知でしょうか。タイトル、テキストの抜粋、そして画像がある——それがOpen Graphタグがちゃんと機能している証拠です。手動でこれらを設定しようとしたことがあるなら、結構面倒だということに気づいているはずです。このOpen Graphジェネレーターはまさにその課題を解決するためにあります。華やかではありませんし、あなたを驚かせようとしてもいません。ただ、リンクを共有したときにちゃんと見栄えのするようにするために必要なメタタグを作成する手助けをするだけです。

私はブログ記事やプロジェクトのリンクを共有するたびにドキュメントを漁るのに疲れて、これを作りました。正確な構文を忘れてしまったり、画像のサイズを間違えたり、必須のプロパティをうっかり抜かしてしまうことがありました。このツールはそういった手間を省きます。いくつかのフィールドに入力し、「生成」ボタンを押すだけで、すぐに使えるクリーンなコードが得られます。コピーしてHTMLのhead部分に貼り付ければ完了です。

主な機能

• 必要なOpen Graphメタタグをすべて一括で生成
• 主要なプラットフォーム上でリンクがどのように表示されるかをプレビュー可能
• カスタム画像、タイトル、説明文、URLに対応
• サイトにそのまま貼り付けられるクリーンなHTMLを出力
• サインアップ不要、トラッキングなし、余計な機能なし——シンプルなフォームと結果のみ
• 一度読み込めばオフラインでも使用可能。インターネットがなくても使えます

よくある質問

このツールを使うにはHTMLの知識が必要ですか？
いいえ。開発者である必要はありません。タイトル、説明文、画像URLなどのフィールドに入力するだけで、ツールがコードを生成します。コピー＆ペーストができれば大丈夫です。

リンクを共有しても画像が表示されないのはなぜですか？
ほとんどの場合、画像URLが壊れている、サイズが小さすぎる、またはサーバーによってブロックされているためです。画像は少なくとも1200x630ピクセルで、公開されてアクセス可能であることを確認してください。また、一部のプラットフォームは古いメタデータをキャッシュしているため、FacebookのSharing Debuggerなどのツールを使って更新する必要がある場合があります。