MENU

【SWELL】Xポストで記事URL入れたらアイキャッチも出すには?→プラグインでOGP設定が必要

【SWELL】Xで記事URL載せたらアイキャッチも出すには?→プラグインでOGP設定が必要

SWELL標準のままだと、OGP設定がされておらず、URLをX(Twitter)に載せてもリンク付きのアイキャッチ画像が表示されません。

そこで、OGP設定ができるプラグインを導入する必要があります。

今回は、SWELL開発者と同じ方が提供していて、無料でOGP設定までできるプラグイン「SEO SIMPLE PACK」を導入し、Xでアイキャッチリンクを表示させるまでの手順を解説します。

目次

Xポスト時にリンク付きアイキャッチ画像を表示させるためのOGP設定手順

STEP
プラグイン一覧画面から「新規プラグインを追加」をクリック
プラグイン一覧画面から「新規プラグインを追加」をクリック
STEP
「SEO SIMPLE PACK」を検索欄に入れて「今すぐインストール」をクリック
「SEO SIMPLE PACK」を検索欄に入れて「今すぐインストール」をクリック
STEP
SEO SIMPLE PACKの「有効化」をクリック
SEO SIMPLE PACKの「有効化」をクリック
STEP
サイドバーに追加された「SEO PACK」から「OGP設定」をクリック
サイドバーに追加された「SEO PACK」から「OGP設定」をクリック
STEP
「Twitter」タブを選択し、Xアカウント名(@以降)を入力、カードタイプを選択して「設定を保存する」をクリック
「Twitter」タブを選択し、Xアカウント名(@以降)を入力、カードタイプを選択して「設定を保存する」をクリック

アカウント名は、@以降を入力してください。

カードタイプはsummarysummary_large_imageの2種類があります。お好みの方を選んでください。

上記の手順でOGP設定したけどXでカードが表示されない

結論として、上記のOGP設定を行ってすぐは、反映されない可能性があります。

筆者も設定してしばらくはカードが表示されませんでしたが、10分ほど経ってから試すと表示されるようになりました。

5〜10分程度時間を置いてから再度ポストを試すことをおすすめします。

また、OGP設定が反映されてXカードが表示されるようになっているかどうかは、ツールを使っても確かめられます。やり方は次のとおりです。

STEP
Twitter Developers「Card Validator」にアクセス

https://cards-dev.twitter.com/validatorにアクセスし、Card URLに確認したいページURLを入力して、「Preview card」をクリックします。

Card URLを入力して「Preview card」をクリック
STEP
Card Validatorの結果をみる

Logに「Card loaded successfully」と表示されれば、問題なくカードが表示される状態です。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

1996年に創業以来、30年目に突入。
様々なソリューションを様々な業種のお客様に提供してきました。
「超現場主義」を掲げ、少人数のワンストップ体制で、サーバー構築からデザイン、プログラム開発までを一貫して行い、お客様のニーズに合わせた柔軟で効率的な開発を強みとしています。

目次