賢威のメニューバーカスタマイズ~メニューの追加・色の変更など~

メニューバー カスタマイズ

どーも、ダンゴです( ̄▽ ̄)ノ

賢威のPCページのメニューバーは、
デフォルトでは「全記事一覧」だけになってます。

しっかりメニューがあったほうが見やすいと思うので、
今回は、こちらをカスタマイズしてみます☆

 

メニューを追加する方法

メニューバーは、ダッシュボードの「外観」⇒「メニュー」から変更することができます。

 

menubar category

カテゴリーを追加したい場合は、
「カテゴリー」という項目から
追加したいものにチェックを入れて、
「メニューに追加」をクリックすればOKです。

 

menubar link

カテゴリーにないページをメニューに追加したいときは、
「カスタムリンク」というところからURLを入力すればOKです。

 

menubar sakujo

メニューを削除したい場合は、
項目の右側の「▼」をクリックして、
「削除」を押せば消せます。

 

menubar iti

メニューの順番は、「メニュー構造」というところから
ドラッグ&ドロップで変更することができます。

メニューが完成したら、「メニューを保存」をクリックして保存します。

 

menubar keni-settei

メニューが保存できたら、
「賢威の設定」の「グローバルメニューの選択」を
先ほど設定したメニューの名前に変更して、保存すれば
メニューバーが変わります(*^^)b

 

menubar henkougo

デフォルトでは「全記事一覧」だけだったんですが、
こんな感じで新しくメニューが追加されました(*^^)b

 

メニューバーのデザインを変更する

これだとちょっとさっぱりしすぎなので、
ちょっとカスタマイズしてみます☆

編集するところは、
「外観」⇒「テーマの編集」⇒「design.css」の
「グローバルメニュー」という部分。

 

menubar cusutumgo

僕はとりあえずこんな感じにしてみました( ̄▽ ̄)ノ

 

#global-nav #menu li{
	position: relative;
	float: left;
	margin: 0;
	border-right: solid 1px #fff; /*右側のボーダーの色*/
	list-style: none;
	font-weight: bold;
}

#global-nav #menu li.first{ border-left: solid 1px #fff; } /*一番左のメニューだけに追加指示*/

#global-nav #menu li{ white-space: nowrap; }

/*メニューのデザイン*/
#global-nav #menu li a{
	display: block;
	padding: 0.8em 2em;
border-top: solid 1px #dc143c;
border-bottom: solid 1px #dc143c;
	color: #fff; /* メニューのフォントの色*/
	text-decoration: none;
}

#global-nav #menu li a:link,
#global-nav #menu li a:visited{ background-color: #dc143c; } /*すでに訪れたリンクの背景色*/
#global-nav #menu li a:hover,
#global-nav #menu li a:active{ 
background-color: #ff69b4;
color: #fff;
} /*マウスカーソルを乗せた時の背景色*/

参考までに、コードを載せておきますね☆

賢威は注釈がついているので、
比較的わかりやすいと思います(*^^*)

 

ブログランキング参加中!
よければ1日1クリックしていただけると
嬉しいです♪ヾ(´▽`*)ノ
↓ ↓ ↓

 

    管理人プロフィール
    ▼名前:ダンゴ
    ダンゴ プロフィール
    どーも、ダンゴです。

    お酒と漫画とお笑いが大好きな大学生で、現在はネットビジネスとスロットで学費と生活費を稼ぎながら、細々と暮らしてます。

    数年前ブラック企業に内定し、「雇われるリスク」を肌で感じた結果、就職を放棄。

    とはいえ食わねばいけないので、藁にもすがる思いでネットビジネスを始めたところ、毎月10万円以上の収入を生み出すことに成功!

    知識ゼロから月収10万円を稼ぐまでの道のりをメールで紹介していますので、興味があれば登録してみてください☆

    ⇒10万を稼ぐ第1歩


    コメントを残す

    サブコンテンツ

    このページの先頭へ