読者です 読者をやめる 読者になる 読者になる

Apple In

Apple関連のネタやアプリなどを分かりやすく解説しています♪ Mac初心者さんもどうぞ御覧ください♪

MENU

はてなブログのカスタマイズ(2)グローバルメニュー

はてなブログカスタマイズ

はてなブログのカスタマイズをいろいろと試してみたいと思います


自分自身,HTMLやCSSなどが詳しいわけではないので,他の方のサイトからハックしながら試行錯誤してみました
今回はグローバルメニューです

はてなブログを始めた方で,あまり詳しくない方への参考程度になればと思っています

 グローバルメニュー

いろんな方のはてなブログを見てみるとグローバルメニューを設置している方は多いようです

それじゃワタシも!と思い設置してみました

 

 

CSS MenuMaker | HTML, CSS, & jQuery Menus

 

このサイトで簡単に作れるのですが,以前は無料だったのですが,現在は有料になっています

非常に残念です

 

参考させていただいたサイト

wedges.hatenablog.com

 

今回参考させていただいたのはWedgesさんのサイトです

非常にわかりやすく解説してありましたので,参考になりました

ありがとうございます

 

HTMLを書き換える

ダッシュボードデザインカスタマイズ(スパナアイコン)ヘッダタイトル下

ここにメニューを書き込みます

<li><a href='カテゴリーのURL'><span>タイトル</span></a></li>

ここを追加,削除で増やしたり減らしたり出来ます

しかし,増やし過ぎると一列で収まらなくなりますので注意して下さい

 

CSSを追加する

上記のままではデザインされていませんのでCSSを追加します

ちなみにデザインは上記のWedgesさんのコードを参考にしました

これはcssmenumaker.comからもらってきたものだということです

現在は有料になっているので管理人はパクらさせていただきました

 

ダッシュボードデザインカスタマイズ(スパナアイコン)デザインCSS

 

 長いようですが,スタイルを変更するわけではなく色を変更するだけですので,難しくはありません

色の変更は2色を変更しました

border-top: 1px solid #ed9945;
background: #4599ed;

 


テキストエディタで展開し,文字色#ed9945と#4599edを検索,一括変換で変更しただけです