Ваш промокод mojWPAds на плагин рекламы для WordPress >>

Как присвоить рубрике иконку. Category and Page Icons

как присвоить иконку рубрикеПродолжаем делать шаблон своего сайта уникальным и индивидуальным. На этот раз предлагаю Вам сделать иконку напротив рубрики или названия страницы в меню (верхнем или сайдбаре).

В реализации задуманного поможет плагин Category and Page Icons, который распространяется бесплатно и легко в настройках.

Category and Page Icons позволяет установить свои иконки для рубрик, что отображаются в Вашем сайбдаре (боковой панели сайта) при помощи виджета. Аналогично и со страницами (не путать со статьями), которые Вы создаете через админку своего блога. Смотрите скриншот:

плагин иконок Category and Page Icons

На скриншоте представлены три рубрики и напротив каждой стоит своя иконка. Именно это и делает рассматриваемый плагин.

Какого то специального вмешательства в код сайта, чтобы подключить плагин, ненужно. Он автоматически начинает работать, если в коде сайта используются функции wp_list_pages и wp_list_categories.

Качаем плагин в конце статьи с официального источника и устанавливаем. Для тех, кто не знает как можно установить плагин (замечу: 2 способа установки), читаем статью "Инструкция по установке плагина WordPress".

Все, установили и активировали. Теперь в консоли админки сайта появился новый блок, под названием Icons. В этом блоке 2 подраздела:

  • Icons - в этом разделе мы: закачиваем иконки; назначаем иконки для конкретных рубрик и страниц; удаляем иконки.
  • Settings (Настройки) - здесь: назначаем папку, в которой будут лежать иконки; устанавливаем ширину и высоту иконок.

Начнем (Settings) с настроек именно этого пункта (так надо:)))

Клик для увеличения

Клик для увеличения

В настройках по порядку идет:

  • Место расположение папки с иконками на Вашем хотстинге. По умолчанию это wp-content/uploads/icons. Если у Вас есть острая необходимость, то можете изменить этот путь, предварительно создав папку и выставив права на нее 777.
  • Ширина и высота - тут все понятно: задаем размеры Вашей иконки. Отметив галочку - Вы обрежете картинку большего размера, с сохранением пропорций.
  • Delete icons data - при удалении данного плагина Вы можете удалить и настройки иконок для рубрик и страниц, но сами иконки останутся физически у Вас на хостинге.
  • Copyright notice - когда галочка будет стоять на этом пункте - у Вас в подвале (футере) сайта будет стоять сквозной линк на разработчиков плагина. Решайте сами.

Теперь очередь закачать иконки (пункт Icons) и начать их размещать.

  • Add / Delete icons - нам сразу предлагают закачать иконки на хостинг. Это можно сделать из админки (Choose Icons to upload - Выбрать файл), либо через ftp (вот почему я начал с настроек плагина, где указана папка, куда будем помещать картинки). В этом же пункте мы можем удалить ненужные.
  • Пункты меню Assign icons to Pages и Assign icons to Categories - выбрать иконку для страниц и рубрик, соответственно. Здесь все очень просто: напротив каждой рубрики (страницы) поле выбора иконки из списка тех, что Вы закачали. Все что остается - это указать иконку и нажать Сохранить.

настрока Category and Page Icons плагин иконок wordpress

Все, можете смотреть на результат.

Когда я установил данный плагин для тестов, то была некоторая проблема с отступами в сайдбаре (margin и padding). Решается это все вмешательством в файл стилей плагина под названием client.css и лежащего в папке css с плагином.

Требуемая версия WP:  2.7+
Рассмотренная версия плагина:  0.8
Скачать плагин

Привет.

Меня зовут Виталик. Я автор этого блога и Магазина WordPress https://wp-r.ru/.


Оказываю услуги по созданию и настройке сайтов на WordPress (верстка, натяжка).

Отблагодарить Z888279575784 R109400923968 или ЯД 41001651742138

Мои Контакты. Я в Twitter @mojWP. Смотри на Youtube. Читай RSS блога.

