club762.ru
В прошлой главе я выполнил разбиение .html-файла на несколько php-файлов. Естественно, это действие вряд ли могло остаться без нашего внимания. Что в действительности делает каждый из php-файлов? Какой код должен располагаться в них? В этой главе мы окинем взглядом php-составляющую, и первым файлом, который попадет под наше с вами рассмотрение, будет header.php.
Header.php, по своей природе, является самым первым файлом, который обычно вызывается в теме. Как правило, он состоит из следующих элементов:
- Doctype информация
- Meta-данные (Charset, Title, Description, Keywords)
- RSS информация (Feed/Comments Feed)
- Стилевые таблицы CSS
- Вызов Javascript
- Вызов WordPress хэдера
Doctype информация автоматически добавляется к файлу при его создании в Dreamweaver.
Метаданные. Здесь важно сделать несколько вещей. Заголовок темы должен содержать подходящие ключевые слова. Если вы используете
<?php bloginfo(‘name’); ?>
, то ключевые слова обычно заносятся в название блога.
Следующий пункт — это описание. Если вы хотите использовать описание, задаваемое в WordPress, вы можете использовать
<?php bloginfo(‘description’); ?>
. Опять же, убедитесь в том, что вы указали для него верные ключевые слова.
Наконец, ключевые слова не должны быть слишком отвлеченными, ведь их основная задача — четко описать ваш сайт. Google не любит откровенный спам в ключевых словах.
Следующим пунктом у нас следует RSS-информация. Вызов RSS-фидов в хэдере происходит следующим образом:
<link rel=“alternate” type=“application/rss+xml” title=“<?php wp_bloginfo(‘name’); ?>” href=“<?php wp_bloginfo(‘rss2_url’); ?>” />
Именно эта строка отвечает за создание небольшой оранжевой иконки RSS в браузере.
Дальше идет ссылка на таблицу стилей CSS. Если вы используете Dreamweaver, то вам не требуется ничего прописывать самому, поскольку таблица стилей, указанная вами, будет подключена автоматически. Однако если вы хотите выпустить свою тему для пользователей, то вам понадобится использовать в ссылке следующий адрес:
"<? php wp_bloginfo (‘url’);?>/wp-content/themes/THEMENAME/style.css"
Я советую использовать такой путь всегда, чтобы потом не возникало никаких вопросов (тем более, так легче портировать тему на разные сайты).
Javascript-сценарии обычно подключаются после CSS-таблиц.
Наконец, перед закрывающим тегом
</head>
должен стоять хук
<?wp head(); ?>
. Этот хук используется различными функциями и плагинами, так что его нельзя упускать из внимания.
Итак, вы закончили область head и открыли тег
<body>
. Должны ли вы включить в хэдер что-то еще? Остались ли элементы (навигация, логотип, и др.), которые должны отображаться на каждой странице? Если да, то обязательно добавьте их. Обычно хэдер заканчивается непосредственно перед блоком div, который относится к контенту.
Как вы видите, элементов, которые должны находиться в хэдере, довольно много, и о каждом из них нужно позаботиться заранее. Только в таком случае тема действительно получит привлекательное представление.
В следующей главе мы подробно остановимся на футере, рассмотрим возможность его виджетизации и попробуем реализовать некоторые другие его улучшения.
http://www.studionashvegas.com/old-posts/creating-a-wordpress-theme-from-a-psd-file-part-4-headerphp/
Ещё раз здравствуйте, Дмитрий! :) После перехода на встроенные подписные страницы, у меня возник небольшой вопрос: Вы случаем не знаете расширения для WordPress, которое бы могло отключать отображение шапки или header шаблона оформления на отдельных страницах на выбор? А то я на службе рассылки пользуюсь темой TwentyTwenty и там меню явно лишнее над заголовками страниц.
В Twenty Twenty, насколько я помню, есть встроенные шаблоны. Возможно, Full Width шаблон подойдет. Он делает дефолтное отображение страницы. Шаблоны можно через Gutenberg задавать, если вы с ним работаете (или через Elementor, если он установлен, там можно любые шаблоны настраивать, хоть встроенные в тему, хоть отдельные свои создавать).
Ну или через CSS делать, но там повозиться придется. Вот тут описан пример: https://qodeinteractive.com/magazine/how-to-hide-header-on-specific-pages-in-wordpress/
У меня в теме уже встроено много вариантов вывода страниц. Можно хоть с сайдбаром, хоть без, хоть с шапкой, хоть без нее, хоть с тайтлом, хоть без тайтла, и так для каждой отдельной страницы настраивается. Но это у меня платная тема Root от наших разработчиков. У меня от них баннер справа в сайдбаре.
Самый простой метод — CSS.
Appearance => Customize => Additional CSS — сюда вставляете.
Пример:
.page-id-19 .theme-page-header-area {
display: none;
}
Тут меняете просто id страницы и ищете правильный класс для шапки в теме. Немного экспериментов — и готово.
Благодарю, Дмитрий! Взял на вооружение способ CSS. Всё прекрасно работает и оказалось проще, чем я предполагал. Ещё раз спасибо! :)