Как создавать теги в WordPress

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

Показать все тэги WordPress

Некоторые популярные сайты отображают свои самые популярные теги в качестве тем на своих страницах архива или в области нижнего колонтитула. Посмотрите, как вы можете отобразить все свои теги записей, с количеством сообщений и без использования облака тегов.

Первое, что нужно сделать, это скопировать и вставить этот код в файл functions.php темы или в специальный плагин сайта.

Wpb_tags () function {
$ wpbtags = get_tags ();
foreach ($ wpbtags как $ tag) {
$ строка. = ‘term_id).’ “> ‘. $ tag-> name. ‘ ». $ tag-> count. ‘ “” n “;
}
возвращает $ string;
}
add_shortcode (‘wpbtags’, ‘wpb_tags’);

Этот код просто отображает все ваши теги с количеством сообщений рядом с ними. Однако, чтобы отобразить его на своей странице или виджете, вы должны использовать этот короткий код:

(wpbtags)

Использование этого кода покажет только ссылки тегов и количество постов рядом с ними. Это не заставит тебя выглядеть красиво. Давайте добавим немного CSS, чтобы он выглядел красиво. Скопируйте и вставьте этот CSS в таблицу стилей вашей темы.

.tagbox {
цвет фона: #eee;
граница: 1px solid #ccc;
поле: 0 px 10 px 10 px 0 px;
высота линии: 200%;
отступы: 2px 0 2px 2px;

}
.taglink {
обивка: 2px;
}

.tagbox a, .tagbox a: посещенный, .tagbox a: активный {
оформление текста: нет;
}

.tagcount {
цвет фона: зеленый;
Белый цвет;
относительное положение;
обивка: 2px;
}

Не стесняйтесь изменять CSS в соответствии с вашими потребностями. Вот как это выглядело на нашем демонстрационном сайте:

Теги стиля в метаинформации поста

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

Давайте посмотрим, как мы можем создавать ссылки тегов под постом WordPress.

Сначала вы должны выяснить класс CSS, используемый вашей темой WordPress для отображения тегов. Для этого щелкните правой кнопкой мыши на ярлыках и выберите «осмотреть элемент» в меню браузера.

Это разделит экран браузера, чтобы отобразить панель инструментов разработчика под веб-страницей. В наборе инструментов разработчика вы можете увидеть класс CSS, используемый вашей темой WordPress для отображения тегов.

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

.terms to, .terms to: посещенные, .terms to: active {
фон: #eee;
граница: 1px solid #ccc;
радиус края: 5 пикселей;
оформление текста: нет;
обивка: 3px;
поле: 3px;
преобразование текста: заглавные буквы;
}

. термины для: hover {
фон: # a8281a;
цвет: #FFF;
}

Не стесняйтесь изменять CSS, чтобы соответствовать цветам вашей темы. Вот как выглядели ярлыки на нашем демонстрационном сайте:

Вы можете заметить разницу между двумя скриншотами, в дополнение к изменениям CSS, мы также изменили теги на Tagged и удалили запятые между тегами. Как мы это сделали?

Мы модифицируем the_tags (); Тег шаблона в нашем файле single.php выглядит так:

Если вы хотите ограничить общее количество отображаемых ярлыков, скажем, 5 или что-то еще, см. Эту статью о том, как отображать ограниченное количество ярлыков после публикации.

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

Если вам понравилась эта статья, подпишитесь на наш канал на YouTube, чтобы получить больше видеоруководств по WordPress. Вы также можете найти нас в Google+ и Twitter,