【はてなブログ】タイトルの下にナビゲーションメニューを設置(Minimalism対応)

ナビゲーションメニュー

はてなブログのタイトル下にナビゲーションメニューを設置するカスタマイズ方法（Minimalismに対応）

はてなブログのタイトル下に、
ナビゲーションメニューを設置するカスタマイズ方法を紹介します。
テーマ「Minimalism」に対応しています。

スマホ表示では、横にスライドします。

はてなブログのタイトル下にナビゲーションメニューを設置するカスタマイズ方法（Minimalismに対応）

参考にしたサイト

hitsuzi.hatenablog.com
h2ham.net

具体的な手順

設定　＞　デザイン　＞　カスタマイズ　＞　ヘッダ　＞　タイトル下
の部分に、下記のコードを追加します。

※URL、文字の部分は自身のブログに合わせて修正が必要です。

<nav id="gnav">
	<div class="gnav-inner" id="menu-scroll">
		<div class="menu"><a href="https://XXXXXXXXXXXXX.hatenablog.com/"><i class="fa fa-home" aria-hidden="true"></i> HOME</a></div>
    <div class="menu"><a href="https://XXXXXXXXXXXXX.hatenablog.com/XXXXXXXXXXXXX"><i class="fa fa-info-circle" aria-hidden="true"></i> ABOUT</a></div>
    <div class="menu"><a href="https://XXXXXXXXXXXXX.hatenablog.com/XXXXXXXXXXXXX"><i class="fa fa-desktop" aria-hidden="true"></i> メニュー1</a></div>
    <div class="menu"><a href="https://XXXXXXXXXXXXX.hatenablog.com/XXXXXXXXXXXXX"><i class="fa fa-wrench" aria-hidden="true"></i> メニュー2</a></div>
    <div class="menu"><a href="https://XXXXXXXXXXXXX.hatenablog.com/XXXXXXXXXXXXX"><i class="fa fa-envelope" aria-hidden="true"></i> CONTACT</a></div>
	</div>
</nav>