Thumbnail Overlay für Kategorie angepassen?

Es kann dir sicherlich jemand weiterhelfen. Und es ist möglicherweise sogar noch viel einfacher, als dein Ansatz …

… aber irgendwie wird nicht richtig klar, was du willst.

„Wenn man eine Kategorie auswählt für einen Beitrag“ – das tut man normalerweise, wenn man einen Beitrag verfasst. Das meinst du aber ziemlich sicher nicht, oder?

Wenn ich auf einer Seite bin und lesen / mich informieren möchte, dann klicke ich entweder einen Beitrag an, der mich in seiner Vorschau / Titel / was-auch-immer irgendwie anfixt und den ich deswegen lesen möchte. Oder ich klicke eine Kategorie an, weil ich die Einschätzung habe, dass ich innerhalb dieser Kategorie Beiträge finde, die für mich interessant sein könnten.

Für das eingestellte jpg-Bild finde ich keine Entsprechung auf der verlinkten Seite.

Also bitte nochmal zurück auf Los! und erklären, wo zu finden ist, was du meinst … dann kann man über eine Antwort auf der Sach- statt auf der Meta-Ebene nachdenken.

Gruß
helix

Doch, jetzt ist mir schon viel klarer (und was mir nicht klar ist, ist Sache vom CSS, das kommt dann sowieso erst später).

Soweit ich das sehe, ist das ein eigenes Theme?
Kannst du bitte mal den Code posten, mit dem du die Beiträge auf der Startseite ausgibst?

Konkret: es wird ausgegeben

<article class="post">

Du kannst dem <article>-Tag ohne weiteres eine weitere Klasse verpassen, die sich dynamisch aus der ID oder dem Slug deiner Kategorie generiert.
Wenn dir damit schon die Schuppen von den Augen fallen und du weißt, was du zu tun hast, brauchst du deinen Code natürlich nicht zu posten. Ansonsten ist es hilfreich, den zu sehen, um zu sehen, wie man es gut intergrieren kann.

Und mit deiner kategoriespezifischen Klasse kannst du nachher einfach über CSS deine verschiedenen Beiträge mit verschiedenen Labels über dem Thumbnail versehen.

Gruß
helix

Okay, auf ’ne Art die einfachste Lösung ist, wenn du die WP post_class ergänzst. Probier mal aus, was passiert, wenn du statt deiner Klasse (soweit ich sehe, wird die Klasse .post bei Beiträgen schon standardmäßig mit ausgegeben) diese post_class ausgeben lässt. Einfach

<article <?php post_class(); ?>>

Siehe https://codex.wordpress.org/Function_Reference/post_class

Wenn dir das viel zu viel ist, was ausgegeben wird, kannst du es auch über get_the_category(); versuchen.
Siehe: https://developer.wordpress.org/reference/func…t_the_category/

Gruß
helix

Das ist doch schonmal sehr gut.

Zuvor hatte dein <article>-Tag die css-Klasse .post
Die hast du jetzt immer noch (ist ein bisschen nicht-sehr-übersichtlich, wenn so viele Klassen ausgegeben werden, die einzelnen Klassen sind immer mit Leerzeichen getrennt, d.h. die zweite Klasse ist dann .post), d.h. was auch immer du über diese Klasse angesprochen hast, wird weiterhin funktionieren.
Und deine letzte Klasse setzt sich immer zusammen aus category, einem Bindestrich und dann der aktuellen Kategorie.

Genau – worauf ich hinaus will: Den Rest machst du über CSS.
Ich bin ziemlich sicher: Wenn du mit deinem Theme schon so weit gekommen bist, wie du jetzt bist, dann bekommst du das auch hin. (Und es ist gut, die Fragen, die vielleicht noch aufkommen, hier öffentlich abzuhandeln, dann haben andere auch was davon.)

Beim derzeitigen Stand der Desing-Entwicklung, sprich, was du oben als Darstellungswunsch beschrieben hast, würde ich mit der Pseudoklasse :after arbeiten, etwa so:

.category-aktuellekategorie img:after {
content: url(bilder/deindateiname.png);
position: absolute;
z-index: 117;
}

Das Bild liegt in dem Fall in einem Ordner „bilder“ im gleichen Ordner wie deine style.css, also wahrscheinlich im Theme-Ordner.
z-index: 117 ist eine völlig fiktive Zahl, in vielen Fällen kann die Zahl viel niedriger sein, manchmal braucht man einen höheren Wert, kommt drauf an, was noch alles absolut und mit z-index positioniert ist …
Du brauchst sicherlich noch Angaben zur Ausrichtung, wie das Bild positioniert sein soll. Und dein übergeordnetes <div> sollte mit position: relative; versehen sein, sonst kommst du mit der absoluten Positionierung nicht zurande.

Gruß
helix

Beiträge ohne Artikelbild: entweder du kriegst in deinen CSS-Code doch wieder das img-Element rein (wo kein Artikelbild, wird auch kein <img /> ausgegeben, also kann auch nix :before oder :after von diesem img sein).
Oder mit einer if-Abfrage den Code so umstellen, dass dein <div> mit der Klasse .post-thumbnail überhaupt nur ausgegeben wird, wenn ein Artikelbild festgelegt ist.

if ( has_post_thumbnail() ) {
the_post_thumbnail();
}

Natürlich dann noch mit deinen Auszeichnungen dazu.

Bei mehreren zugewiesenen Kategorien greift zunächst einmal die Definition für die zutreffende Klasse, die als letztes in deiner style.css steht (spätere Definitionen überschreiben frühere Definitionen).
Als Workaround kannst du (solange das nicht viele sind) zusätzlich Einzel-IDs (die du ja auch in deiner post_class mit ausgegeben hast) abweichende Definitionen verpassen.
Sonst dich doch mal in den anderen Ansatz mit get_the_category(); einlesen. Auf der verlinkten Seite ist auch ein Beispiel, wie man nur die jeweils erste Kategorie kriegt, wenn es mehrere sind. Wobei dann auch immer die Frage ist, ob die erste Kategorie die (in der Darstellung) bevorzugte Kategorie ist …

Gruß
helix

Ich denke schon, dass du hier „im Loop“ bist – nur in einem anderen. Wissen kann ich das natürlich nicht. Mein Browser zeigt mir dein PHP nicht an …
Versuche doch mal dem Element <div id="content2"> auch wieder die post_class zu verpassen.

Gruß
helix