Як відобразити різні іконки для окремих рубрик

Ви ніколи не замислювалися, як зробити заголовки рубрик на головній сторінці сайту більш впізнаваними та незабутніми?

Найкращий спосіб сприйняття інформації з екрана монітора – це графічне уявлення. А все, що потрібно зробити із заголовками рубрик – це додати до них іконки , що символізують різні тематики. На щастя, зробити це в WordPress дуже легко, адже кожна рубрика має свій унікальний ID.

Як це зробити вручну

Дуже просто. Перейменуйте потрібні іконки так, щоб вони мали вигляд 1.jpg , 2.jpg , 3.jpg і так далі. Цифри 1, 2 та 3 в іменах файлів повинні відповідати номеру ID для кожної рубрики. (Як дізнатися ID кожної рубрики - див. WordPress Codex ). Помістіть іконки до папки та завантажте на сайт.

Тепер просто додайте цей шматочок коду у вашу тему там, де ви хочете відобразити іконки.

<?php
foreach((get_the_category()) as $category) {
    echo '<img src="http://example.com/images/' . $category->cat_ID . '.jpg" alt="' . $category->cat_name . '" />';
}
?>

Тільки замість example.com/images потрібно вказати повну URL-адресу до папки з вашими іконками на сайті.

Як це зробити за допомогою плагіна

Якщо вам не схожий перший спосіб, можна використовувати плагін Category Icons , який дозволяє зробити більш глибоке налаштування.

Ось основні можливості цього плагіна:

• відображення однієї або кількох іконок перед заголовками записів або у довільному місці;
• відображення іконок у сайдбарі із заголовком або без заголовка рубрики;
• налаштування іконок через додатковий віджет;
• відображення рубрик іконок в RSS стрічці новин.

Завантажити плагін можна за цим посиланням. Якщо ви не знаєте як встановлювати та активувати плагіни, ознайомтеся з нашим уроком.

Тепер ви знаєте, як урізноманітнити нудні та однотонні заголовки рубрик на своєму сайті.

Джерело: wplift.com

Олексій Шевченко

редактор wpcafe

Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, що спеціалізується на створенні сайтів WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/