ヘッダー

ヘッダの構造

一般的なヘッダ部は次のようになっています。

<!--ヘッダ部================================================================-->
<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は「どうしてもこれがないと配置できない時」用です。極力使用しないでください。

ログインヘッダーモジュール

  • 固定モジュールです。消すことも移動することもできません。
  • 「ログインを見えなくする」設定した場合「ログイン」の部分に空白(&nbsp;)が出力され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>が存在することもあります(モジュール設定による)。
OK キャンセル 確認 その他