Иногда появляется необходимость иметь несколько изображений в шапке сайта, таким образом, чтобы они выводились в соответствии с определенной страницей. То есть, на одной странице у вас одна картинка в хедере, при переходе на другую - другая и так далее.
Как обычно, мы разбираем возможность подобной реализации на сайтах WordPress. Самим движком подобных опций не предусмотрено. Существуют некоторые шаблоны, в которых подобный функционал реализован, но у подавляющего количества он отсутствует.
Однако мы рассмотрим универсальный метод, который подойдет для большинства шаблонов, при этом мы не будем использовать дополнительные плагины и вообще с плагинами, в данном контексте, работать не будем.
Для начала необходимо в папке images вашего шаблона создать новую папку, назвать ее вы можете как угодно, мне удобно называть ее headers. Если вы назовете ее иначе, поправьте код, приведенный ниже, в соответствии с наименованием вашей папки.
Для некоторых шаблонов будет достаточно вставить header.php, после селектора <div class="art-Header"> следующий скрипт:
<img src="<?php bloginfo('template_url'); ?>/images/headers/RISUNOK.jpg" /> <?php } elseif (is_page('265')) { ?> <img src="<?php bloginfo('template_url'); ?>/images/headers/RISUNOK1.jpg" /> <?php } elseif (is_page('268')) { ?> <img src="<?php bloginfo('template_url'); ?>/images/headers/RISUNOK2.jpg" /> <?php } else { ?> <img src="<?php bloginfo('template_url'); ?>/images/headers/RISUNOK3.jpg" /> <?php } ?> |
Давайте его немного разберем:
is_page('29') - вместо числа 29, вам необходимо указать ID необходимой страницы, его можно узнать, зайдя в страницу для редактирования. Обратите внимание на ссылку в адресной строке, особенно на ее часть: post=29, где 29 и есть ID страницы.
/images/headers/RISUNOK.jpg - эту часть вам необходимо переименовать в соответствии со своими названиями папок и изображения.
<?php } elseif (is_page('265')) { ?>
<img src="<?php bloginfo('template_url'); ?>/images/headers/RISUNOK1.jpg" /> - для того, чтобы присвоить индивидуальные изображения нужному количеству страниц, просто копируйте эту часть кода несколько раз, изменяя, соответственно, ID страницы и имя рисунка.
<?php } else { ?>
<img src="<?php bloginfo('template_url'); ?>/images/headers/RISUNOK3.jpg" /> - данная часть отвечает за вывод изображения по умолчанию, на страницах, для которых другая картинка не определена, в том числе и на главной.
Вполне возможно, что после данных манипуляций, изображение в шапке встало не так, как вы того хотели. В этом случае нам поможет метод, который был описан подробно в ЭТОЙ статье.
Если коротко, то нам необходимо создать новый селектор непосредственно перед вашим кодом, по следующему принципу:
<div class="headers"><div> Ваш код </div> |
После этого, в самом конце файла style.css, создаем новый класс:
.headers { float: right; margin-top: 11px; margin-right: -50px; } |
Изменяя параметры данного кода, можно выставить изображения в шапке вашего сайта оптимальным для вас образом. Не забывайте сохранять произведенные изменения. Аналогичным способом эта проблему можно решить для страниц записей, категорий и меток сайта на WordPress.
Если после прочтения у вас остались вопросы, задавайте их в комментариях.