WordPress как изменить внешний вид рубрики

Шаблон категорий WordPress. Полное руководство

Сегодня хотелось бы поговорить о категориях в WordPress они же рубрики. Возможно, вы замечали на некоторых сайтах разные стили или оформление одной категории отличающийся от другой. И отсюда возникает вопрос: как это делается? Как добиться подобного результата? Секрет заключается в создании шаблона для определенной категории и последующих его действий. Это откроет больше возможностей, например, можно поменять структуру постов, добавить иконку, цвет, описание к выбранной категории. То есть внести изменения, которые коснутся лишь одной рубрики.

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

Иерархия шаблонов для категорий в WordPress

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

Category-slug.php – самая высшая должность и WordPress в первую очередь ищет этот файл. Он носит название самой категории так называемый ярлык или краткий заголовок. К примеру, у вас есть раздел «Программы» и для него необходимо создать шаблон. Первым делом переходим в админ-панель на вкладку «Записи-Рубрики», выбираем необходимую рубрику и видим какой у нее ярлык.

Следовательно, шаблон должен быть создан с названием category-programmy.php . И все что вы в нем измените коснется только этой категории.

Category-id.php – первый заместитель. В его название входит уникальный идентификатор категории. Найти его можно там же где и ярлык только в адресной строке.

Число «8» это и есть ID данной рубрике, а название шаблона прописывается таким образом, category-8.php .

Category.php – это идет уже базовый шаблон или стандартный, как удобнее.

Archive.php – файл архивов. Он принимает на себя удар если тема не содержит ни одного из выше упомянутых файлов.

Index.php – индексная страница.

Первый этап закончен. Переходим из обзора в начальную практику.

Создание шаблона для категорий

В роли подопытного кролика сыграет тема «Clean and Clear» это уже не впервой, так что ей не привыкать. Теперь предположим необходимость создать шаблон для категории с идентификатором «8». Открываем тему и ищем файл « category.php ». Но оказался тот случай, когда тема не содержит в себе данного файла. Если следовать иерархии, то ответственный файл за категории становится archive.php .

Копируем его на рабочий стол и переименовываем в category-8.php после забрасываем обратно в папку с темой. В итоги – шаблон создан Изменения, которые будут внесены в нем затронут лишь рубрику с ID-8. Таким же путем создается шаблон с ярлыком только вместо ID прописывается название категории.

Манипуляция со шаблоном для категорий

Подошли к последнему этапу – основная практика. Какие действия можно проделать с шаблоном и как?

1. Добавить обычный текст.

2. Поменять структуру постов

Что я имею в виду под словами «структура постов» — изменение вида с одноколоночного на двух- или трех- . Такой вид, в большинстве, применяется для каталогов в интернет-магазинах или просто потому, что так нравиться. Я уже писал, как сделать двухколоночный вывод постов. Абсолютно минимальными действиями, но в нем имелись свои недостатки. Они небольшие, если не учитывать особые случаи, к примеру, определенное количество записей и количество слов в анонсе.

А создание отдельного шаблона даст полную власть и решение, что оставить, а что удалить. Сейчас мы организуем двухколоночную структуру, в определенной категории, с определенным количеством записей.

Первую часть «создание шаблона» мы прошли в начальной практике поэтому перейдем сразу во вторую. В шаблонном файле удаляем все содержимое, кроме главного контейнера (в нем находятся все последующие блоки), и оставляем функции вызова «header, sidebar, footer». В главный блок добавляем цикл, заголовок постов и вывод миниатюр. Вот, что получилось у меня:

Давайте разберем некоторые функции.

cat=8 – идентификатор категории (через запятую можно добавить несколько).

showposts=40 – количество записей.

Осталось стилизовать внешний вид.

В результате получилось следующее.

Условные теги для категорий

На самом деле к созданию шаблона прибегают в крайних случаях. Чаше всего используют условные теги поскольку это намного проще. Рассмотрим один пример. Поставлена задача — добавить разные иконки ко всем рубрикам. Если продублировать каждую категорию, то сколько же шаблонов получиться – уйма! Плюс добавляется рутинная работа. А если подумать… не легче ли использовать условные теги? Ответ-да.

Список нескольких возможностей:

Различный текст для каждой категории

Разные картинки для каждой категории

