メイケロのブログ

 メイケロの自宅カフェ

    自宅オフィスをカフェに改装しようとたくらむブログ

コピペで出来る!無料のはてなブログにグローバルナビを設定する方法

 

先日、はてなブログの改造について書いたのですが、 その時にグローバル・ナビを設定した時のメモを残してなかった事に気がついたので、書いておきたいと思います。

 

グローバル・ナビはページのヘッダー画像の下に設置して、同じカテゴリーの記事一覧にすぐに跳べるようにした横一列のボタンです。

f:id:meikellog:20180424182222p:plain

 

通常、グローバル・ナビのそれぞれのボタンから「固定ページ」と言われる年月日を持たないページにリンクします。

 

ところが、無料のはてなブログでは「固定ページ」の設定ができません。そこで、代わりのものをなるべく古い年代の記事として作成します。このブログでは、アーカイブにある2000年に設定している記事が固定ページの代わりになっています。

f:id:meikellog:20180424182502p:plain

 

ちなみに、この方法で「プロフィール」「お問い合わせフォーム」「プライバシーポリシー」などのページも代用出来るので便利です。

 

最後に、以下の2カ所にコードを貼り付けて固定ページにリンクを貼れば、グローバル・ナビの完成です!

 

ダッシュボードの[デザイン] > [カスタマイズ] > [ヘッダ] > [タイトル下]に以下のコードを貼り付け(html)

 

[デザイン] > [カスタマイズ] > [{ }デザインCSS] に以下のコードを貼り付け(css)

 

記事を振り返りやすくなるので、オススメです。ぜひ試してみてください。

 

この記事では、「コピペで出来る!」を実現する為に、綺麗なソースコードを貼り付けることの出来るGistをセットアップをしました。こちらは、僕がよく引用しているまろりかモンスターさんのページを参考にしました。まろりかさんのページは、グラフの書き方とか、webアイコンの使い方とかウェブ制作の中級のテクニックが詳しくてイケてます。あわせてどうぞ。

 

 

読んでくれてありがとうございます。よかったら読者登録をお願いします。