php16 ヘッダーの作成

前回は「ブラウザのタイトルバー部分」にブログタイトルを表示しましたが、今回は「ページのヘッダー部分」にブログタイトルなどを表示していきます。

ページトップにブログタイトルを追加

<body>
<h1><?php bloginfo(‘name’); ?></h1>
</body>

前回とほぼ同じような記述ですが、今回はページのヘッダー部分に表示するため、body内に記述しました。

ブログの説明文の追加

初期設定時に入力した「ブログの説明文」をブログタイトルの下に表示してみましょう。

<h1><?php bloginfo(‘name’); ?></h1>
<h2><?php bloginfo(‘description’); ?></h2>
</body>

今回は、h2タグを利用しましたが、pタグなどでも構いません。スタイルシートによって変更するとよいでしょう。

トップページのリンク設定

これは必須ではありませんが、ブログタイトル部分にトップページへのリンクを貼ってみましょう。

<h1><a href=”<?php bloginfo(‘url’); ?>”><?php bloginfo(‘name’); ?></a></h1>
<h2><?php bloginfo(‘description’); ?></h2>

この記述を追加したことにより、ブログすべてのページから「トップページ」へ戻ることが可能になります。

ヘッダーをdivでくくる

スタイルシートでデザインしやすくなるよう、ヘッダー部分をdivタグでまとめておきましょう。

<!– ヘッダー部分 –>
<div id=”header”>
<h1><a href=”<?php bloginfo(‘url’); ?>”><?php bloginfo(‘name’); ?></a></h1>
<h2><?php bloginfo(‘description’); ?></h2>
</div>

コメントは必須ではないですが、後日修正しやすいよう、また複数人数での修正の際のため、記述することをお勧めします。

 

関連記事