Отображение текста только на первой странице рубрике

Описание категорий только на первой странице

Источник

Создаем крутые страницы рубрик в WordPress

Насколько важную роль играют страницы рубрик на вашем сайте? Или вы не задумывались над ними, пока не наткнулись на эту статью? Какие они – унылые и неинтересные? Только представьте себе – они могут быть более полезными (как для вас, так и для ваших посетителей)! Разве нельзя их сделать чуточку круче, как мачо с картинки ниже?

Если вы являетесь обычным пользователем WP, то, скорее всего, ваши страницы рубрик находятся в том же самом состоянии, что и на момент создания сайта. Более чем вероятно – они просто содержат в себе ссылки на ваши записи, представленные либо в виде цитат, либо в полном виде.

Возможно, что они выглядят так, как страница рубрик в стандартной теме Twenty Twelve.

Подходим со всей серьезностью к страницам рубрик

Почему бы нам не проявить большую заботу о страницах рубрик? Почему бы не сделать их своеобразной интродукцией к рассматриваемому вопросу – т.е. теме вашей рубрики?

Вместо стандартного списка ссылок можно сделать что-то такое:

Или вот такое, чуть попроще:

Ведь это будет гораздо удобнее для ваших посетителей! Не думали ли вы над тем, что такие страницы рубрик отлично подходят для наращивания ссылок и снискания «любви» поисковых систем?

Как разнообразить страницу рубрик

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

Если вы настраивали или редактировали когда-нибудь рубрику в WP, то вы, вероятно, видели, что на странице присутствует поле «Decription» («Описание»).

Большая часть тем уже настроена таким образом, чтобы все то, что вы введете в поле Decription, выводилось в самой вершине страницы рубрики.

Если в вашей теме это не работает, вы можете легко подключить эту возможность путем размещения следующего кода в шаблоне, отвечающем за рубрики — category.php. Если у вас в теме нет такого шаблона, тогда воспользуйтесь archive.php.

Тотальное улучшение страницы рубрик

Хотя поле с описанием рубрики и принимает HTML-код, позволяя совершать интересные вещи, есть более продвинутый способ тотального изменения описания рубрики – достаточно использовать плагин CategoryTinymce, который добавит в поле Decription дополнительный WYSIWYG-редактор.

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

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

В том же самом примере вы можете видеть, что возле вкладок имеется некоторый текст. Я смог вывести эти два элемента рядом при помощи использования шорткодов для колонок, разбив область на две зоны – одна под вкладки (примерно две трети страницы), другая под текст (одна треть страницы).

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

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

Важные замечания

1. Шорткоды

По различным причинам некоторые шорткоды (включая фотогалереи) отказываются работать в редакторе. Правда, для этого есть решение.

Поместите следующий код в файл темы functions.php:

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

2. Страницы рубрик с навигацией.

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

Откройте шаблон вашей рубрики (category.php) и поместите в него код, отвечающий за вывод описания (базовый вывод описания должен стоять в середине):

Помните, мы указали на то, что вызов описания для рубрики обычно имеет следующий вид:

Однако он может несколько отличаться в зависимости от используемой темы.

В стандартной теме Twenty Twelve, к примеру, этот код имеет несколько иной вид:

И вот как будет выглядеть готовый код, который понадобится вставить в category.php для указанной темы:

3. Все это работает и для меток.

Заключительный штрих – данная техника работает и для меток. Таким образом, если у вас есть важные страницы меток, вы можете несколько переработать их. Успехов вам на этой ниве!

Источник

Создаем шаблоны рубрик в WordPress. Часть 2

Опубликовано: ADv Дата 05.10.2013 в рубрике Своя тема 1 комментарий

Теперь давайте представим, что у вас есть рубрика с именем “Design” с category-slug “design” и вы хотите вывести эту рубрику иначе, нежели остальные. Для этого вам нужно создать шаблон для определенной категории. Идем в Внешний вид » Редактор. Из списка файла темы справа выбираем и кликаем на category.php, если же у вас нет файла category.php, тогда ищем и выбираем archive.php.

Теперь копируем все содержимое category.php и вставляем его в текстовый редактор. Сохраните файл с именем category-design.php.

