headerphpФайл header.php отвечает, как мы говорили, за вывод служебной инфоромации, подключения скриптов (в общем, всё что в <head></head>), а так же шапки нашего сайта.

Прежде чем писать, я набросал на листочек, примерную вёрстку шаблона, точнее её основные блоки. Многие, да что там многие, почти все, сначала верстают шаблон, лишь потом «надевают» его на wp. Мне же удобнее наоборот. Не стоит так же забывать и о кроссбраузерности, например, скачать опера мини и проверить как будет выглядеть шаблон не только на ПК, но и на телефоне.

Сначала разберёмся с «головой»…потом же оденем на неё шапку)

Ну что ж, давайте посмотрим код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
	<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<title>
<?php bloginfo('name'); ?>
<?php if(is_home()) { ?>
 - <?php bloginfo('description'); ?>
<?php } ?>
<?php if(is_single()) { ?>
<?php wp_title(); ?>
<?php } ?>
<?php if(is_404()) { ?>
 - Страница не найдена
<?php } ?>
<?php } ?>
</title>
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
	<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head(); ?>
	<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/tabs.js"></script>
</head>

И так, что же тут за функции. Владея даже минимальным английским я думаю не сложно понять что они значат, но всё таки, вот что они нам возвращают

<?php language_attributes(); ?>

Данная функция возвращает нам информацию о языке сайта и о стране, в которой он находится.
В нашем случае она нам возвратила ru-RU в формате язык-СТРАНА

<?php bloginfo('html_type'); ?>
<?php bloginfo('charset'); ?>

Следующие две функции находятся в теге. Первая – параметр
http-equiv=»Content-Type»
вторая же определяет кодировку нашей страницы.
В нашем случае получается так

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

Идём дальше

<?php bloginfo('stylesheet_url'); ?>

Возвращает нам путь в файлу стилей шаблона.

<?php bloginfo('name'); ?>

Возвращает нам название нашего сайта.
Встречается в шаблонах достаточно часто, в нашем же случае, функция прописана в заголовке страницы RSS подписки, но учтите, некоторые плагины, например All in One SEO Pack переписывают заголовки (title) страниц, поэтому атрибут title в этом случае не нужен.
В нашем случае Immaker
Дальше у нас идёт код в теге title (заголовок страницы), в нашем случае он будет несколько динамичен ( !!! Плагин All in One SEO Pack переписывает все заголовки, если вы собираетесь его использовать, не пишите этот код, а довольствуйтесь только первой строчкой)

<?php bloginfo('description'); ?>

Возвращает описание сайта, которое прописывается в админке.

<?php wp_title(); ?>

Выводит заголовок записи
Теперь немного расскажу вообщем что «делает» этот код.
Заголовок нашей страницы формируется из 2х частей, первая, это название сайта, возвращаемое функцией bloginfo(‘name’);, вторую часть можно прочитать так
Если домашняя страница, то возвращается Описание сайта;
Если это страница записи, то выводится заголовок записи;
Если это страница ошибки 404, то выводится — Страница не найдена
—надеюсь объяснил понятно =) идём дальше

<?php bloginfo(’rss2_url’); ?>

Возвращает нам адрес нашего RSS фида. Если же вы используете, например, FeedBurner, то прописывайте сюда адрес фидбёрнера.
Возвратило нам href=»http://…/?feed=rss2

<?php bloginfo(’pingback_url’); ?>

Задаёт путь к XML-RPC файлу, который отвечает за оповещение других сайтов, о том, что вы на них сослались.
Возвратило нам href=»http://…/xmlrpc.php
!!! Это лишь те функции, которые используются в нашего шаблона, естественно их больше, остальные я упомяну в конце статьи.
Я не зря разбил статью на и header, давайте немного коснемся вёрстки, и вспомним про листочек, про который я говорил в начале статьи.
Я набросал следующую структуру нашего шаблона

Далеко данный «листочек» не убираем, он нам ещё пригодится, а пока что касается header.php. В header.php у нас пойдёт всё, что находится в блоке header, ну так давайте напишем, продолжаем наш код

<body>
<div id="wrapper">
	<div id="header">
		<div id="logo">
			<a href="<?php echo get_option('home'); ?>/" title="<?php bloginfo('name'); ?>"><img src="<?php bloginfo('template_directory');?>/images/logo.png" /></a>
			<p><?php bloginfo('description'); ?></p> 
		</div><!--logo-->
		
		<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar('Баннер в шапке') ) : else : ?>
		<?php endif; ?>
	<div id="header-bar">
	<div id="menu">
	<li<?php if(is_home()) echo ' class="current_page_item"' ?>><a href="<?php bloginfo('url'); ?>/"><span>Главная</span></a></li>
	<?php w3l_tl_pages($before = '', $between = '', $after = '', $exclude = '', $inbefore = '<span>', $inafter = '</span>') ?>
	</div><!--menu-->
	<div class="search">
	<form class="searchform" method="get" action="<?php bloginfo('url'); ?>/">
	<input type="text" value="Что ищем?" name="s" class="searchinput"onblur="if(this.value.length == 0) this.value = 'Что ищем?'" onfocus="if(this.value == 'Что ищем?') this.value = '' " />
	<input type="submit" value="" class="searchbutton" />
	</form>
	</div><!--search-->
	</div><!--header-bar-->
	</div><!--header-->

