こんにちは、りゅうやん。です！
ブログを見るときに、カテゴリーの一覧からさがすと思います。
それ以外にも、サイトマップ（すべての記事一覧）から特定の記事をさがすことだってあるかもしれません。
ぼくのブログでは、意外にもサイトマップへのアクセスもけっこうあります。
でも、WordPressのプラグインに頼らずに、サイトマップをつくってみたいなーと思って、ネットサーフィンをしてたところ…、
イイ感じのを発見したのです！
そこで今回は、WordPressのプラグインを使わずにサイトマップをつくることができたのでまとめてみました！
- CSSを使ったブログのカスタマイズがしたい！
- プラグインの数を減らしたい！
参考にした記事
↑の記事でまつみさんが紹介しているものを、ぼくもまるまるコピペで使わせてもらってます。
このブログのサイトマップは、↓こんな感じですになってます。
事前準備として
①カスタマイズには子テーマを使う
ブログをカスタマイズするときは、必ず子テーマを使います。
なぜなら、親テーマがアップデートして仕様が変わっても、子テーマでカスタマイズした内容は消えないからです！
もし、親テーマでカスタマイズすると、テーマをアップデートしたときにカスタマイズや設定がリセットされてしまいます。
②バックアップをとっておく
今回のカスタマイズでは、pafe.phpを編集するので、事前にバックアップ取っておいてくださいね！
カスタマイズによってサイトが真っ白になっても、エックスサーバーを使っているのであれば、↓のやり方で復旧させることができるので、ご参考に！
③子テーマにpage.phpをつくっておく
これはテーマによるかもしれませんが、たぶん、子テーマに最初からpage.phpはないと思います。
なので、このカスタマイズには子テーマのなかにあるpage.phpが必要なので、前もってつくっておいてくださいね！
つくりかたは、↓の記事を参考にしてください。
この記事では、子テーマにsingle.phpをつくる内容ですが、この部分をpage.phpに変えるだけでいいので難しくはないと思います。
もちろん、子テーマにつくったpage.phpのなかに入れるファイルは、親テーマにあるpage.phpを全部コピペですからね！
一部だけとか、別の〇〇.phpを入れるとサイトが真っ白になるので、そこだけは注意してください！
④サイトマップ用の固定ページをつくっておく
サイトマップをつくりたくてCSSだけ入力しても、それを表示するページがなければいけませんね。
固定ページで新しくつくってくださいよ。
もし、プラグインとかでサイトマップ用の固定ページがあるならば、それを使っても問題はありません。
固定ページのパーマリンク設定は、自分のURLの末尾をsitemapにしてくださいね。
【例】https://〇〇〇.△△/sitemap
もし、もともとあるページのパーマリンクが、sitemapではなくてsite-mapやsitemapsとかでも、コピペするCSSの記述を変えればいいので、ここで無理に変えなくても大丈ですよ！
サイトマップのつくりかた
①子テーマのpage.phpをひらく
ワードプレスのダッシュボードから、
外観 → テーマの編集
と進んで、使用テーマの子テーマのpage.phpに入ります。
くれぐれも、別のシートに入らないようにしましょうね！
②シートのなかから「<?php the_content(); ?>」をさがす
page.phpのなかに入っても、好きな場所に貼りつけていいわけではありません。
<?php the_content(); ?>
と表記されているのものをさがします。
ぼくが使っているWordPressテーマのJINだと、上からだいたい30行めよりちょい下くらいにあります。
③「<?php the_content(); ?>」の下にCSSを貼る
<?php the_content(); ?>
がある下に、以下のCSSをコピペします。
<?php if (is_page('sitemap')) { ?>
<h2>サイト情報・お問い合わせ先</h2>
<ul>
<?php wp_list_pages('title_li='); ?>
</ul>
<h2>記事カテゴリー別</h2>
<?php
$args=array('orderby' => 'name', 'order' => 'ASC' );
$categories=get_categories($args);
foreach($categories as $category) {
echo '<h3><a href="' . get_category_link( $category->term_id ) . '" title="' . sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' . $category->name.'</a> </h3> ';
?>
<ul>
<?php
global $post;$myposts = get_posts('numberposts=100&category=' . $category->term_id);
foreach($myposts as $post) : setup_postdata($post);
?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>
</ul>
<?php }; ?>
<?php }; ?>
つまり、
……
<?php the_content(); ?>
<?php if (is_page(‘sitemap’)) { ?>
<h2>サイト情報・お問い合わせ先</h2>
<ul>
<?php wp_list_pages(‘title_li=’); ?>
</ul>
<h2>記事カテゴリー別</h2>
<?php
……
こんな感じになる
2行めにある、h2タグで囲っている言葉（ここではサイト情報・お問い合わせ先）は変えることができます。
ここは固定ページが一覧で表示されるので、それに合った言葉を入れるといいかもしれません。
また、7行めにある、h2タグで囲っている言葉（ここでは記事カテゴリー別）も変えることができます。
ここにはカテゴリーごとにすべてが一覧で表示されます。
事前準備の④で出てきたパーマリンクのはなしですが、1行めに書かれている
<?php if (is_page(‘sitemap‘)) { ?>
で、sitemapとなっている部分にひもづいてます。
なので、固定ページのパーマリンクがsite-mapやsitemapsのときは、これと同じ文言（つづり）でsitemapを書き換えればいいのです。
さいごに動作確認を
page.phpを編集したので、
- サイトが真っ白になってないか？
- 設定通りに、サイトマップが表示されているか？
- 他に不具合が出てないか？
以上を確認してください。
問題がなければ、カスタマイズは終わりです！
おつかれさまでした～！
まとめ
プラグインを使わず、CSSだけでサイトマップをつくりました。
実際にやってみると、意外とかんたんにできてしまったのでよかったです！
ブログの回遊率やユーザビリティを考えたら、サイトマップは必要だと思います。
プラグインに頼りたくないけど、サイトマップは導入したいと考えている人は、ぜひ挑戦してみてくださいね！
最後まで読んでいただきありがとうございました！
ではでは(^_^)v
好きなURLを使いたい！
ブログやサイトを作るとき、独自ドメインは必要不可欠！
レンタルサーバーならココ！
ワードプレスでブログやホームページを作るなら、レンタルサーバーはエックスサーバー！