Подключитесь к своему сайту с помощью FTP клиента. Переходим в /wp-content/themes/ваша-текущая-тема/ и загружаем файл category-design.php в нее. Теперь все изменения, вносимые в этот шаблон будут отображаться на определенной странице указанной нами рубрики на сайте. Используя этот способ вы можете создавать шаблоны для любой категории. Просто используйте category-.php для имени файла. Узнать slug рубрики можно, если перейти в раздел Рубрики в административной панели WordPress.

Вот пример шаблона category-slug.php. Мы использовали тот же шаблон, что и для category.php с небольшими изменениями. В виду того, что мы уже знаем рубрику, к которой мы будем его применять, мы можем добавить заголовок, описание и любые другие детали вручную. Также обратите внимание на то, что мы использовали

Посмотрите сами, почему мы решили использовать выдержку из записи, нежели полную запись.

Если вы не хотите использовать шаблон category-slug (подразумевает Design в имени файла), то можете использовать шаблон category-id для создания шаблона для определенного ID рубрики.

Используем условные теги для рубрики

При создании шаблонов для своей темы задайте себе вопрос, действительно ли они вам нужны (отдельные для рубрики, архива и т.д.)? В некоторых случаях изменения, которые необходимо внести, не слишком сложные и могут быть реализованы использованием условных тегов внутри общего шаблона, типа category.php или даже archive.php.

В WordPress есть встроенная функция множества условных тегов, которые авторы тем могут использовать в своих шаблонах. Один из них — is_category(). Применяя его, вы можете изменять ваши шаблоны для вывода различного рода информации, если условие выполняется. Например, давайте предположим, что у вас есть рубрика для избранных записей с названием «Избранное». Вам нужно вывести какую-то дополнительную информацию в архиве рубрики для этой конкретной категории. Для этого нужно добавить следующий код в файл category.php сразу после

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

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

Источник

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

В WordPress существует довольно гибкая система шаблонов. В одной и той же теме Вы можете использовать различные шаблоны оформления для различных разделов сайта. Перед тем, как отобразить тот или иной раздел сайта, “движок” в определенной последовательности перебирает шаблоны, пока не найдет нужный.

Рассмотрим отдельно, как создать произвольные шаблоны для Категории, Записи и Страницы.

Произвольный шаблон для рубрики

Для вывода страницы категории (рубрики) WordPress использует следующую иерархию:

category-{SLUG}.php -> category-{ID}.php -> category.php -> archive.php -> index.php

Это означает, что поначалу “движок” пытается использовать шаблон для отдельной категории, используя ее идентификатор (слаг или ярлык). Например, для рубрики Мониторы со слагом monitors файл шаблона должен иметь название category-monitors.php. В случае, если такой файл отсутствует, то будет попытка использовать шаблон с уникальным идентификатором категории, например, 55. В таком случае система будет искать файл category-55.php. Если и такого шаблона нет, то будут использован общий шаблон для всех рубрик – category.php. При его отсутствии задействуется общий шаблон архивов (archive.php). Если ни один из перечисленных шаблонов не был найден, то для отображения рубрики будет использован самый главный файл – index.php.

Также обязательно ознакомьтесь с темой создания кастомного типа записей посредством register post type.

Как создать шаблон для категории?

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

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

Для создания уникального шаблона нужно перейти в папку Вашей активной темы (wp-contentthemesНАЗВАНИЕ_ТЕМЫ) и создать там файл с именем category-monitors.php, в котором задать нужный Вам вывод страницы категории Мониторы.

Как было сказано выше, шаблон для рубрики также можно создать по ее уникальному идентификатору (ID). Чтобы его узнать, следует в разделе Рубрики под названием категории перейти по ссылке Изменить.

В итоге будет открыта страница редактирования категории. Теперь нужно обратить внимание на адресную строку Вашего веб-браузера и найти там следующее:

/wp-admin/term.php?taxonomy=category&tag_ID=3

Параметр tag_ID=3 означает, что наша рубрика Мониторы имеет идентификатор 3. Теперь нужно снова перейти в каталог с темой и создать там файл со следующим именем:

category-3.php

Важно отметить, что оба способа будут работать также и с дочерними темами.

Как создать шаблон для страницы?

Для вывода страниц, WordPress действует по следующей схеме:

