【Google Blogger】ブログのページナビが味気ないので変えてみました

Bloggerブログのページナビが味気ないので変えてみました。「新しい投稿」「ホーム」「前の投稿」の表記をページ数が出るようにしようと思います。Helper Bloggerサイトには色々なWidgetがあり、今回もその中から探して設置しようと思います。物によっては画像を使用していてリンク先が制作者のサイトだったりするので、スクリプトの画像リンクを自分のサイトに変更したら、画像を少しいじって設定してみました。基本的なWidget設定フローを書きます。自分のサイト用にアレンジ、カスタマイズにも挑戦してみてください。

1. Bloggerアカウントでログイン
まず、自分のBloggerブログにログインしておきます。





2. Helper BloggerサイトのBeautiful Page Navigation Widget For Bloggerページを開く
新しいタブでHelper BloggerサイトのBeautiful Page Navigation Widget For Bloggerページを開きます。





3. ページの下にある「Widget Generator」をクリック
画面をスクロールしていくと「Widget Generator」ボタンが現れるのでクリックします。





4. 「Widget Generator」で自分用に設定
「Widget Generator」でwidgetのセッティングを行ないます。ブログページでのリンク表示の数や「次へ」ボタンの表示等を設定します。





5. 「Generate」ボタン、「Add to Blogger」ボタンを順にクリック
設定が終了したら「Generate」ボタンをクリックします。すると「Add to Blogger」ボタンがアクティブ表記になるので次いでクリックします。





6. Widgetを追加するブログを選択、「ウィジェットを追加」ボタンをクリック
Bloggerのページ要素インポート画面に遷移するので、自分の「ブログを選択」します。「タイトル」欄には何も入れないで「ウィジェットを追加」ボタンをクリックします。





7. Bloggerの「レイアウト」ページで「プレビュー」ボタンをクリック
Bloggerの「レイアウト」ページに遷移します。上の「プレビュー」ボタンをクリックしてどんな感じで設置されているか見てみましょう。





8. Bloggerブログページでイメージを確認
Bloggerブログページの最下部に上記のように新しいページナビが設定されました。これだけの処理でおしまいです。色味（上記の場合は画像が使われている部分があります）や表示ページの数はスクリプトを調整して自分なりにカスタマイズしましょう。