Опубликовано 15 комментариев
  1. Пётр Усков says:
    http://uskov-p.ru

    Для какой версии WordPress это написано? Для WordPress 3.3.1. это неправильно.

    • mojWP says:

      Не в сборке WP дело, а в шаблоне. Попробуйте на другом шаблоне и увидите разницу.
      Если посмотрите на статью, то в самом конце написано, что у меня так же возникли проблемы с отображением плагина. Однако, в данном случае все решилось просто. Какая проблема возникла в Вашем случае - мне неизвестно.
      Могу Вас разочаровать - нет подобных универсальных плагинов, которые будут одинаково работать на всех сайтах. Именно поэтому нужно знать азы HTML, PHP и CSS, либо просить знакомых.

  2. Павел says:
    http://pavgri.blogspot.com

    Если подойти основательно, то получается довольно красиво. Если хотите увидеть как это будет выглядеть, посмотрите например в блогонике (blogonika.ru). Но только если на этом заморочится, поскольку нужно будет рисовать много картинок и желательно немного схожих. Тогда это будет красиво и эстетично смотреться.

  3. Александр MaDDogg says:
    http://time-for-android.ru/

    Эх, помню времена когда я на движках Slaed сайты монтировал. Помню как создавал блок "Меню" и вручную прописывал картинку через image тег и потом ссылку на рубрику ))
    Как же WordPress упрощает некоторые вещи.

    Может кто подскажет. Имеется шаблон оформления, рубрики находятся под шапкой сайта. Где можно редактировать код этого меню?

    • Виталий says:

      style.css
      163 строка
      #navcontainer

      • Александр MaDDogg says:
        http://time-for-android.ru/

        Благодарю за помощь.
        Нужно будет придумать эдакое такое что нибудь =)
        Правда придёться повозиться со всем, но думаю оно того стоит.

  4. Pavel says:
    http://healthbps.ru/

    Здорово, конечно, но где сами иконки то взять? Я так понимаю, что в плагин включены какие-то стандартные. Много их?

    • Виталий says:

      качаем плагин по ссылке и смотрим, много ли.
      проще сделать это, чем ждать моего ответа

  5. Вадим says:
    http://karta3d.net

    Спасибо за статью!Очень интересный плагин.

  6. Serg says:
    http://irpin.pp.ua/

    Доброго времени суток! Вопрос такого рода- плагин хорош но он отображается в консоли у всех пользователей. Как можно решить данный вопрос?. Спасибо!

    • Виталий says:

      добрый.
      гуглите в сторону настройки админ. консоли под разных пользователей. попадались ранее подобные статьи.

  7. Fedor says:

    Спасибо за наводку, плагин неплохой и простой.

    Появился вопрос - у меня при наведении на виджет с рубриками - они (ссылки) подчеркиваются, как наверное у многих. Теперь при добавлении иконок стало некрасиво, т.к. само название рубрики сдвинулось право, а под иконкой подчеркивание осталось! В примере Павла с блогоника.ру у сайта такая же проблема. В CSS плагина изменить это нельзя.
    Получается, что чтобы нормально без подчеркиванием под иконкой отображалось придется править css шаблона убирая для виджета с рубриками подчеркивание?
    Или можно как-то по-другому это решить? Заранее спасибо за помощь 🙁

    • Руслан says:
      http://lineicev.ru

      Нет без вмешательства в CSS шаблона вы ничего не сможете зделать.

  8. Eksdzhi says:
    http://netdia.ru/

    Виталий, а как вставить иконки без плагина? Можете отдельный гайд написать на эту тему?

    • Виталий says:
      http://mojWP.ru/

      Знать CSS и прописать каждому li в нужно виджете иконку.

Не держи в себе. Выскажись.

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

© 2011-2017 | mojwp.ru | Копирование материала разрешено только с письменного согласия
WordPress: 11.9MB | MySQL:115 | 0,255sec
Лучшие плагины для сайта WordPress
Магазин WordPress WP-R.ru
Я понял, не показывай больше.
Смотри мои обучающие видео на YouTube
Сайт использует cookie
Друг, не уходи!