Установка и оформление красивых рубрик и меток на блоге
Установка и оформление красивых рубрик и меток на блоге дает возможность читателям легче на нем ориентироваться. При этом создаются условия, как можно дольше оставаться на блоге и еще более внимательно его изучать. Что соответственно очень полезно для продвижения блога и роста его популярности.
Установка красивых меток
Для того, чтобы установить красивые рубрики и метки на свой блог, установим плагин 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)
- Семейство шрифтов (выбор подходящего шрифта) (п.2)
- Начертание шрифта (обычный или жирный) (п.3)
- Наименьший размер шрифта (п.4)
- Наибольший размер шрифта (если задать наибольший и наименьший размер шрифта, то метки посещаемые чаще будут выделяться большим шрифтом, чем менее посещаемые) (п.5)
- Стиль картинки (задает различную цветовую гамму меткам) (п.6)
- Выравнивание картинки (вправо или влево) (п.7)
Рис. 5
Движемся дальше по настройкам виджета:
- Анимация при наведении (выбор анимации при наведении на метку) (п.1)
- Имена меток (стиль шрифта – как есть, прописные, строчные или все слова с большой буквы) (п.2)
- Максимум меток (ограничение по количеству меток) (п.3)
- Сортировать метки по (сортировка по имени или числу – первыми будут более посещаемые) (п.4)
- Направление сортировки (по убыванию или возрастанию) (п.5)
- Таксономия (что будет выводится рубрики или метки) (п.6)
- Тултип с числом записей (выводится количество записей принадлежащих той или иной метке) (п.7)
- Добавить rel=””nofollow для ссылок в облаке (не индексирует ссылки для поисковых систем) (п.7)
Рис. 6
И последняя настройка виджета:
- On single post display (выводит либо все существующие метки, либо метки принадлежащие своей рубрике)
- Сохранить
Прекрасно. После того, как мы провели все настройки виджета и сохранили их. Идем на наш блог и обновляем его (клавиши Shift+F5).
Вид меток на блоге
Рис. 7
На (Рис.7), мы видим, как метки будут выглядеть на блоге.
Замечательно. Теперь мы научились устанавливать красивые метки на боковой панели нашего блога.
Несомненно для удобства работы с блогом, хочется расположить метки и в других местах. Например, чтобы они показывались в содержании каждой статьи. Давайте сделаем это.
Для этого подключаемся к нашему блогу по FTP через файловый менеджер.
Код вставки меток
Открываем нужный нам файл нашего блога, который называется content-single.php и вставляем в него наш код, который Вы видите ниже.
![]() |
<!– вставка тегов начало –> <div style=”text-align: center; margin-top: 30px; margin-bottom: 10px; font-family: Arial;”><?php the_tags(‘Разделы: ‘, ‘, ‘); ?></div> <!– вставка тегов конец –> |
Где:
- <?php the_tags(‘Разделы: ‘, ‘, ‘); ?> (выводит наши метки на блоге, где ‘Разделы: ‘ – можно поменять на свое название)
- 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
Как мы видим, наши метки вставились удачно, в том месте, где мы им указали.
Таким образом, дорогие читатели мы добились того, что наши метки будут находиться в боковой панели блога и в содержании статей. Что соответственно будет более эффективно и удобно при изучении материала.
Буду рад Вашим вопросам и комментариям
Успехов Вам
С уважением Владимир Шишков