Установка и оформление красивых рубрик и меток на блоге дает возможность читателям легче на нем ориентироваться. При этом создаются условия, как можно дольше оставаться на блоге и еще более внимательно его изучать. Что соответственно очень полезно для продвижения блога и роста его популярности.

Установка красивых меток

Для того, чтобы установить красивые рубрики и метки на свой блог, установим плагин Cool Tag Cloud. Данный плагин, как раз и даст нам возможность настройки красивых меток на своем блоге.

Рис. 1

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

Когда метки заведены для каждой из статей блога, их остается только вывести в удобном для нас формате. И обозначить их мы можем, как угодно.

После установки плагина Cool Tag Cloud, переходим в боковое меню консоли WordPress > Внешний вид > Виджеты (Рис.2-п.2)

Виджеты

Рис. 2

Перед нами открывается окно настройки виджетов (Рис.3).

Настройка виджета

Рис. 3

Для того, чтобы наши метки оказались в боковом меню блога, нужно перенести мышью виджет нашего плагина Cool Tag Cloud (Рис.3-п.1) с левого края вправо на панель “Primary Sidebar” (п.2).

Как видите у меня стоит сразу два виджета, это сделано для того, чтобы разделить “Категории” (Рубрики) от “Разделов” (Метки). Соответственно, мы можем дать любые другие названия.

Рис. 4

Теперь займемся настройкой самого виджета. Нажимаем на него и он раскрывается (Рис.4) и мы видим различные поля для настройки:

1. Заголовок (название панели выводимой на блоге) (п.1)
2. Семейство шрифтов (выбор подходящего шрифта) (п.2)
3. Начертание шрифта (обычный или жирный) (п.3)
4. Наименьший размер шрифта (п.4)
5. Наибольший размер шрифта (если задать наибольший и наименьший размер шрифта, то метки посещаемые чаще будут выделяться большим шрифтом, чем менее посещаемые) (п.5)
6. Стиль картинки (задает различную цветовую гамму меткам) (п.6)
7. Выравнивание картинки (вправо или влево) (п.7)

Рис. 5

Движемся дальше по настройкам виджета:

1. Анимация при наведении (выбор анимации при наведении на метку) (п.1)
2. Имена меток (стиль шрифта – как есть, прописные, строчные или все слова с большой буквы) (п.2)
3. Максимум меток (ограничение по количеству меток) (п.3)
4. Сортировать метки по (сортировка по имени или числу – первыми будут более посещаемые) (п.4)
5. Направление сортировки (по убыванию или возрастанию) (п.5)
6. Таксономия (что будет выводится рубрики или метки) (п.6)
7. Тултип с числом записей (выводится количество записей принадлежащих той или иной метке) (п.7)
8. Добавить rel=””nofollow для ссылок в облаке (не индексирует ссылки для поисковых систем) (п.7)

Рис. 6

И последняя настройка виджета:

1. On single post display (выводит либо все существующие метки, либо метки принадлежащие своей рубрике)
2. Сохранить

Прекрасно. После того, как мы провели все настройки виджета и сохранили их. Идем на наш блог и обновляем его (клавиши Shift+F5).

Вид меток на блоге

Рис. 7

На (Рис.7), мы видим, как метки будут выглядеть на блоге.

Замечательно. Теперь мы научились устанавливать красивые метки на боковой панели нашего блога.

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

Для этого подключаемся к нашему блогу по FTP. Как это сделать я рассказывал в статье: “Подключение к файлам блога по FTP в программе NotePad++“, где данный способ более удобный, чем подключение через файловый менеджер.

Код вставки меток

Открываем нужный нам файл нашего блога, который называется content-single.php и вставляем в него наш код, который Вы видите ниже.

<!– вставка тегов начало –> <div style=”text-align: center; margin-top: 30px; margin-bottom: 10px; font-family: Arial;”><?php the_tags(‘Разделы: ‘, ‘, ‘); ?></div> <!– вставка тегов конец –>

Где:

1. <?php the_tags(‘Разделы: ‘, ‘, ‘); ?> (выводит наши метки на блоге, где ‘Разделы: ‘ – можно поменять на свое название)
2. div style=”text-align: center; margin-top: 30px; margin-bottom: 10px; font-family: Arial;”> – настройки внешнего вида и расположения шрифта:
   а) text-align: center; – текст по центру,
   б) margin-top: 30px; – отступ сверху,
   в) margin-bottom: 10px; – отступ снизу,
   г) font-family: Arial; – вид применяемого шрифта

В каком месте статьи, Вы хотите чтобы выводились метки, смотрите сами. Подставляя данный код в разные места файла content-single.php, можно добиться нужного результата.

При чем, наш файл content-single.php отвечает за полное содержание статей блога, поэтому будьте с ним очень осторожны при редактировании.

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

После того, как мы вставили код в нужное место. Заходим на наш блог и обновляем его.

Рис. 8

Как мы видим, наши метки вставились удачно, в том месте, где мы им указали.

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

Буду рад Вашим вопросам и комментариям

Успехов Вам
С уважением Владимир Шишков