Изображения вместо текстовых ссылок в подфорумах

Рассмотрим форум, где в одном из разделов есть много подфорумов, посвященных чем-то однотипному. В качестве конкретного примера — баскетбольный форум с разделом, посвящённым командам. Каждый подфорум соответствует какой-то команде. Задача такая — вместо названия подфорумов выводить картинку-логотип команды. Задача выполнена, ниже я объясню, как это сделать.

Вариант списка форумов до начала работ:

изображения вместо текстовых ссылок в подфорумах phpBB

Видно, что текст воспринимается не слишком легко из-за большого количества подфорумов, названия которых перечислены в одной строке. Поэтому заменим их на логотипы соответствующих команд. Для этого понадобится найти эти самые логотипы, причём желательно в одинаковом формате. Затем каждый из логотипов нужно назвать в соответствии с id подфорума команды, обладающей данным логотипом. Должно получится что-то вроде 83.jpg, 84.jpg, 102.jpg и так далее.

Теперь загрузим все эти картинки в отдельную папку в директории images. В моём случае папка называлась teams. После этого с графикой всё будет закончено и можно приступать к скриптам.

Откроем файл includes/functions_display.php. Сначала нужно выделить id подфорума в отдельную переменную, чтобы с ней можно было работать — ведь все файлы-логотипы названы по id соответствующих подфорумов. Для этого найдёт такой участок кода:

и добавим туда ещё одну строчку с новым элементом массива $subforums_list[]:

Теперь нужно при формировании списка подфорума поставить условие на id форума, а затем для выбранного форума выводить список подфорумов не текстом, а картинками. Для этого находим в этом же файле такие строки:

и заменим на такой код:

Сразу уточню, какие данные здесь являются переменными:

  • 82 — id форума, подфорумы которого мы хотим выводить в виде картинок;
  • images/icons/teams/’ . $subforum[‘id’] . ‘.jpg — путь к картинкам-логотипам, а также их формат.

В итоге получился такой список форумов:

изображения вместо текстовых ссылок в подфорумах phpBB

Получившийся вариант не отличается компактностью — с правой стороны имеется пустое пространство, которое было бы неплохо заполнить. Для этого уберём пробелы между иконками, чтобы они выводились в ряд без автопереносов, а затем добавим <br /> для отделения новых строк после каждых десяти иконок. Меняем код в includes/functions_display.php на такой:

изображения вместо текстовых ссылок в подфорумах phpBB

В завершении работы сделаем разное изображение иконок для прочитанных и непрочитанных подфорумов. Пусть ранее заготовленные иконки будут использоваться для варианта с непрочитанным форумом, тогда остаётся добавить такой же комплект для прочитанных форумов. Для этого сделаем иконки того же размера, но отличающиеся цветом, и назовём их по тому же принципу, что делали это в первый раз. Отличие лишь в том, что после идентификатора нужно добавить к названию _read, например, 82_read.jpg. Скопируем полученные изображения в ту же папку, затем ещё раз изменим код на такой:

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

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.