Тема для Wordpress: Header

Создание файла заголовка для сайта (header.php).

Название страницы

Так как заголовок совместно используется домашней страницей, страницей, категорией или другим типом страницы, заголовок должен быть привязан к типу, который выполняется списком условий в PHP. 

<title>
<?php 
if(is_404())                { _e('Page not found', ''); } 
elseif (is_home())      { bloginfo('description'); echo " - "; bloginfo('name'); } 
elseif (is_category()) { echo  single_cat_title(); }
elseif (is_date())       { _e('Archives', ''); echo " of "; bloginfo('name'); }
elseif (is_search())    { _e('Search results', ''); } 
else the_title(); 
?>
</title>

Учитываются следующие случаи:

Мета-описание изначально не учитывается Wordpress. Она зависит от каждой статьи. Для его создания требуется расширение типа All in seo.

Метас

Они касаются типа документа, таблиц стилей, имен RSS-файлов. Соответствующую информацию дает административная панель (по выбору темы и в опциях), и, как видно из источника header.php, она встроена инструкциями PHP.

Пример:

<link rel="stylesheet" type="text/css" media="screen,projection"
   href="<?php bloginfo('stylesheet_url'); ?>" />

Верхняя часть страницы

<body  class="hfeed">

<div id="header">
<div id="logo"  onclick="location.href='<?php echo get_settings('home'); ?>/';"></div>
<div id="navbar"> 
   <span id="navcat">
    <?php wp_list_categories('title_li=&sort_column=name&hierarchical=1') ?>
    </span>
    <span id="navpage"><a href="about">About</a></span>
</div>

Тег body открывается в файле header.php и закрывается в файле footer.php.

Заголовок в нашей демонстрации состоит из логотипа и навигационной панели.
Она не содержит названия сайта в теге H1, как это часто можно увидеть в темах, что является отклонением с точки зрения ссылок (недостатки первых тем повторяются во всех остальных, которые их просто повторно используют и изменяют).

Категории на панели навигации

Мы выбрали размещение списка категорий на панели навигации, что подходит, пока их не будет слишком много.

Это легко делается с помощью функции wp_list_categories и правил CSS. Функция отображает их в виде вертикального списка с маркерами. Но CSS-дескриптор id navcat превращает его в простой горизонтальный список.
Параметр title_li= без значения отменяет заголовок категории.

Справа размещается ссылка на статическую страницу «О» или «Сайт», описывающая цель сайта и условия использования.

Знамя

Главное в графике в теме Cryonie - в заголовке страницы. Он имеет следующую структуру :

<div id="header">
   <div id="logoback"></div> 
   <div id="logo"></div>		
   <div id="navbar"> 
       <span id="navcat"></span>
       <span id="navpage"></span>
   </div>
</div>

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

Метки логобака и логотипа накладываются на таблицу стилей.

Логобачный тег содержит фоновое изображение логотипа, благодаря эффекту плавления от непрозрачности к прозрачному, выполненному с помощью The Gimp, он постепенно тает со дном заголовка.

Логотип накладывается на фоновое изображение с помощью атрибута z-индекса третьего уровня, поэтому он больше, чем фон 2 уровня (и фон заголовка 1 уровня).

На панели навигации также используется градиент серого на белом, который очень легко реализовать с помощью инструмента градиента в The Gimp.

Недостаток этого графического выбора заключается в том, что изображения логотипов и фоновых изображений должны быть в формате GIF или PNG, чтобы иметь прозрачность, и имеют больший размер, чем файлы JPG.

Очевидно, можно изменить тему, чтобы использовать другой графический выбор.

См. также «Расплавленное изображение с задним планом» The Gimp .

Полезная документация

Компоненты страницы, заданные WordPress, и способы их назначения в интерфейсе.