keyboard-453795_1280

Googleが提供する無料ブログサービスに Blogger(ブロガー)というのがあります。無料ブログサービスにはFC2やライブドアブログ、アメブロなどがあります。ほとんどの無料ブログサービスには無料で提供されているブログツールが幾種類もあるのですが、ここではBlogger(ブロガー)で「サイトマップ(記事一覧)を自動で作成する方法」について書きたいと思います。

Blogger(ブロガー)のサイトマップ(記事一覧)を作成するメリット

Blogger(ブロガー)にはブログ管理ページにガジェットと呼ばれるブログツールを利用して、人気記事や訪問者数をサイドバーなどに簡単に表示することが出来ますが、残念なことに自動でサイトマップを作製するガシェットはありません。

ブログの記事が増えてくると、カテゴリーやタグの管理だけでは閲覧者の方が記事を見つけるのに不便になってくることもありますし、ブログ管理者にとっても記事一覧があった方がブログの運営上でメリットがあります。つまりサイトマップがあるとwin-winの関係になるということです。そこで以下のようなサイトマップを簡単に作成できる方法をご紹介したいと思います。
 
サイトマップ

Blogger(ブロガー)のサイトマップ(記事一覧)作製手順

①まずはBlogger(ブロガー)の管理画面にて画面左側の「ページ」という部分を選択します。
②次に「新しいページ」のボタンを押すと下記のような画面が表示されます。

その1


③そして新しいページを作成する画面が表示されます。下記の画像のページです。ここで注意したいのは、画面を表示した時は「作成」が選択されていますので、必ず「HTML」をクリックしてください。 さらに作成したページにタイトルを付ける必要がありますので、ここでは「サイトマップ」とします。

その7


④最後に以下のhtmlコードを貼りつければ完成です。

<script type="text/javascript">
var POSTSTOC_SETTINGS = {"blogURL":"igaito.blogspot.jp/","sort":{"key":"title","order":"default"},"printby":"title"}
</script>
<link rel="stylesheet" type="text/css" href="http://garafu.github.io/blogger.toc/release/latest/simple.css" />
<script type="text/javascript" src="http://garafu.github.io/blogger.toc/release/latest/blogger.toc.min.js"></script>

尚、貼りつけるhtmlコードの作成方法は当画面の下の方に説明しています。
htmlコードの赤文字の部分をあなた様のブログのURL(ドメイン)に置き換えれば、それで終了ですが、サイトマップに日付等を入れたい場合は、htmlを作成してカスタマイズできるページのリンクを一番最後に設置していますので、そちらから参照して下さい。


⑤次にブログ管理画面の左側にある「レイアウト」を選択して、「Cross-Column」にある「ガジェットを追加」ボタンををクリックします。

その3


⑥そして、ガジェット追加ボタンを押してからガシェットの「ページ」を選択します。

その4

ここまで終わればあともう少しです。

⑦次にもう一度、管理画面左側から「レイアウト」を選択して「Cross-Column」の編集ボタンをクリックします。

その6

⑧そして最後に、先程作成したページ「サイトマップ」を表示させるためにボックスの中にチェックを入れると完成です。これで当サイトと同じような「サイトマップ」ボタンがブログタイトル下に表示されるようになります。これですべて完成です。

その5


Brogger(ブロガー)の自動サイトマップhtmlをカスタマイズする方法

下記のページよりhtmlを簡単にカスタマイズできます。


Your blog URL という場所にあなた様のブログURLを入れることによって、日付等を入れたり、ソートする順番を変更したり出来ます。尚、入力するブログのURLはhttp://以降のアドレスを入力してください。つまりhttp://は不要ということです。ブログURLを入れた後に、「open window」ボタンを押せば、htmlコードが表示されます。英語表記ですがちょっと触れば、直感で分かる仕様となっています。

スポンサーリンク