CSS-Style Body über „Benutzerdefinierte Felder“

Hier möchtre ich weiteren Auszeichnungsstil für 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 Bereiche (also nur Sektoren, wie .single .site-header usw., s. Inbegriff) die Auszeichnung im CSS Stylesheet Editor geeignet ist.

Zur individuellen Auszeichnung von Seite/Beitrag 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/Vorlage dieses Hinweises von texto.deEinzelnen 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: FTP-Programm, Web-Host-Server (wordpress/wp-content/themes/Dein Theme), z. B. den Namen tuts. Dieser Ordner ist für die CSS-Dateien, welche sodann hier hochzuladen sind.
    • Mit Child Theme, Beispiels twentyfourteen-child, ist der Ordner tuts und deren Inhalt in twentyfourteen-child zu erstellen.
  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);
}

Die Datei in das FTP-Programm laden und diese 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. Beispielsseite und Danksagung, +1 Monika„Salzstangerl“

Bemerkungen Notiz-Styles
Arbeitsvorgang