記事の詳細

ロボット用ではなく、人間用のサイトマップがほしい

今回は、WordPressを使ったホームページに、ユーザーが使いやすいサイトマップを追加することができるプラグインのご紹介です。

ロボット用のXMLサイトマップは、SEOのことなどもあり用意されることが多いですが、
今回は、ホームページにアクセスしてくれたユーザーの方のためにサイトマップを用意することで、
コンテンツが増えても、目的のページが探しやすいように、ユーザーの方に使いやすいようにしていきます。

その一方で、コンテンツの増減がしやすいWordPressの性質を考えると、
手動でサイトマップを整備していくのは、とても大きな手間になってしまいます。

そこで、自動でサイトマップを生成することで、
ユーザーにとっても、管理者にとっても便利に手軽になるプラグインを使用したいと思います。

インストールしてみましょう

・管理画面のプラグイン新規追加から「PS Auto Sitemap」で検索して追加しましょう。
(今回、WordPressのバージョンが4.5.2で、テストされていないバージョンを使用しています。
一応使用できているようですが、環境によっては問題が出る可能性がありますので、ご注意ください。)
ここからダウンロードしたものを、アップロードすることもできます。
ps_auto_sitemap

まずはページを作ってみましょう

サイトマップの設定を行うにあたって、表示する固定ページが必要になります。
本文に下記コードを入力し、保存してください。

<!-- SITEMAP CONTENT REPLACE POINT -->

ps_auto_sitemap

保存後のアドレスに固定ページの記事ID(アドレスバーの &post=nn )が表示されるので、これをメモしておいてください。
[短縮 URL を取得]からでも数字が取得できます。

サイトマップを表示できるように設定します

プラグインを有効化すると、左側のメニューの「設定」に「PS Auto Sitemap」が追加されるので、
ここから設定を行っていくようになります。
ps_auto_sitemap3
「サイトマップを表示する記事」のところに、先ほど作った固定ページの記事IDを入力してください。
これで紐づけられて表示できるようになります。

先ほどの固定ページにアクセスすると表示されます

以上で設定ができましたので、
固定ページにアクセスすると、サイトマップが表示されるようになります。
ps_auto_sitemap4

設定のところから、改装制限やスタイルの変更などができるので、
環境に応じて、設定を変更してみてください。

スタイルを変えてみよう、調整してみよう

設置するにあたり、スタイルを当てはめてみました。
簡単にデザインが当てはまりましたが、
バージョンが違うためか少しデザインが崩れてしまっていたので、調整してみました。

今回は「ドキュメントツリー」のスタイルを設定している場合です。
調整前は、フォルダのアイコンがかけていたり、リンクのアンダーラインが気になるので変更してみます。
ps_auto_sitemap10

プラグイン編集から「PS Auto Sitemap」を選択し、
「ps-auto-sitemap/css/ps_auto_sitemap_document.css」を編集していきます。

まず、アイコンの位置を調整します。
39行目あたりに下記ソースがありますので、2行目の最後0.7emになっていたところを0.3emに変更しました。好みに合わせて数字は変更してみてください。


#sitemap_list ul {
	background: url(../images/document/ico_folder.png) no-repeat 0 0.3em;
	padding: 0;
	margin: 0;
}

続いて、アンダーラインを消してみます。
本体の設定で影がついているので、サイトマップの中にあるAタグには影をつけないように、
下記を追加して、処理を上書きします。書く位置はどこでも大丈夫です。


#sitemap_list a{
    box-shadow: none;
}

これで調整ができて、スッキリ見やすくなりました。
ps_auto_sitemap11

他のスタイルも微妙に調整したいところがあったり、
ガラッと違うスタイルを当てはめたいこともあると思いますので、色々試してみてください。

ホームページ制作・改善・販促のお問い合わせは、浜松市中区のGeoDesignへ

お問い合わせはこちら

お問合せフォーム

GeoDesignのできること

GeoDesignサービス

ウェブマーケティング成功事例

 
お名前(姓)
e-mail(必須)

マーケティングのヒントや、ウェブサイトを運営するために必要な情報を不定期でお届けしています。
あなたのウェブサイトを一歩進めるためにご活用ください。

株式会社GeoDesign(ジオデザイン)エントランス

〒430-0929
静岡県浜松市中区中央2ー4ー22
サザンビル(駐車場あり)

サービス対象地域

東京都23区
名古屋市,豊橋市
静岡県西部
浜松市中区,浜松市南区,浜松市東区,浜松市西区,浜松市北区,浜松市浜北区,浜松市天竜区,磐田市,袋井市,掛川市,菊川市,島田市,藤枝市,湖西市
ホームページ制作に関するお問い合わせ

ホームページの活用、集客に関するお問合せ

お問合せ Geoレターを受け取る Twitter Facebook