All in One SEOの初期設定について
All in One SEOのセットアップウィザードの中断/完了、もしくはWordPressの左メニューからAll in One SEO>ダッシュボードをクリックすると下記のような画面が表示されます。 かなり多くの設定メニューがありますね。
今回はこの中でも、これからWebサイトを作っていくにあたって最初に設定しておきたい * 検索窓の外観 * ソーシャルネットワーク
の2項目を設定していきます。 この設定はローカル環境で試してみても良いですし、本番環境(レンタルサーバー上にあるWordPress)で行って頂いても構いません。本番環境にプラグインを追加する場合は、バックアップを取ってから行いましょう。
検索の外観を設定する
では、管理画面の左メニューから All in One SEO>検索の外観 をクリックして開いて下さい。
↓
検索の外観では、検索エンジンの検索結果画面でWebサイト/ページがどのように表示されるかを確認・設定することが出来ます。見本のサイトはサイトタイトルしか入れていないので、現段階でプレビューを見ても「何についてのサイトか」が全くわからない状態です。
実際に稼働しているサイトはどのような表示になっているのか、スキルハブのサイトを例として見てみましょう。
トップページ(フロントページ) * タイトル:サイトタイトル * メタ説明:サイト概要
投稿(記事)ページ * タイトル:記事タイトル * メタ説明:記事の概要
という形になっています。 検索ユーザーはこの表示を見て、自分が知りたい内容が書かれていそうならページを開いてくれるでしょう。タイトルだけではなくメタ説明部分もかなり重要ですね。
作成中のサイトも、このように表示されるように設定していきましょう。 左メニューから検索窓の外観をクリックした状態で表示されているのは、トップページ(フロントページ)の表示の方です。
※サイトタイトルの後、説明部分に表示されている「Just another WordPress site」はWordPressの設定>一般ページでキャッチフレーズとして登録されている文言です。
「Just another WordPress site」と初期設定のままになっている方は、作成したサイト概要シートのキャッチフレーズに入れ替えてみましょう。
変更を保存ボタンをクリックした後、 もう一度、All in One SEO > 検索の外観 を開くと反映が確認できます。
●ホームページの設定
上記の検索の外観(一般設定)の一番上に出てくるプレビューは、トップページの表示プレビューではありません。検索エンジンに表示されるトップページの表示プレビューは、少し下にスクロールしたところにある「ホームページの設定」という箇所です。
以下のホームページ設定は無効になっています、という表示が出ているはずです。 タイトルと説明文を変更したいので「ホームページ設定を編集」というリンク文字をクリックしてみましょう。
固定ページの編集画面(エディター画面)が開きます。 All in One SEOでは、front-page.phpを固定ページに割り当てて使っている場合は、固定ページの編集画面で設定するようになっています。
右上にAll in One SEOのボタンが加わっていますね。 また、下にスクロールしていくと本文入力欄の下にもAll in One SEOの設定エリアが加わっています。
この中の固定ページタイトルと、メタ説明の部分を変更してみます。 赤線で囲ったボタンを使って用意されているコンテンツから選ぶことも、キーボードを使って独自に入力することも出来ます。
【初期状態】
↓
【タイトル、メタ説明を変更】
サイトタイトル、説明が設定されたことで「何のサイトが」が明確になりましたね。 これなら検索結果一覧を見て、ターゲットユーザーがサイトを訪問してくれる可能性がありそうです。
設定が完了したらエディター右上にある「更新」ボタンを使って上書きしましょう。
ちなみに、メタ説明の下にある「フォーカスキーフレーズ」は上位表示を狙う検索キーワードを入れておくとコンテンツを解析して改善点などを提示してくれる、というもの。検索エンジンに何かを伝えるものではありませんし、指示に従えば必ずコンテンツの品質が上がる・検索順位が上がるというものでもありません。
指標として登録しても良いですし、空のままでも特に影響はありません。
詳細:AIOSEOドキュメント
フロントページをSEO設定を上書き保存したら、一度フロントページをみてみましょう。 タブに表示されるタイトルが変わっているはずです。
右クリックメニューから「ソースを表示」を選んでコードを見てみて下さい。独自テーマ作成時には設定していないmetaタグを、プラグインが書き出してくれていることが分かります(赤の点線箇所)
黒い線で囲った部分は、テンプレートファイルに設定した部分です。 プラグインでmetaタグが出力されると不要になるので、削除しておきましょう。
これでホームページのタイトル、メタ説明の設定は完了です。
●ホーム以外のページの設定
他のページ(固定ページ、投稿)も同じようにエディター下部で個別にタイトルなどを設定することができます。が、毎回設定するのは大変ですので、予め何を書き出してほしいかを決めておくと楽です。
All in One SEO > 検索の外観 > コンテンツタイプを開きます。 投稿、固定ページ、それぞれタイトルとメタ説明を設定する欄があります。
メタ説明は初期状態だと「投稿コンテンツ」になっていますが、 投稿に関しては「投稿抜粋」に変更しておくのがオススメです。
というのも
- 投稿コンテンツ→投稿内容の最初の160文字を出力
- 投稿抜粋→抜粋に入力したテキストを出力する
という仕組みになっているので、例えばブログで「こんにちは、〇〇です。最近寒くなってきしたね」のように書き始めると、書き出し部分だけ表示される=肝心の内容が全く入らないのです。
1投稿ずつ抜粋文を作るのは大変ですが、記事の中身を的確に検索エンジン・検索ユーザーに伝えられよう、自分で抜粋文を作るようにしましょう。
ソーシャルネットワークを設定する
SNS内で、サイトへのリンクが貼られたときの見え方を設定します。
管理画面からAll in One SEO > ソーシャルネットワーク を開いて下さい。
日本語化のバグなのか「ピンタレスト」になっていますが、下記のページはサイト所有者の運用しているSNSのURL登録する画面です。
WordPressと連動させたいSNSのURLを入力し、右上の「変更内容を保存」ボタンで登録しておきましょう。完了したらFacebook,Twitterタブを使って、それぞれの表示設定を行っていきます。
●Facebookの設定
ページ上部のFacebookをクリックして、設定ページを開きます。
最初に設定しておきたいのはページ上部、オレンジ色の線で囲った二箇所。
- デフォルトの投稿画像ソース →アイキャッチ画像に変更
- デフォルト投稿Facebook画像 →サイトイメージ画像をアップロードして適用
こうすることで、投稿のページにリンクが貼られた場合はアイキャッチの画像が、アイキャッチのないページにリンクが貼られた場合はサイトイメージ画像が表示されるようになります。
サイトイメージ画像は、 例として書かれているサイズ 1640px x 856px もしくはFacebook,Twitter共通で使える1200px × 630px 等のサイズで作って下さい。 上下左右が少しカットされる事があるので、見切れると困るロゴやテキストは余裕を持って配置することをおすすめします。
変更内容を保存してください。
●Twitterの設定
ページ上部のTwitterをクリックして、設定ページを開きます。
Twitterの方も設定箇所はFacebookとほぼ同じです。 カードタイプを「大きな画像で要約」にしておくと、使用されるサイトイメージ画像の比率がFacebookと近くなります。例のように多少端が切れても問題ない画像であれば使い回せますね。
ホームページの設定
Facebook,Twitterどちらも最下部には「ホームページ設定」があります。
タイトル等と同じく、直接編集するように指示されていますね。 前記の「検索の外観」で設定したタイトル・抜粋文が適用されているので、基本的に固定ページ画面を開いて編集する必要はありません。
手動で変更したい場合は、固定ページを編集画面のAIOSEO設定で「Social」をクリックすると個別設定することが出来ます。
これで設定は終わりです。
SNS表示の確認方法
All in One SEOでプレビューを表示してくれるはずなのですが、下図のようにプレビューが上手く機ないことがあります。
本番環境でも同様の表示しかされていないと、不安ですよね。 公開済のサイト/Webページであれば、FacebookやTwitterが提供しているデバッグツールを使って設定内容が登録されているか確認することが出来ます。
どちらもログインが必要ですが、使い方はとても簡単ですよ。
【デバッグツール】 * シェアデバッガー – Developers Facebook * Card Validator _ Twitter Developers
Facebookの場合
シェアデバッガーを開き、赤線部分にサイトURL、もしくは確認したいページのURLを貼り付けます。 「デバック」ボタンをクリックして下さい。
新規に立ち上げたサイトであれば“このURLはまだFacebookでシェアされていません”と表示されます。この場合は「新しい情報を取得」ボタンをクリックして下さい。
すると、画面表示が変わります。 下の方にスクロールしていくと、プレビューを確認することが出来ます。 サイトのイメージ画像を変更したけれど反映されていない、というような場合は赤線で囲った「もう一度スクレイピング」というボタンを使って再読込させましょう。
記事ページのURLを入れても確認可能です。
Twitterの場合
Twitterのデバッグツールは更に簡単です。 Card Validator _ Twitter Developersを開いて、プレビューを見たいURLを入力し「Preview card」のボタンをクリックするだけ。
↓
【ホーム】
【記事ページ(まだ試さなくて良いです)】
◆課題:All in One SEOの設定を行う
今回のレッスンで行ったタイトル・メタ説明・ソーシャルネットワークの設定を行って下さい。設定ができたら下記デバッグツールを使用し、SNSに投稿したときにサイトが魅力的に見えるか確認してみましょう。 記事の確認は記事投稿時に行うので、ホームの表示確認のみで良いです。
【デバッグツール】 * シェアデバッガー – Developers Facebook * Card Validator _ Twitter Developers