メニューバーの設置方法

メニューバーの設置方法

見ていると、タイトルの下にメニューバーが表示されているブログって沢山ありますよね。
ブログを始めたばかりの僕は、それを見て「自分もこれをやりたい！」と思いました。
そこで色々と調べ、無事にメニューバーを設置することに成功しました。
なので今このブログを見ている皆さんには、メニューバーが見えていると思います。
chatGPTも活用するためほぼコピペで完成します。

1. HTMLコードを作成する

まず、メニューバーを設置するためにはHTMLとCSSというプログラミングのようなものを使用します。
聞き慣れない人からすると難しいかもしれませんが、下記に表示されたものをコピーしていただいて構いません。
簡単に説明するとHTMLは文字情報を表示させるプログラミング、CSSはその文字を装飾するプログラミングです。
ものすごく簡単な説明なので正しく理解したい方は、各自で調べて下さい。
それでは本題に入ります。

<span class="menu-bar"><i class="blogicon-reorder lg"></i>MENU</span>
<ul id='menu'>
    <div class="menu-inner">
        <li><a href='url'>カテゴリ名</a></li>
        <li><a href='url'>カテゴリ名</a></li>
        <li><a href='url'>カテゴリ名</a></li>
        <li><a href='url'>カテゴリ名</a></li>
        <li><a href='url'>カテゴリ名</a></li>
    </div>
</ul>

このコードをコピーします。
コピーしたら管理画面から「デザイン設定」→「ヘッダ」→「タイトル下」にこちらを貼り付け、urlの部分に行き先になるカテゴリーのURLをコピペして下さい。
カテゴリ名のところには、ご自身でカテゴリ分けしているカテゴリ名を書いて下さい。