최신 항목과 카테고리를 위한 CSS 클래스

제품 지원
1

찾아보고 시도해 볼 수 있는 모든 것을 해 보았지만, 이 문제에 대한 해결책을 찾지 못했습니다. 특정 카테고리와 /latest 및 /categories 페이지에 콘텐츠를 추가해야 합니다.

카테고리를 위해 다음과 같이 처리했습니다:

body.category-image-critiques-avian-critiques .featured-tiles::before,
body.category-image-critiques-flora-critiques .featured-tiles::before,
body.category-image-critiques-human-fauna-critiques .featured-tiles::before,
body.category-image-critiques-landscape-critiques .featured-tiles::before,
body.category-image-critiques-macro-critiques .featured-tiles::before,
body.category-image-critiques-night-critiques .featured-tiles::before,
body.category-image-critiques-weekly-challenge .featured-tiles::before,
body.category-image-critiques-wildlife-critiques .featured-tiles::before,
body.category-image-critiques-abstract-critiques .featured-tiles::before,
body.category-image-critiques .featured-tiles::before {
  content: "Recent Editors' Picks";
  font-size: 1.5em;
}

하지만 latest와 categories에도 이 내용을 적용해야 합니다. .navigation-topics를 사용하면 어느 정도 이 효과를 낼 수 있지만, 카테고리는 적용되지 않으며, /top 등의 페이지에는 이 콘텐츠가 표시되지 않아야 합니다.

.categories-and-latest라는 클래스가 있지만, 다음과 같이 사용할 때 작동하지 않는 것 같습니다:

.categories-and-latest .featured-tiles::before {
  content: "Recent Editors Picks";
  font-size: 1.5em;
}

어떤 아이디어가 있을까요? 뭔가 사소한 것을 놓치고 있는 것 같기도 하고, 아예 불가능한 것일 수도 있습니다.

2

안녕하세요, 네, 이렇게는 작동하지 않습니다.

이렇게 시도해 보세요 :slightly_smiling_face:

body.categories-list.navigation-categories .featured-tiles::before,
body.navigation-topics .featured-tiles::before {
  content: "Recent Editors Picks";
  font-size: 1.5em;
}
3

Don, 감사합니다. 카테고리에는 잘 작동하는데, 최신(Latest)은 어떻게 해야 하나요?

4

아 맞다, 아까 위에 글을 수정했네요. :slightly_smiling_face:

5

감사합니다. 하지만 body.navigation-topics의 문제는 /top, /unread 등에 표시된다는 점입니다.

6

Featured Tiles가 표시되는 모든 위치에 이 텍스트를 추가하고 싶으신가요?

네, 그렇다면 다음과 같은 방식으로 표적(target)을 지정하는 것이 가장 쉬울 것 같습니다.

.featured-tiles > div:not(:empty)::before {
  content: "Recent Editors Picks";
  font-size: 1.5em;
}
7

네! 당신은 정말 천재군요, 돈! 정말 감사해요!