NetCommons Test and Study Site


  Product By K.Nagai
 
 

メニューテンプレートのボタンを変える

NCのメニューボタンの画像では不満という場合、かなり手抜きであるが、以下の方法で簡単に出来る。但し、テンプレートの名前はそのままで、画像だけ変えてしまう方法。どうせ使わないテンプレートボタンなら、それを使ってしまうと言うわけ。
(当サイトは、下記の方法でボタンを変えている)
1.まず使わないメニューテンプレートを決める。
 メニューテンプレートheader_150x32_black を変える場合
2.変えたいボタンを2個作成する
 1つは、初期表示ボタン もう1つは、マウスオーバー時のボタン
3.2つのボタンを「上下にくっつけた」ボタンを作る、
 ファイル名は、「btn.gif」
 width:150px; height:64px の画像 → 図A を参照
 上部が初期ボタン、下部がマウスオーバー時のボタンになる
4.出来た画像を以下に上書きアップロード
 webapp/modules/menu/files/images/header_150x32_black
5.管理画面から
「モジュール管理」→「管理系モジュール」→「一括アップデート」
図A
 
尚、上記と同じフォルダに「bg_ul.gif」という、幅2px高さ32pxの画像ファイルがある。このファイルは、メニュー表示する部分のhtmlファイルが読み込むCSSファイルの中に記述されていて、その内容は、
「background:url(<{$smarty.const.CORE_BASE_URL}>/images/menu/header_150x32_black/bg_ul.gif) repeat-x left top;」
このことから、メニューを横に並べた場合、メニューブロックのサイズ幅指定がメニュー幅の合計がより長い場合、前後に同じ色のメニュー領域が作成される、それに使う画像と思われる。
注意
上記の方法で全てのテンプレートに適用出来るわけではない。
確認済みは、Header_150x32_black, blue, cherry, gray, green, orange 以上6種
 
Copyright(c) 2010 K.Nagai All Rights Reserved.