ヘッダー
ヘッダの構造
一般的なヘッダ部は次のようになっています。
<!--ヘッダ部================================================================--> <header id="header"><div> <nav id="nav-header" data-module-name="deh_login" data-fix="1"> <span class="admin-links"> <a class="adminmenu login" href="/theme_doc/satsuki-mainheader?login" rel="nofollow">ログイン</a> </span> </nav> <!--タイトル部==============================================================--> <h1 id="page-title" data-module-name="deh_title"> <a href="/theme_doc/">ブログのタイトル</a> </h1> </div></header>
※直下のdivは「どうしてもこれがないと配置できない時」用です。極力使用しないでください。
ログインヘッダーモジュール
- 固定モジュールです。消すことも移動することもできません。
- 「ログインを見えなくする」設定した場合「ログイン」の部分に空白( )が出力されa要素に「erase-login」クラスが出力されます。
ログイン中は次のようなHTMLになります。
<nav id="nav-header" data-module-name="deh_login" data-fix="1"> <span class="welcome"><a href="/" class="welcome-prefix">ようこそ</a><a class="welcome-name">(お名前)</a><span class="welcome-postfix">さん</span></span> <span class="admin-links"> <a class="adminmenu edit" href="/theme_doc/?edit">書く</a> <a class="adminmenu admin" href="/theme_doc/?menu">管理</a> <a class="adminmenu logout" href="/theme_doc/satsuki-base?logout">ログアウト</a> </span> </nav>
- 編集権限がない時は「書く」が表示されません。
- 管理権限があり、そのブログに新着コメントがある時、管理の<a>要素に「newcom」クラスが出力されます。この時base.css内で「!」をつけるように設定されます。
タイトルモジュール
- タイトルモジュールは削除することができますが、基本的には他のカスタムモジュールに置き換えることを想定しているため、ほぼ存在すると思って構いません。
- タイトルの文字の加工や画像への変更、タイトル部の高さ設定、背景変更はデザイン編集から行えます。それらの変更を想定する場合は、テーマ側ではあまり細かな設定を行わない方が良いかもしれません。
検索ボックスモジュール
標準ではサイドバーに検索ボックスを置きますが、タイトルバーに置きたいこともあると思います。
<div id="head-search" data-module-name="deh_searchbox"> <form method="GET" action="/~nabe/adiary/ppp/"> <span class="title">検索</span> <input class="search-box w100" name="q" value="" required="" type="search"> <input class="search-button" value="検索" type="submit"> <span class="search-radio"> <input class="search-title" name="all" value="0" checked="" type="radio"><label>タイトル</label> <input class="search-text" name="all" value="1" type="radio"><label>全文</label> </span> </form> </div>
- 必要に応じて、テーマREADMEでタイトル部に検索ボックスを置くように指示しても構いません。
- 検索ボタンの直後に<br>が存在することもあります(モジュール設定による)。