Пользовательские стили для страниц категорий

Question

Пользовательские стили для страниц категорий

Есть ли способ, чтобы стили на странице отображались по-разному для определенных категорий при просмотре страницы, которая относится только к этой категории?

1

3 answers

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

Просто используйте их в своей теме:

category-slug.php
category-ID.php

1

Author: EAMann, 2010-08-23 18:08:37

Что сказал Эрик. Но если вы хотите изменить только стиль, а не разметку, есть более простой способ. Пока ваша тема включает вызов body_class() в открывающем теге body, WP добавит на вашу страницу всевозможные полезные CSS-хуки. Разметка по умолчанию добавит следующие классы к элементу body в архиве категорий:

архив
категория
категория-слизняк

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

0

Author: goldenapples, 2010-08-23 18:49:20

score 4 · Accepted Answer

У @EAMann есть отличный ответ, если вам нужны разные макеты для разных категорий. OTOH если вы хотите изменить CSS только для того, чтобы, например, иметь другой цвет фона для каждой категории, то вы обнаружите, что большинство тем будут включать категорию slug в качестве CSS-класса в элементе <body> и/или, возможно, другие HTML-элементы, выводимые темой. (И даже если ваша тема этого не делает, вы всегда можете добавить эту функциональность самостоятельно.)

Например, Тема TwentyTen делает именно это; для следующего URL:

Http://example.com/category/category-1/

Вот как выглядит элемент <body>:

<body class="archive category category-category-1">

Зная вышесказанное, вы могли бы добавить следующие стили в файл вашей темы style.css, чтобы иметь разные цвета фона для каждой страницы (я, конечно, очень упрощаю здесь; ваш фактический CSS, безусловно, был бы более сложным):

/* style.css */
body.category-category-1 {
  background-color: red;
}
body.category-category-2 {
  background-color: green;
}
body.category-category-3 {
  background-color: blue;
}

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

Используйте дочернюю тему

Конечно, вы, вероятно, не хотите изменять свою тему style.css; вы, вероятно, хотите создать Детская тема вместо этого. Вот несколько ответов, в которых я говорю о детских темах:

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