page-{SLUG}.php -> page-{ID}.php -> page.php -> index.php

Видно, что действия со страницами аналогичны рубрикам. Исключение составляет лишь файл page.php, который является общим шаблоном для страниц. Действия по созданию уникального шаблона также весьма схожи (со слагом или ID страницы). Идентификатор нужной страницы можно посмотреть, перейдя на страницу ее редактирования, где в адресной строке найти следующее:

/wp-admin/post.php?post=167

Значение 167 параметра post и есть уникальный идентификатор страницы.

Как создать шаблон для записи?

Для вывода содержимого отдельной записи WordPress использует следующую иерархию шаблонов:

single-{SLUG}.php -> single-{ID}.php -> single.php -> index.php

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

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

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

1. Создать в каталоге темы файл single-monitors.php.
2. Сделать копию файла single.php, назвав ее, например, single-default.php.
3. Открыть файл single.php, удалить все содержимое и вставить следующий код:

<?php
$post = $wp_query->post;
if ( in_category( '3' ) ) { //ID категории
    include( TEMPLATEPATH.'/single-monitors.php' );
} else {
    include( TEMPLATEPATH.'/single-default.php' );
}
?>

или вместо уникального идентификатора категории можно вставить ее слаг:

<?php
$post = $wp_query->post;
if ( in_category( 'monitors' ) ) { //слаг категории
    include( TEMPLATEPATH.'/single-monitors.php' );
} else {
    include( TEMPLATEPATH.'/single-default.php' );
}
?>

Что делает этот код? Мы явно даем понять “движку”, что если выбранная категория имеет ID со значением 3 или ее слаг равен “monitors”, то в таком случае следует подключить шаблон single-monitors.php. Во всех остальных случаях будет задействован файл single-default.php.

Многим больше нравится отображение в рубриках карточек с бесконечной подгрузкой вместо обычной пагинации. Сделать такую можно, добавив ajax-кнопку “Загрузить еще” плагином.

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

Насколько важную роль играют страницы рубрик на вашем сайте? Или вы не задумывались над ними, пока не наткнулись на эту статью? Какие они – унылые и неинтересные? Только представьте себе – они могут быть более полезными (как для вас, так и для ваших посетителей)! Разве нельзя их сделать чуточку круче, как мачо с картинки ниже?

Если вы являетесь обычным пользователем WP, то, скорее всего, ваши страницы рубрик находятся в том же самом состоянии, что и на момент создания сайта. Более чем вероятно – они просто содержат в себе ссылки на ваши записи, представленные либо в виде цитат, либо в полном виде.

Возможно, что они выглядят так, как страница рубрик в стандартной теме Twenty Twelve.

Подходим со всей серьезностью к страницам рубрик

Почему бы нам не проявить большую заботу о страницах рубрик? Почему бы не сделать их своеобразной интродукцией к рассматриваемому вопросу – т.е. теме вашей рубрики?

Вместо стандартного списка ссылок можно сделать что-то такое:

Или вот такое, чуть попроще:

Ведь это будет гораздо удобнее для ваших посетителей! Не думали ли вы над тем, что такие страницы рубрик отлично подходят для наращивания ссылок и снискания «любви» поисковых систем?

Как разнообразить страницу рубрик

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

Если вы настраивали или редактировали когда-нибудь рубрику в WP, то вы, вероятно, видели, что на странице присутствует поле «Decription» («Описание»).

Большая часть тем уже настроена таким образом, чтобы все то, что вы введете в поле Decription, выводилось в самой вершине страницы рубрики.

Если в вашей теме это не работает, вы можете легко подключить эту возможность путем размещения следующего кода в шаблоне, отвечающем за рубрики  — category.php. Если у вас в теме нет такого шаблона, тогда воспользуйтесь archive.php.

<?php echo category_description( $category_id ); ?>

Тотальное улучшение страницы рубрик

Хотя поле с описанием рубрики и принимает HTML-код, позволяя совершать интересные вещи, есть более продвинутый способ тотального изменения описания рубрики – достаточно использовать плагин CategoryTinymce, который добавит в поле Decription дополнительный WYSIWYG-редактор.

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

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

В том же самом примере вы можете видеть, что возле вкладок имеется некоторый текст. Я смог вывести эти два элемента рядом при помощи использования шорткодов для колонок, разбив область на две зоны – одна под вкладки (примерно две трети страницы), другая под текст (одна треть страницы).

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

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

