CSS-Style Body über „Benutzerdefinierte Felder“

Hier möchte ich weiteren Auszeichnungsstil für „Seiten“ Body anmerken. Vornweg der Möglichkeit im Stylesheet Editor über die Seiten-ID (ID-Selektor) nun zu „Benutzerdefinierte Felder“, wobei das Letztere für mehrere „Seiten“ ein Nonplusultra, aber für gesamte Bereiche (also nur Sektoren, wie .single .site-header usw., s. Inbegriff ⇔) die Auszeichnung im CSS Stylesheet Editor geeignet ist.

Zur individuellen Auszeichnung von Beiträgen ebenso geeignet – aber für gesamten Bereich (Kategorie) scheint mir hierzu Auszeichnung der Kategorien ⇔ im CSS Stylesheet Editor als das geeignetere. – Hinzu gleich die Anmerkung: CSS-Style betreffs der Kategorie (s. letzten Link) gehen vor den der „Benutzerdefinierten Felder“.

Die „Benutzerdefinierten Felder“ sind im Editor über „Ansicht anpassen“ und dem Häkchen hierzu, unter dem Editorbereich benutzbar.

Es ist nur so als Merkzettel dieses Hinweises: einzelnen Artikeln oder Seiten ein spezielles Style zuweisen
Danksagung, +1 Monika

1.) Dem BdF eindeutigen „Namen“ eintragen, hierzu diesem Beispiel eignet sich stylesheet, sodann den „Wert“, das ist der spezifische Dateiname (welcher zur CSS Datei führt), z. B. kochrezepte.css

2.) Einen Ordner im Theme anlegen, über FTP Web-Host-Server (wordpress/wp-content/themes/Dein Theme), z. B. den Namen tuts (schlichtweg :-). Dieser Ordner ist für die CSS-Dateien, welche sodann hier hochzuladen sind..

3.) In der header.php des Themes das BdF holen:

Einzufügen in die header.php vor </head>

Codebeispiel – Beispiel,  da ja Pfade und Ordnernamen individuell anzupassen sind:

<?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"
 );
 }
}?>
  • Ohne Child Theme muss nach Theme-Update evt. dieser Code erneuert werden.

4.) Im Texteditor die CSS Datei erstellen, diese könnte in  etwa so aussehen:

Dateiname, der im BdF als „Wert“ eingetragen ist,

kochrezepte.css

.search-toggle {
background-color: #0EB26D;
}

.single .site-header, .single #secondary, .single .site:before {
background-color: TOMATO;
}

.single .site-footer {
background: -webkit-gradient(linear,0 0,0 100%,from(TOMATO),to(#FFA493));
background: -moz-linear-gradient(top,TOMATO,#FFA493);
}

Diese Datei in das FTP-Programm laden und diese wiederum durch FTP Zugriff Web-Host-Server, einsetzend vom geöffneten Ordner tuts in denselben hochladen.

Ohne Child Theme muss nach Theme-Update evtl.  der Ordner „tuts“ mitsammen Datei CSS-Code erneuert werden. Also diesen Ordner als Kopie auch in das FTP-Programm herunterladen/behalten. so braucht man diesen nach Theme-Update nur wieder auf den Web-Host-Servor hochladen.

S. Beispielseite: Salzstangerl ⇔

Bemerkungen Notiz-Styles
Beispiels eines workflow (oben die aktuellen)