einzelnen Artikeln oder Seiten ein spezielles Style zuweisen

CSS Datei pro Artikel

Manchmal braucht man einzelne CSS Deklarationen nur für eine Seite oder einen Artikel. Dann ist es einfach übersichtlicher auf die Dauer, wenn man diese in ein eigenes CSS gibt. Oder man mag überhaupt ein anders Style für nur eine Seite.. .
Man kann dies auf vielerlei Arten lösen. Hier zeige ich eine mit benutzerdefinierten Feldern.

Ich erkläre wie man sein Theme darauf vorbereitet, aber ich kann dies nicht für alle Themes der WordPress Welt erklären, weil es deren zuviele gibt ;).

Das benutzerdefinierte Feld erstellen.

benutzerdefinierte Felder erstellen

Wenn Du einen Artikel /Seite schreibst siehst du unterhalb des Schreibfeldes die benutzerdefinierten Felder. Sind sie nicht sichtbar dann mußt du rechts oben -gleich unterhalb des „Willkommen, Monika“ – auf Optionen einblenden klicken und dort die benutzerdefinierten Felder anhaken.

eindeutige Namen vergeben

Ich benenne diese Felder immer sehr eindeutig, sonst verlier ich irgendwann den Überblick, daher gab ich diesem Feld den Namen: stylesheet. Als Wert trage ich nur mehr den Dateinamen der zusätzlichen CSS Datei ein. zB.: mts-dl-css3.css

eigener Ordner für diese Dateien

In meinem ThemeOrdner habe ich via FTP den Ordner „tuts“ erstellt und dort lade ich die speziellen Styles via FTP hoch.

Klar, ich könnte diese CSS Dateien auch mittels Media Uploader holen und dann deren Url in das Feld „Wert“ eintragen. Das hat aber den Nachteil, dass meine Bilder und Medien in Jahres-und Monatsordner gespeichert werden.

Möcht ich also irgendwann eine dieser CSS Dateien ändern, muss ich sie mühsam in den Ordnern suchen. Daher nutze ich für diese Styles lieber FTP und lade sie hoch.

In der header.php des Child Themes das benutzerdefinierte Feld holen

Vor </head>.



<?php 
global $wp_query;
$postid = $wp_query->post->ID;
$styles = get_post_meta($post->ID, 'stylesheet', false);
if ($styles) {
    foreach($styles as $stylesheet) {
    echo(
        '<link rel="stylesheet" href="'.get_stylesheet_directory_uri()  .'/tuts/'.
        $stylesheet .'" type="text/css" media="all" />' .
        "\n"
    );
    }
}?>

Hier siehst du wie man ein benutzerdefiniertes Feld außerhalb des Loops holt.
Pfade kannst du anpassen, Ordnername logischerweise auch.

Und sonst einfach viel Freud und Spaß mit CSS Spielereien.
Wie das aussieht kannst Du dir hier bei dem Artikel im Quelltext ansehen. :-)

Auch wenn ich das spezielle Style hier in dem Artikel nicht nutze – weil es fast leer ist …

Ich hoff Du kennst dich gut aus, bei Fragen einfach fragen … und wars hilfreich, freu ich mich übers Weitersagen oder ein +1, Monika
9

9 Beiträge zu “einzelnen Artikeln oder Seiten ein spezielles Style zuweisen

  1. Kommentar Autor
    Birgit
    Kommentar

    Danke, Monika, das kann ich gut gebrauchen!

  2. Kommentar Autor
    Christine
    Kommentar

    Supeeerr!! Danke dir Monika endlich mal eine gescheite erklärung.

  3. Kommentar Autor
    Viktor
    Kommentar

    Danke Monika! Jetzt bin ich wieder schlauer!
    Eine Frage: Kann ich den Code irgendwie dynamischer machen, sprich, dass der alle gesetzten Custom Fields ausgibt (Wenn es mehrere gibt)

  4. Kommentar Autor
    Viktor
    Kommentar

    PS: Ich hätte gern eine Kommentar Abo auf Texto ;)

  5. Kommentar Autor
    Monika
    Kommentar

    ich hab das ABO wieder freigeschaltet,

    weiters: was magst du wo wie dynamisieren Viktor?
    wieviele CSS Dateien magst denn in den Header laden?

    ==> grad am Schlauch steh wozu du bei unterschiedlichen Styles pro Beitrag oder Seite mehrere Custom Fields brauchst

  6. Kommentar Autor
    Monika
    Kommentar

    oh ==> ich weiß nun wieso es hier keine Kommentarbenachrichtigung gibt, derzeit sind da alle Plugins irgendwie sehr tot,
    ich muss eine gänzlich andere Lösung finden und das kostet akut zuviel Zeit, das eine liefert Fehler, dass meinem Server schlecht wird, das neue hat keine FAQ wie man es richtig einrichtet :( tut mir leid Viktor

  7. Kommentar Autor
    Michael
    Kommentar

    Interessanter Beitrage, aber bei mir funktioniert es leider nicht. Er lädt die angegebene CSS Datei nicht

  8. Kommentar Autor
    Monika
    Kommentar

    Hi Michael
    hast Du auch den Pfad der Datei kontrolliert?
    wie sieht dein Code in der header.php aus und wo liegt die „neue CSS“ Datei und wo kann ich mir das online ansehen?

  9. Kommentar Autor
    Michael Peitz
    Kommentar

    Hallo Monika,

    Vielen Dank für die Beschreibung. Ich habe allerdings ein Problem. Vielleicht auch einen Denkfehler.
    Auf meiner Seite http://www.fotokunst75.de möchte ich die Galerie anders gestalten. Mit Schatten und weissen Hintergrund. Ich habe eine zweite Style css angelegt mit den Änderungen (style2.css)
    Diese habe ich in den Ordner „newcss“ kopiert und mit deinem Quellcode verknüpft.
    Auch habe ich eine Klasse „stylesheet“ im Portfolio angelegt. Das Design wird auch geladen, allerdings auf alle Seiten, nicht nur auf der Galerie-Seite. Hast du eine Ahnung, woran es liegt?

    Gruss Michael