SWELLのOGP設定|適した画像サイズやTwitterカードを表示する方法を紹介
「OGP設定方法が知りたい」
「Twitterに画像付きで記事をシェアする方法は?」
「OGP画像の推奨サイズを教えて」
この記事では、そんな方に向けて、SWELLのOGP設定方法を解説します。
こんにちは、かめコンパスです!
\読みたい箇所をクリック/
この記事を読めば、あなたも簡単に
- 適したサイズの画像をSNSに表示できる
ようになります。
私もあなたと同じことに悩んでたのですが、本記事の方法でサクッと解決でき、Twitterからブログへ流入UPさせるためのOGP画像を設定できました。
どこよりも分かりやすく書いている自信がありますので、あなたもパパッと解決してみてください!
\SWELL購入を検討中の人はこちらもご覧ください!/
また以下の記事では、SWELL導入後にやるべき初期設定をまとめて紹介しています。
SWELLのOGP設定方法|画像付きでSNSシェアできる!
SWELLのOGP設定をすることで、以下のようなSNSに記事をアップするときに画像付きでシェアできます。
設定方法は、WordPress管理画面を開き、SEO PACK⇒OGP設定の順にクリックしてください。
\クリックで開く/
プラグイン「SEO SIMPLE PACK」の導入方法はこちら
プラグイン⇒新規プラグインを追加の順にクリックする
検索窓に「SEO SIMPLE PACK」と入力する
「SEO SIMPLE PACK」の今すぐインストールをクリックする
有効化をクリックする
これでSEO PACKが表示されます。
表示された以下3つの項目で設定します。
それぞれの項目を詳しく解説します。
「基本設定」:サイト全体のSNSシェア画像を設定する
OGP設定の基本設定では、トップページやアイキャッチ画像を設定していない記事をSNSに投稿するときに表示される画像を設定できます。
基本設定⇒画像を選択の順にクリックして、画像を挿入する
設定し終えたら、設定を保存するをクリックする
これで自サイトのページをSNSにシェアしたときに表示する画像を設定できます。
つぎに設定したOGP画像をどのSNSに適応させるか決めるよ
「Facebook」:URLやIDを設定する
FacebookにOGP画像を表示させたい場合に設定します。
Facebookをクリックし、表示されたページで設定する
- Facebook用のメタタグを使用する⇒Facebookアカウントを持っている人は「はい」を選ぶ
- FacebookページのURL⇒検索エンジンからアクセスしたFacebookページのURLを入力する
- fb:app_id⇒FacebookのアプリIDを入力する
- fb:admins⇒アプリ管理者の Facebook IDを入力する
設定し終えたら、設定を保存するをクリックする
これでFacebookにOGP画像を表示できます。
「Twitter」:アカウント名やカードタイプを設定する
𝕏(旧Twitter)にOGP画像を表示させたい場合に設定します。
Twitterをクリックし、表示されたページで設定する
- Twitter用のメタタグを使用する⇒Twitterアカウントを持っている人は「はい」を選ぶ
- Twitterアカウント名⇒Twitterアカウント「@〇〇〇」の〇〇部分のみ入力する
- カードタイプ⇒「summary」or「summary_large_image」から選ぶ
画像が大きく表示される「summary_large_image」がおすすめ!
設定し終えたら、設定を保存するをクリックする
これで𝕏(旧Twitter)にOGP画像を表示できます。
SWELLで投稿ページごとにOGP画像を変更する方法
SWELLではアイキャッチ画像を設定することで、投稿ページごとにOGP画像を変更することができます。
投稿ページごとにOGP画像を変えることで、
- その投稿ページに合った画像を設定できる
- 同じ画像ばっかりでつまらなくなくなる
- SNSページが華やかになる
といったメリットがあります。
アイキャッチ画像=OGP画像という理解でOK
アイキャッチ画像の設定方法は下記のとおりです。
記事編集画面で、設定⇒投稿の順にクリックする
アイキャッチ画像を設定をクリックする
更新をクリックする
これでアイキャッチ画像を設定し、OGP画像を変更できます。
SWELLでOGP画像の推奨サイズ
SWELLでOGP画像の推奨サイズは、
- 幅1200px×高さ675px ※Facebookを利用しない場合
- 幅1200px×高さ630px ※Facebookを利用する場合
の2通りです。
個人的には幅1200px×高さ675pxがおすすめで、その理由は
- アイキャッチ画像の推奨サイズが幅1200px×高さ675px
- 地デジやYouTube画面と同じ比率(=アスペクト比16:9)
だからです。
投稿ページで設定したアイキャッチ画像がそのままSNSにシェアされるので、OGP画像もアイキャッチ画像と同じサイズがいいです。
また、普段見慣れている画像比率(=アスペクト比16:9)のほうが違和感なく見れます。
画像もきれいに表示されるよ
ですので、OGP画像のサイズは幅1200px×高さ675pxにしましょう。
OGPの画像サイズを変更する方法
もし利用したいOGP画像が推奨サイズでなければリサイズしましょう。
リサイズ方法は以下の2通りあります。
CanvaでOGP画像をリサイズする
Canvaサイトを開き、カスタムサイズをクリックする
「幅」と「高さ」に変更したいサイズを入力し、新しいデザインを作成をクリックする
幅1200×高さ675pxがおすすめだよ
- サイドバーにあるアップロードをクリック
- ファイルをアップロードをクリックし、リサイズしたい画像をアップロードする
アップロードされた画像をクリックする
ページに挿入された画像をページいっぱいまで広げる
共有⇒ダウンロードの順にクリックする
ダウンロードをクリックする
これで、CanvaでOGP画像のリサイズ完了です。
ペイントでOGP画像をリサイズする
ペイントアプリを開き、リサイズしたい画像をページに挿入する
- サイズ変更と傾斜をクリック
- ピクセルを選択
- 縦横比を維持するを無効
- サイズを入力
- OKをクリックする
ファイル⇒保存の順にクリックする
これで、ペイントでOGP画像のリサイズ完了です。
SWELLでOGP画像が表示されないときの対処法
SWELLで設定したOGP画像が表示されない場合は、
- キャッシュクリアする
- 少し時間を待つ
の順に試してみましょう。
キャッシュクリアする方法は、WordPress管理画面の上部にあるSWELL設定にカーソルを置くと表示されるキャッシュクリア(コンテンツ)とキャッシュクリア(ブログカード)をクリックして行います。
これでOGP画像が表示されない場合は、少し時間を待ってみましょう。
私の場合、この方法で解決できています
SWELLのOGP設定まとめ
今回は、SWELLのOGP設定方法を紹介しました。
\読み直したい箇所をクリック/
当ブログでは、SWELLに関する記事をいくつか書いてます。
下のカテゴリーページにまとめていますので、のぞいてみてください。
ためになったという人は“コメント”してくれると嬉しいです!
コメント