ここあです。
あなたのオウンドメディアをWordPressで構築し
Webサイトやブログを公開したら
やはり目指すはサイトの収益化です。
オウンドメディアを収益化するには
あなたがまとめた記事やWebページを
できるだけ多くの人に見てもらう必要があります。
オウンドメディアを運営し始めたばかりの頃は
コンテンツ数も少なく
サイト訪問者にとっても興味のあるコンテンツを探すのに
それほどストレスを感じることはないはずです。
しかし、サイト運営が長くなるにつれて…
- ブログの記事数
- Webサイトページ
といったコンテンツの数が増えてくると…
サイト訪問者であるユーザーが興味のある
コンテンツをわざわざ探さなければならないという
非常にストレスのかかる状態になってしまいます。
だからそんな時に、サイト全体の構成を一目で確認できる
サイトマップページがあると…
ユーザーは迷うことなく興味のあるコンテンツだけに
アクセスすることができます。
つまり、サイトマップページがあると
サイト訪問者のユーザビリティ（利便性）が上がるんですね。
ただ、サイトマップページを作ることで
ユーザービリティが上がる一方
あなたがコンテンツを公開する度に
サイトマップをイチイチ更新するのは
非常に手間で非効率な作業となってしまいます。
そこで今回、あなたにご紹介したいのは…
そんな手間のかかる非効率な作業を
あなたの代わりに自動で生成してくれる
PS Auto Sitemapというプラグインです。
WordPressにはこのように
後から便利な機能を追加できる
プラグインという拡張機能が備わっています。
PS Auto Sitemapを使って
あなたのサイトマップを作成しておけば
ユーザビリティが向上し、アクセス数の増加にも期待できます。
なので、WordPressでオウンドメディアを構築し
ある程度、記事数やWEBページが増えてきたら…
- ユーザビリティ（利便性）を上げるため
- あなたのコンテンツをたくさん見てもらうため
必ずサイトマップを作成しましょう。
わたしもサイトのユーザビリティを上げるために
サイトマップを作成しています＾＾
ということで今回は…
サイト訪問者のユーザビリティを上げる便利なプラグイン
PS Auto Sitemapの導入方法について詳しく解説していきます。
サイトマップとは？
先にサイトマップについて簡単に説明しておきますね。
サイトマップには大きく分けて2種類あります。
- HTMLサイトマップ
- XMLサイトマップ
❶HTMLサイトマップ（ユーザー向けのサイトマップ）
HTMLサイトマップは、あなたのサイト訪問者が
サイト上にあるコンテンツを
見つけやすくなるために一覧表示するものです。
今回あなたが導入するPS Auto Sitemapは
こちらのHTMLサイトマップに当たります。
❷XMLサイトマップ（検索エンジン向けのサイトマップ）
XMLサイトマップは、HTMLサイトマップとは異なり
検索エンジンがあなたのサイト構成を
正しく認識するためのサイトマップとなります。
こちらも自動でXMLサイトマップを生成してくれる
Google XML Sitemapsという代表的なプラグインがありますので
Google XML Sitemapsもぜひ導入してくださいね。
PS Auto Sitemapの導入メリット
PS Auto Sitemapの導入メリットは…
以下の2つです。
- ユーザビリティが上がる
- サイトマップを自動生成してくれる
❶ユーザビリティが上がる
以下のような…
- 記事数が多いサイト
- カテゴリーが煩雑なサイト
などは、ユーザーがお目当ての記事を見つけにくく
ユーザーの離脱率が高くなってしまいます。
しかし、PS Auto Sitemapを導入することで
サイト内の記事が一覧表示でき、過去記事も含め
サイト訪問者がお目当ての記事を見つけやすくなるため
- サイト訪問者の離脱率が低下する
- サイト内の回遊率が上がる
といったSEO効果にも期待できます。
❷サイトマップを自動で生成してくれる
PS Auto Sitemapは新着記事など
サイト内の記事を一覧表示してくれるサイトマップページで
自動的にサイトマップを生成してくれます。
あなたが手動でサイトマップを更新する手間もなく
サイトの更新に合わせ随時サイトマップも更新されるので
わざわざサイトマップをメンテナンスする必要もありません。
PS Auto Sitemapの導入方法
さて、ここからはいよいよWordPressのプラグイン
PS Auto Sitemapの具体的な導入手順を説明します。
まだプラグインを導入したことがないという場合は
先にこちらの記事を参考にしてください。
尚、導入手順はPS Auto Sitemapがあなたのサイトに
インストールされているのを前提でまとめています。
なので、まだPS Auto Sitemapの導入がまだという場合は
先にプラグインをインストールしてから進めてくださいね。
1）固定ページでサイトマップを作成する
PS Auto Sitemapでサイトマップを作る場合は
固定ページを用意しておくと便利です。
ということで、まずは固定ページで
サイトマップページを作成をしましょう。
ダッシュボードメニューから
固定ページ → 新規追加をクリックします。
新規固定ページを開いたら
ページタイトルを入力してください。
タイトルはできるだけ分かりやすく付けましょう。
例えば…
- サイトマップ
- 目次
- CONTENTSなど
こうしておけば、ユーザーにも親切です。
ページタイトルが入力できたら、一旦下書き保存して
パーマリンクの設定を行います。
パーマリンクを設定する場合は
検索エンジン用のXMLサイトマップと
パーマリンクがバッティングするリスクを避けるために
HTMLサイトマップのパーマリンクは
シンプルにsitemapとしないようにしてください。
パーマリンクはあなたが分かりやすい名前で構いませんが
必ず一工夫入れるようにしておく方が安心です。
2）PS Auto Sitemapのコードを貼る
固定ページにサイトマップのタイトルと
パーマリンクが入力できたら
本文の入力エリアにテキスト編集モードで
PS Auto Sitemapの出力コード
<!-- SITEMAP CONTENT REPLACE POINT -->
を貼り付けてください。
以前は、ここに記事がないと
WordPressがコンテンツが何もないページとして判断し
表示されないこともありましたが
現在はPS Auto Sitemapの出力コードだけで
正常に表示されるようになっています。
もしも不安な場合は、念のため…
<!-- SITEMAP CONTENT REPLACE POINT -->のコード上に
「サイトマップへようこそ」みたいな
適当な一文を追加しておいてください…＾＾；
3）固定ページのID番号を控える
サイトマップのタイトルとパーマリンクの設定
PS Auto Sitemapの出力コードが貼り付けできたら
そのまま公開ボタンをクリックし、固定ページを公開します。
固定ページのサイトマップが公開できたら
サイトマップページのURLにある
以下の?post＝●●●にあるID番号（赤枠の部分）をメモしてください。
わたしの場合は、781ですがあなたの番号は違います。
しっかり確認してメモしてくださいね＾＾
4）PS Auto sitemapを設定する
次に、先ほど控えたサイトマップの
ID番号（わたしの場合は781）を
PS Auto Sitemapのプラグインに設定します。
ダッシュボードメニューの
設定 → PS Auto sitemapをクリックし
PS Auto sitemapのプラグイン設定画面に移動しましょう。
PS Auto Sitemapの設定画面に移動したら
サイトマップを表示する記事の空欄に
先ほどあなたが控えたサイトマップページのID番号を
入力してください。
ID番号が入力できたら、最後に変更を保存をクリックして
設定を保存すれば、サイトマップの設置は完了です。
PS Auto SitemapにID番号を入力し、設定が完了したら
実際にサイトマップページを開き、あなたのサイトマップが
正しく表示されているか確認してください。
無事にサイトマップが表示されていたら完璧です。
あとは、あなたが記事を更新するたびに
このPS Auto Sitemapが自動でサイトマップを更新してくれます＾＾
PS Auto Sitemapの表示スタイルを変更する方法
PS Auto Sitemapで表示される
サイトマップのデザインは全部で14種類あります。
ダッシュボードメニューから
設定 → PS Auto Sitemapをクリックすると
PS Auto Sitemapの設定画面に入れます。
PS Auto Sitemapの設定画面
下の方にあるスタイルの変更という部分から
プルダウンメニューでサイトマップの
デザイン表示を切り替えることが可能です。
デザインのバリエーション全14種類も
ここで紹介しておきますので
あなたのお気に入りのデザインを設定してみてくださいね。
スタイルなし
シンプル
シンプル2
チェックリスト
蛍光ペン
ドキュメントツリー
付箋（ふせん）
音符
矢印
ビジネス
索引
アーバン
アンダーコア
キューブ
以上、これらが全14種類の
サイトマップデザインになります。
少し小さくてわかりにくいかもしれませんが
何となくデザインの雰囲気だけも
わかってもらえると嬉しいです＾＾
PS Auto Sitemapと相性の悪いSTORK！
ここからはWordPressテーマ
STORKを使われている方のみへの補足事項です。
サイトマップを無事作成できたのも束の間
サイトマップのデザインをカスタマイズしようと
PS Auto sitemapの設定を触っていると
なんと、デザインがバグって崩れている！
あなたはお気付きでしょうか？＾＾；
↓ わたしの今のサイトマップのデザインがこれです（索引）
私はサイトマップのデザインを
CSSコードを追加して修正したので
このようにキレイに表示されています。
しかし、PS Auto Sitemapを反映しただけの状態
というのはこんな感じになってしまうんですね…＾＾；
これではさすがのサイト訪問者もサイトマップを
じっくり見ようとは思わなくなりそうなので…
私はこのままでは使いたくないと思い
CSSコードを編集して、この無意味な青い丸と
アンダーラインを消してスッキリさせました。
なので、サイトマップを作り
これら余計なオブジェクトが視覚的に気になるという場合は
CSSコードを追加して表示させないようにしてくださいね。
CSSコードを追加、編集する場合は
ダッシュボードメニューから
外観 → カスタマイズをクリックし
追加CSSのCSS編集コードの部分に
以下のコードをコピペして貼り付けます。
↓ 頭に出る青い丸を消すためのコード
#sitemap_list li:before{
width: 0;
height: 0;
}
↓ リンクのアンダーラインを消す場合はこちら
#sitemap_list li a {
text-decoration: none;
}
私はこれらを両方追加して
それぞれが表示されないように編集しました。
CSSコードについての詳しい説明は省きますが
もしもあなたがSTORKを使っていて
サイトマップを美しく表示させたい場合は
上記2つのコードを足してみてくださいね。
必ずキレイに表示されます＾＾
サイトマップを美しく表示させる方法まとめ
PS Auto Sitemapは最初にもお伝えした通り
HTMLのサイトマップを作成し
サイト訪問者がWebサイトの全体像を掴める
ユーザビリティをとても良くするプラグインです。
サイトマップがあることで、最近書いた記事のみならず
ずっと以前に書いた古い記事も
訪問者に読んでもらえるというのが
サイトマップを作成する大きなメリットでもあります。
また、せっかくサイトマップを用意しても
WordPressのテーマによっては
STORKのようにプログラミングコードが重複し
表示上のバグが出ることもあります。
今回は簡単なCSSコードを追加するだけで
不要な表示を消すことができましたが
バグ表示も気にせずそのまま表示させておくことは
あなたが気にならなくても
サイト訪問者が気になる場合も多いにあるワケです。
もちろん、その逆もしかりなので
必ずしも修正や、デザインのブラッシュアップが必要か？
というと100％必要とは言い切れません。
しかし、あなたがどんなサイトを運営しようと
デザインの細部に無頓着な人の記事というのは
記事の信憑性自体も疑われる可能性もあります。
もしも訪問者にサイトデザインを見て
「この人いい加減そう」と思われたら…
「この記事も適当だろう」と思われる
可能性すらあるんですね＾＾；
なので…
- サイト訪問者のユーザビリティを上げる
- サイトマップも美しく表示させる
これらをちゃんとすることで
あなたのサイトに対する訪問者の信用度も変わります。
もしもあなたがSTORKを使っているなら
サイトマップを作成の際にPS Auto Sitemapを導入したら
ぜひデザインの方もCSSを加えて美しく表示させてくださいね。
とにかくサイト訪問者のユーザビリティを良くすることは
オウンドメディアの運営においてはとても大事なことです。
ぜひこの機会にあなたもPS Auto Sitemapを導入して
ユーザビリティの高い美しいサイトマップに
仕上げてみてくださいね！
最後までお読みいただきありがとうございました！
