[Gelöst] CSS je nach Seite oder Kategorie wechseln

(@thomas-kujawa)

Guten Tag.

Ich bin ein neuer WordPressnutzer und möchte die CSS-Datei (Farbe etc.) je nach Seite bzw. Kategorie ändern.

Hierzu nutze ich erfolgreich das Plugin Code Insert Manager mit dem ich folgenden Code (im Web gefunden und individuell angepasst) im Header ausgeben lasse.

<?php if (is_page('14085') || is_page('14086') || is_page('14105')) { ?>
<link rel="stylesheet" id="b3theme-css" href=".....dienst.css?ver=3.8" type="text/css" media="all">
<?php } elseif (is_page('10721') || is_page('10745') || is_page('10698')) { ?>
<link rel="stylesheet" id="b3theme-css" href="....hr.css?ver=3.8" type="text/css" media="all">
<?php } elseif (is_page('8434') || is_page('8452') || is_page('8468')) { ?>
<link rel="stylesheet" id="b3theme-css" href=".....ma.css?ver=3.8" type="text/css" media="all">
<?php } elseif (is_category('5') || post_is_in_descendant_category('5')) { ?>
<link rel="stylesheet" id="b3theme-css" href=".....hr.css?ver=3.8" type="text/css" media="all">
<?php } elseif (is_category('6') || post_is_in_descendant_category('6')) { ?>
<link rel="stylesheet" id="b3theme-css" href=".....ma.css?ver=3.8" type="text/css" media="all">
<?php } elseif (is_category('7') || post_is_in_descendant_category('7')) { ?>
<link rel="stylesheet" id="b3theme-css" href=".....dienst.css?ver=3.8" type="text/css" media="all">
<?php } else { ?>
<link rel="stylesheet" id="b3theme-css" href="...news.css?ver=3.8" type="text/css" media="all">
<?php } ?>

Ich hoffe, es ist verständlich:

Wenn die aufgerufene Webseite eine der Seiten …. oder zu der Kategorie (oder darunter liegend) … gehört, soll das …-css geladen werden. Es gibt genau 4 CSS. 3 + Fallback.
Wenn nichts zutrifft, soll ein ‚Fallback‘-CSS geladen werden.

Folgendes ist aktuell o.k.:

Ist es eine Seite, also trifft die Page-Id zu, wird das richtige CSS geladen. Ist die aufgerufene Webseite die Kategorieübersichtsseite, wird auch das richtige CSS geladen.

Wird allerdings ein Beitrag geladen (Testausgabe mit Kategorieausgabe funktioniert), wird allerdings das Fallback-CSS geladen.

Keine Änderung ergibt sich, wenn die Page- und Kategorie-Abfrage in ein if / elseif gepackt werden.

Wäre nett, wenn jemand mit einem Hinweis weiterhelfen könnte.

Ansicht von 8 Antworten - 1 bis 8 (von insgesamt 8)

Moderator Torsten Landsiedel
(@zodiac1978)

vor 9 Jahren, 11 Monaten

Ließe sich das nicht einfacher mit Body-Klassen lösen:
http://codex.wordpress.org/Function_Reference/body_class

Ich habe auch noch nicht ganz verstanden, was jetzt genau deine Frage ist.

Gruß, Torsten

Thread-Starter Thomas Kujawa
(@thomas-kujawa)

vor 9 Jahren, 11 Monaten

Hallo Torsten.

Vielen Dank und entschuldige, wenn ich mich nicht verständlich ausgedrückt habe.

Ziel: Ich habe eine bestimmte Anzahl von Pages, die für 3 Zielgruppen sind. Zusätzlich gibt es 3 Kategorien denen die Beiträge zugeordnet werden.

Plan: Über die Abfrage der Page-ID bzw. der Category wollte ich die speziellen CSS zuweisen.

Den Code

‚// add category nicenames in body and post class
function category_id_class($classes) {
global $post;
foreach((get_the_category($post->ID)) as $category)
$classes[] = $category->category_nicename;
return $classes;
}
add_filter(‚post_class‘, ‚category_id_class‘);
add_filter(‚body_class‘, ‚category_id_class‘);‘

habe ich bereits eingebaut und im body gibt es auch die Kategorienamen.

Allerdings kann ich doch die css jetzt nicht zuweisen oder verstehe ich da etwas falsch ?

Meine Vermutung war ein Fehler im Ausgangscode.
Moderator Marcus Spanier
(@espiat)

vor 9 Jahren, 11 Monaten
Hallo,

ich glaube das was Torsten meint und zudem auch mein Vorschlag wäre ist folgender:

Du erhälst nun durch die verschiedenen body classes zB folgendes im body:
Wenn du dich in der Kategorie „Menschen“ befindest:
```
<body class="... class-menschen">
```
Wenn du dich in der Kategorie „Tiere“ befindest:
```
<body class="... class-tiere">
```
anhand dieser verschiedenen Klassen kannst du deine CSS dementsprechend anpassen:
```
/* Eigenschaften für body ohne spezielle Klasse */
body {
background:yellow;
width:960px;
padding:20px;
}
body .class-menschen{
background:red;
}
body .class-tiere{
background:green;
}
```
Das ist jetzt nicht von mir getestet, aber sollte theoretisch funktionieren.

Der Trick dabei ist, dass du dadurch das Pflegen von mehreren CSS Dateien vermeidest und einheitliche Eigenschaften von Klassen/ ID’s nicht mehrmals vergibst.
Thread-Starter Thomas Kujawa
(@thomas-kujawa)

vor 9 Jahren, 11 Monaten

Vielen, vielen Dank !

Werde ich im Laufe des Tages umsetzen.

Thomas

P.S.: Ich hatte mir jetzt zwar mühsam eine eigene andere Lösung erarbeitet – im Ausgangscode stimmte irgendwas mit dem is_category nicht, aber Deine Lösung hat, wie Du selbst geschrieben hast, eine Menge Vorteile.

Moderator Torsten Landsiedel
(@zodiac1978)

vor 9 Jahren, 11 Monaten

ich glaube das was Torsten meint und zudem auch mein Vorschlag wäre ist folgender

Genau das meinte ich. Vor allem wegen der schon genannten Vorteile:

Der Trick dabei ist, dass du dadurch das Pflegen von mehreren CSS Dateien vermeidest und einheitliche Eigenschaften von Klassen/ ID’s nicht mehrmals vergibst.

Gruß, Torsten

Moderator Marcus Spanier
(@espiat)

vor 9 Jahren, 11 Monaten

Zu deinem PS:

Es gibt einen Unterschied zwischen in_category und is_category.
http://codex.wordpress.org/Function_Reference/is_category
http://codex.wordpress.org/Function_Reference/in_category

Möglicherweise war dies dein Fehler?

Thread-Starter Thomas Kujawa
(@thomas-kujawa)

vor 9 Jahren, 10 Monaten

nochmal (und abschließend) ein Dank an die Unterstützung.

Ich konnte das Layout nun wie gewünscht/gedacht anpassen, die einzelnen css-Dateien sparen und somit viel Aufwand vermeiden.

Danke !

Moderator Marcus Spanier
(@espiat)

vor 9 Jahren, 10 Monaten

Bitteschön und weiterhin viel Erfolg.

Ansicht von 8 Antworten - 1 bis 8 (von insgesamt 8)

Das Thema „[Gelöst] CSS je nach Seite oder Kategorie wechseln“ ist für neue Antworten geschlossen.

[Gelöst] CSS je nach Seite oder Kategorie wechseln

Themen-Schlagwörter

Ansichten