それ、カッコいい！とおもって調べてみました。
サイトマップは、Helplogger様で公開されているスクリプトを使用します。
サイトマップは、Helplogger様で公開されているスクリプトを使用します。
このスクリプトでは、ラベルごとの記事が一覧として取得でき、さらに記事を投稿すると自動でサイトマップに反映される優れものです。
ということで、今回はHTMLのサイトマップの自動生成スクリプトを導入した体験を具体的にわかりやすくまとめて記事にしています。
HTMLの記事一覧のサイトマップとは
サイトマップはブログの投稿記事をラベルごとにソートし表示したものになります。
また、新しい記事には”New！”の文字が付け加えられます。
スクリプトコードの入手方法
スクリプトコードは以下で入手願います。
リンク先の注意事項等をご確認の上ご使用ください。
注意事項
以下の点に注意してください。
以下の点に注意してください。
青文字の”http://helplogger.blogspot.com/”部分はBloggerの自分ブログのURLに変更してください。
例えば、このブログであれば”https://monocotoyom.blogspot.com/”となります。
最近始めた方は”HTTPS（Hypertext Transfer Protocol Secure）”を指定していると思いますので間違えないように書き換えてください。
サイトマップの設置方法
サイトマップの設置は固定ページに追加しましょう。
固定ページの作成
固定ページについてはわからない場合は関連記事を参照ください。
ページ→新しいページ
HTMLビューに切り替えてコードをコピペします。
注意事項
タイトルがURLになりますので、初めは”HTML SITMAP”など半角英数字で記載し、公開した後で、必要であればタイトルを変更し、”更新”を行ってください。
コメント機能を好みで変更してください。
固定ページをブログに設置する。
Bloggerのメインメニューのレイアウトから”HTML/JavaScript”ガジェットか、ページリストに追加しましょう。
このブログでは、ヘッダー部分のページリストに追加しています。
この方法を説明します。
そのままでよければチェックを追加するだけでもOKです。
もし、ヘッダー部に表示するタイトルを記事のタイトルから変えたい場合は、”外部リンクを追加”から追加します。
”外部リンクを追加”→ページタイトル、ウエブアドレス（URL）
ページタイトルや（ウエブアドレス）URLを変える場合は新規に追加し、不要になったほうを削除するしかないようです。
ヘッダーの表示例
ヘッダー部分にページリストに設置した、当ブログでは以下のように動作します。
SITMAPをクリックすると”カテゴリ別サイトマップ”が表示されます。
SITMAPをクリックすると”カテゴリ別サイトマップ”が表示されます。
尚、このブログでは、表示名を変えたいので”外部リンクを追加”で追加しました。
ブログ名の下に入れたかったので文字幅も狭めたくて半角英数字”SITMAP”にしました。
まとめ
以上のように簡単にHTMLの記事一覧のサイトマップを表示させることができます。
ポイントは
- Helplogger様のHow to Create a Sitemap or Table of Contents in Bloggerからコードを入手
- 固定ページにHTMLビューでコードをコピペ
- 固定ページをレイアウトから好みの場所に設置
となります。
編集後記
HTMLの記事一覧は記事の管理にも便利ですね。
しかもなんかカッコいい。
あと繰り返しになりますがコード自体は、リンク先の注意事項等をご確認の上ご使用ください。
ほかにやり方、対処の仕方をご存知の方がいればコメントいてだけると助かります。
また、おなじお悩みを抱えていた方もこの記事で解決できたらコメントいただけるとはげみになりますので、コメントをお願いします！
.png)
.png)
こちらの記事よりサイトマップを使用させていただいております。
返信削除ありがとうございました。
お忙しいところ恐縮ですがひとつ質問させてください。
私のブログのサイトマップには表示されていない記事がいくつかあります。
https://kakimonigoigo1515.blogspot.com/p/blog-page_15.html
たとえば、02棋書の紹介のその1から４です。最初は表示されていました。
もし、おわかりになれば、ご教示ください。
よろしくお願いいたします。
こんにちは！だいぶ遅くなりました。
返信削除上記のリンクは表示できないようでした。
このためリンクできないのかもしれませんね。一度、記事を違うブラウザ（例えばシークレット）などで確認してみるといいかもしれません。