Важные замечания

1. Шорткоды

По различным причинам некоторые шорткоды (включая фотогалереи) отказываются работать в редакторе. Правда, для этого есть решение.

Поместите следующий код в файл темы functions.php:

add_filter( 'category_description', 'do_shortcode' );

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

2. Страницы рубрик с навигацией.

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

Откройте шаблон вашей рубрики (category.php) и поместите в него код, отвечающий за вывод описания (базовый вывод описания должен стоять в середине):

<?php if (!is_paged()) {?>
Сюда вставьте код для вывода описания рубрик
<?php }?>

Помните, мы указали на то, что вызов описания для рубрики обычно имеет следующий вид:

<?php echo category_description( $category_id ); ?>

Однако он может несколько отличаться в зависимости от используемой темы.

В стандартной теме Twenty Twelve, к примеру, этот код имеет несколько иной вид:

<?php if ( category_description() ) : // Show an optional category description ?>
<div class="archive-meta"><?php echo category_description(); ?></div>
<?php endif; ?>

И вот как будет выглядеть готовый код, который понадобится вставить в category.php для указанной темы:

<?php if (!is_paged()) {?>
<?php if ( category_description() ) : // Show an optional category description ?>
<div class="archive-meta"><?php echo category_description(); ?></div>
<?php endif; ?>
<?php }?>

3. Все это работает и для меток.

Заключительный штрих – данная техника работает и для меток. Таким образом, если у вас есть важные страницы меток, вы можете несколько переработать их. Успехов вам на этой ниве!

Источник: wpmu.org

Каждый раз, когда я захожу на сайт The New Yorker, я сразу перехожу в категорию «Художественная литература и поэзия », чтобы прочитать последний рассказ. Прокрутки домашней страницы нет. Не нужно изучать самые популярные статьи недели. Я то, что они называют «не подписчиком», поэтому я не могу выделить ни одного из шести бесплатных слотов для статей в месяц на документальную литературу.

Чтобы посетители могли так же легко и быстро найти нужный контент на вашем сайте WordPress, вы можете организовать свои сообщения по категориям, например, на веб-сайте The New Yorker. Затем каждый раз, когда зритель нажимает ссылку на одну из категорий на вашем сайте, он попадает на страницу со списком сообщений из этой конкретной категории.

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

Представьте, если бы страница категории «Кроссворды» в журнале New Yorker выглядела так же, как страница «Новости», которая выглядела бы так же, как страница «Мультфильмы» и т.д. Один шаблон не может подходить для всех типов контента – некоторые страницы будут выглядеть хуже или труднее ориентироваться, чем другие.

Вот почему The New Yorker использует собственные шаблоны для каждой категории. Например, страница «Новости» представляет собой макет из одной колонки. Таким образом, посетители могут четко просматривать изображение, название, дек, автора и дату каждой статьи, чтобы решить, какие статьи читать, прокручивая страницу вниз.

С другой стороны, страница «Кроссворды» представляет собой многоколоночный макет, поэтому посетители могут быстро просмотреть дату, чтобы выбрать тот, который они еще не пробовали.

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

Как стилизовать разные категории в WordPress

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

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

Давайте начнем с шагов по созданию пользовательских шаблонов в cPanel вашей учетной записи хостинга.

Создайте стиль отдельных категорий в WordPress с помощью пользовательских шаблонов

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

Во-первых, вам нужно войти в свою учетную запись хостинга. Затем нажмите File Manager в разделе Files вашей cPanel.

Теперь щелкните папку public_html в левой части экрана. Щелкните папку wp-includes и найдите файл category.php. (В некоторых темах этот файл будет называться archives.php.) Щелкните правой кнопкой мыши, чтобы отредактировать его.

Источник

Скопируйте содержимое файла category.php. Теперь перейдите в папку wp-content. Щелкните папку с надписью «themes». Затем щелкните папку с названием вашей темы.

В этой папке создайте новый файл шаблона категории и назовите его category-categoryname.php, заменив «categoryname» категорией, которую вы хотите стилизовать.

Источник

Щелкните правой кнопкой мыши, чтобы отредактировать этот новый файл, и вставьте содержимое из файла category.php.

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

