Как показать разные картинки в шапке WordPress сайта

Автор:
Nurlan Kemelbekov

Условные теги являются одним из тех вещей, которые можно использовать на WordPress сайте независимо от того, асс вы в кодировании или просто имеете достаточно знаний, чтобы установить плагин. Удивительно, что простой кусок PHP может сделать для WordPress сайта.

Позвольте мне представить вам в качестве примера, как показать разные картинки в шапке WordPress сайта в разных разделах.

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

Хочу показать это на примере блога maks-1.com. Наш блог имеет несколько различных категории/рубрик:

WordPress, Компьютер, Интернет, Windows

И страницы: карта сайта, обратная связь.

Для того, чтобы отобразить разные картинки в шапке сайта для каждого раздела, мы должны сделать некоторые изменения кода в header.php нашей темы. Используя редактор кода, найдите строку <header id=»masthead» role=»banner»> (мы будем работать в этом районе). Теперь в зависимости от темы, которое вы используете, сначала удалите следующий код:

Удалить этот раздел, который является кодом изображение заголовка по умолчанию:

<
?php $header_image = get_header_image();
if ( ! empty( $header_image ) ) : ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
<?php endif; ?
>

и заменить его с этим кодом:

<?php if(is_page('obratnaya-svyaz')):?>
<img src="http://maks-1.com/social/obratnaya-svyaz.jpg" width="940px;" height="140px;" alt="obratnaya-svyaz.jpg" >
<?php elseif (is_page('karta-bloga')):?>
<img src="http://maks-1.com/social/karta-bloga.jpg" width="940px;" height="140px;" alt="karta-bloga.jpg">
<?php elseif (is_category('wordpress')):?>
<img src="http://maks-1.com/social/wordpress-head.jpg" width="940px;" height="140px;" alt="wordpress-head.jpg">
<?php elseif (is_category('kompyuter')):?>
<img src="http://maks-1.com/social/computer.jpg" width="940px;" height="140px;" alt="computer.jpg">
<?php elseif (is_category('windows')):?>
<img src="http://maks-1.com/social/windows.jpg" width="940px;" height="140px;" alt="windows.jpg">
<?php elseif (is_category('internet')):?>
<img src="http://maks-1.com/social/header_internet.jpg" width="940px;" height="140px;" alt="header_internet.jpg">
<?php endif;?>

Думаю, Вы понимаете, что здесь нужно будет заменить адрес расположения изображений и названия рубрик.

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

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



Вам также может понравиться:


2 комментарий на “Как показать разные картинки в шапке WordPress сайта

  1. Спасибо за полезную информацию! Очень пригодилась!

  2. Нужная информация, спасибо. Ваши рекомендации пригодятся, взяла себе ссылку на ваш сайт, буду заглядывать за полезными советами!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

* Copy This Password *

* Type Or Paste Password Here *

четыре × 2 =

Я просто хотел сказать, как сильно я ценю Ваш комментарий на мой пост. Спасибо Вам !!