Вёрстка тут довольна проста, и думаю вопросов не возникнет, поэтому перейдём к коду, а именно к тем функциям, которые мы ещё не обговорили.

<?php echo get_option('home'); ?>

Данная функция возвращает нам адрес нашего сайта, в формате http://сайт.ru следовательно если вы в какую-нибудь ссылку захотите вставить адрес какой либо страницы, то после функции следует добавить слеш, и продолжить адрес, например чтобы зайти на страницу контактов, достаточно прописать так

<a href="<?php echo get_option('home'); ?>/contacts"

Немножко отвлеклись, идём дальше)

<?php bloginfo('template_directory');?>

Возвращает нам, как вы поняли, адрес нашего шаблона, если вы где либо указываете адрес к картинке вашего шаблона, или же указываете адрес какого либо JavaScript’а, то используйте данную функцию.
Далее мы видим такую конструкцию

<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar('Баннер в шапке') ) : else : ?>
<?php endif; ?>

она у нас отвечает за вывод нашего баннера, конечно можно и жёстко прописать код баннера, но мне как то по душе делать так, чтобы пользователь не лез зря в код шаблона, и не правил его в ручную, мало ли что, поломает =) поэтому код баннеров в моих шаблонах задаётся в админке.
В этом шаблоне я сделаю через виджет (т.е. пользователь зайдёт в виджеты, увидит поле ‘Баннер в шапке’ вставит туда текстовый виджет с кодом баннера, и всё будет отлично), В следующих статьях мы сделаем ЕЩЁ УДОБНЕЕ) и сделаем так, чтобы баннеры задавались на отдельной странице с настройками нашей темы, подписывайтесь на рассылку, и вы точно не пропустите.
Далее у нас идёт навигация по страницам, в wordpress есть стандартная функция, которая выводит страницы, но выводит она их в формате

<li><a href=”#”>страница</a></li>

Что не всегда бывает удобно, при оформлении сайта, поэтому мы заменим эту функцию на более удобную для вёрстки, которая будет выводить нам следующее

<li><a href=”#”><span>страница</span></a></li>

Вторым же недостатком данной функции, является то, что она не выводит главную страницу, на этот случай, в wordpress используется следующая конструкция

<li<?php if(is_home()) echo ' class="current_page_item"' ?>><a href="<?php bloginfo('url'); ?>/"><span>Главная</span></a></li>

«Читается» так, если это домашняя страница, то добавить класс current_page_item (данный класс используется в wordpress, и автоматически добавляется тегу li страницы, на которой находится посетитель). Адресом ссылки, как мы уже знаем, является адрес нашего сайта.
Ну и собственно изменённая функция вывода страниц (Для начала давайте напишем обычную функцию вывода страниц, впоследствии я напишу подробный пост об этой функции, и тогда сможем поменять её обратно.)
Обычная функция вывода страниц wp_list_pages();
Впишем несколько аргументов, пусть даже они нам и не пригодятся потом, но чтобы они не «портили» нам код

wp_list_pages(‘title_li=&depth=1’);

По умолчанию, функция заключает список к теги <ul></ul>, если же прописать

title_li=

а именно пустой заголовок, то функция не будет заключать в тег. Второй же параметр определяет иерархичность списка, при равном 1, он будет выводить только первых родителей, без дочерних страниц.
Ну и последнее что мы тут видим, это форма поиска.

action="<?php bloginfo('url'); ?>/"

Параметр action указывает на файл, который будет обрабатывать нашу форму. И как мы видим это адрес нашего сайта.
Ну и уж как маленький аксессуарчик нашей формы поиска, кусок кода

onblur="if(this.value.length == 0) this.value = 'Что ищем?'" onfocus="if(this.value == 'Что ищем?') this.value = '' "

Данный код, делает следующее, при помещении курсора в форму, изначальный слова Что ищем? Пропадают, и остаётся пустое поле для ввода, если же при пустом поле, мы убираем курсор ввода, то у нас снова появляется надпись Что ищем? .
Примечание: значение value и значения в скобках в this.value должны быть полностью идентичными, иначе скрипт не будет работать.
Что касается функций, которые есть, но не вошли в наш файл, по мере того как мы делали остальной код, некоторые всплыли, остались лишь эти

<?php bloginfo(’version’); ?>

Возвращает версию вашего wordpress, использовать это крайне не рекомендуется, т.к. это немного облегчает жизнь хакерам.

<?php bloginfo(’stylesheet_directory’); ?>

Возвращает путь к каталогу файла стилей, сколько делал шаблоны, ни разу не встретил)
Есть ещё пара функций, но обещаю, они вам точно не понадобятся, поэтому смело позволю себе их опустить.

Ну вот впринципе и всё, что касается header.php. Увидимся в следующей статье.