Cocoon版サイトマップの作り方とコピペに注意！

wordpressにある無料テーマ「Cocoon」での、サイトマップの作成方法と注意点についての記事です。

ここでいうサイトマップとは、ページに作成するものを対象としています。プラグインではなくHTMLページの方ですね。

僕が実際にサイトマップを作った際に、正しく表示がされていなかったことがありました。

どういう状況かというと、行間が広くなんだか間延びしていたのです。同じような状況になった方いませんか？

その時の解決方法は「ショートコード」に入力する、です。

当たり前のようですが、コピペで作成された場合は正しく表示されないこともあるので注意が必要です。

そんなサイトマップの作成について解説します。

サイトマップとは

まずサイトマップとは何かというと、一つのページ内でブログの記事やカテゴリーなどが一目でわかるものです。

これは見に来てくれた方が、欲しい情報に簡単にアクセスできることにもつながります。

マップとあるように、ホームページやブログの地図と言ってもいいのかもしれませんね。

このサイトマップは、プラグインで作成する方法もありますが、Cocoonの場合は簡単なものではあるものの機能が備わっています。

サイトマップの作り方

一般的にサイトマップは固定ページに作成します。

固定ページの新規追加からページを作成しましょう。

タイトルに「サイトマップ」と入力します。

ショートコードを設置したら半角文字で「［sitemap］」と入力します。

記事では「［ ］」の部分を大文字で入力していますが、これは記事内にサイトマップを作られてしまうのを防ぐためです。

スラッグを設定して下書き保存後、プレビューで確認しましょう。

問題なければ「公開」します。

サイトマップを配置する場所は、ヘッダーメニューかフッターメニューでいいと思います。

サイトマップは自動的に更新されるので、後から編集する必要はありません。

本文に「［sitemap］」を半角文字で入力してもサイトマップは作成できます。ですが「ショートコード」を設置する方が良いでしょう。その方が「ここにショートコードを貼り付けた」と認識しやすいと思います。

コピペに注意！

ここでの注意点ですがコピペした場合、このようになっていたら正しく表示されません。

プレビューで確認してみると、サイトマップは表示されるものの、行間が広くなんだか間延びした感じなってしまいます。

よく見ると本文に入力されているブロックは「整形済みテキスト」になっています。

はっきりとした原因は分かりませんが、コピーした時点で何らかの書式設定が含まれているのだと思われます。

本文にコピペされたものが、テキストか画像か等を自動的に認識するのでコピー元によっては、こちらの意図とは違うことも起きるようです。

なのでショートコードを配置して、その中に半角で入力しましょう。もちろんペーストした時点で、ショートコードと認識されて貼り付けられていれば大丈夫です。

オプションについて

「［sitemap］」と入力した場合、作成される項目が「固定ページ」「投稿一覧」「カテゴリー」の３つが自動的に作成されます。

もう一つ「月別アーカイブ」も用意されていますが、オプションの設定で表示することができます。

それぞれ対応するオプションは次の通りです。

• 固定ページ：page
• 投稿一覧：single
• カテゴリー：category
• 月別アーカイブ：archive

これを表示するかしないかは「1」か「0」の値で制御します。

• 表示する：1
• 表示しない：0

入力例：page=1（ ←「固定ページを表示する」ということになります）　

つまり「［sitemap］」と入力すると「［sitemap page=1 single=1 category=1 archive=0］」の内容と同じということです。

好きなものを組み合わせて表示してみましょう。もちろんデフォルトのままでも十分だと思います。

まとめ

「［sitemap］」を入力するだけで簡単にサイトマップが出来上がります。しかも更新は自動的にやってくれます。

コピペで入力する場合、コピー元によっては正しく表示されないこともあるので注意しましょう。

「ショートコード」を設置してから入力する方が良いでしょう。

サイトマップは見に来てくれた方が、知りたい情報にアクセスしやすくなる効果が期待できます。

Cocoonには簡単にサイトマップを作成できる機能が備わっていますので助かりますね。

この記事はCocoonの作成者であるわいひらさんのマニュアルを参考にさせていただきました。

読んでくれた方の参考になれば幸いです。