Например, если вы хотите включить текст, который представляет сообщения в категории, вставьте следующий код в файл category-categoryname.php:

 
   <p>
This is some text that will display at the top of the Category page.
</p>
 

Вы хотите, чтобы вставить этот фрагмент кода выше Петля раздел файла шаблона. Цикл – это PHP-код, используемый WordPress для отображения сообщений. Его можно найти в index.php вашей темы и в любых других шаблонах, используемых для отображения информации о публикациях. Цикл в этих папках может выглядеть по-разному – иногда он будет содержать десятки строк кода, а иногда всего несколько. Базовый цикл выглядит так:

 
   <?php if (have_posts() ): ?>
<?php while (have_posts() ): the_post(); ?>
<!-- do stuff ... -->
<?php endwhile; ?>
<?php endif; ?>

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

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

Стиль отдельных категорий в WordPress с помощью CSS

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

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

Чтобы узнать идентификатор категории, вы можете проверить страницу категории на панели инструментов WordPress. После входа в личный кабинет перейдите в «Сообщения» > «Категории». Затем наведите указатель мыши на категорию, которую хотите изменить, и нажмите «Просмотр». На скриншоте ниже я проверю категорию «Без категории».

Щелкните правой кнопкой мыши в любом месте страницы и выберите «Проверить» в раскрывающемся меню.

Откроется новое окно, в котором будут показаны выходные таблицы стилей HTML и CSS. Ничего страшного, если ты не все понимаешь на странице. Просто найдите CSS-класс category-categoryname, который содержит идентификатор категории в теге body (который начинается с <body class =). Как вы можете видеть на снимке экрана ниже, идентификатор категории «Без категории» равен «1».

Теперь предположим, что вы хотите изменить цвет заголовка на странице «Без категории» на красный. Затем вы должны перейти в «Внешний вид» > «Настроить», чтобы запустить интерфейс настройщика тем WordPress. Щелкните вкладку Additional CSS на панели инструментов.

Источник

Скопируйте и вставьте следующую строку кода:

 
   .category-1 .l-titlebar-content h1 { color: #f00; }

Обязательно нажмите кнопку «Сохранить и опубликовать», когда закончите.

Существуют и другие фрагменты кода CSS, которые можно использовать для настройки цвета фона, размера шрифта и других свойств страниц категорий для создания уникального сайта.

Взять под контроль внешний вид вашего сайта

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

Источник записи: https://blog.hubspot.com

<?php the_excerpt(); ?>

<?php the_content(); ?>

<?php
/**
* A Simple Category Template
*/

get_header(); ?> // выбираем шаблон хидера

<section id="primary" class="site-content">
<div id="content" role="main">

// проверяем, есть ли записи для отображения
<?php if ( have_posts() ) : ?>

<header class="archive-header">
// В виду того, что этот шаблон будет использоваться только для рубрики Design
// мы можем прям здесь добавить заголовок категории и ее описание.
// или даже добавить изображение или изменить страницу полностью.

<h1 class="archive-title">Design Articles</h1>
<div class="archive-meta">
Статьи и обучающие материалы о дизайне и web.
</div>
</header>

<?php

// Цикл
while ( have_posts() ) : the_post();
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
<small><?php the_time('F jS, Y') ?> by <?php the_author_posts_link() ?></small>

<div class="entry">
<?php the_excerpt(); ?>

 <p class="postmetadata"><?php
  comments_popup_link( 'No comments yet', '1 comment', '% comments', 'comments-link', 'Comments closed');
?></p>
</div>

<?php endwhile; // Конец цикла

else: ?>
<p>Sorry, no posts matched your criteria.</p>

<?php endif; ?>
</div>
</section>

//выбираем шаблоны сайдбара и футера
<?php get_sidebar(); ?>
<?php get_footer(); ?>

<?php if ( have_posts() ) : ?>

<header class="archive-header">

<?php if(is_category( 'Избранное' )) : ?>
	<h1 class="archive-title">Featured Articles:</h1>
<?php  else: ?>
	<h1 class="archive-title">Архив рубрики: <?php single_cat_title(); ?> </h1>
<?php endif; ?>

</header>

Теги: wordpress код рубрика шаблоны