Möglich ist das sicher alles.
Die Frage ist, ob du selber etwas programmieren möchtest oder ein Plugin benötigst.
Über Body-Klassen und CSS ließe sich das manuell umsetzen.
Gruß, Torsten
Ich hätte jetzt mehr an custom fields gedacht. Ggf. mit Plugin Advanced Custom Fields. Setzt aber immer noch voraus, dass man das im Template ausliest.
Wie genau setzte ich das mit Custom Fields bzw. CSS & Body-Klassen am besten und einfachsten um?
Vielen Dank schonmal für die Hilfe!
Das geht zwar eigentlich über die üblichen Hilfestellungen hinaus, aber ich versuch trotzdem, es in wenigen Zeilen zu beschreiben:
Plugin Advanced Custom Fields installieren, aktivieren
Im Back End: Menü Eigene Felder > Neu erstellen
Name der Feldgruppe: Hintergrundbild.
Neues Feld:
Bezeichnung: Hintergrund
Name: hintergrund
Feld-Typ: Bild
Rückgabewert: Bild-URL
Größe: Thumbnail (ist nur für die Vorschau beim Editieren der Seite)
Position: Artikel-Typ ist gleich page
In Datei wp-content/themes/solon/functions.php unten anhängen:
/*
* Hintergrund
*/
add_action('wp_head', 'hintergrundbild');
function hintergrundbild() {
$image = get_field('hintergrund');
if( empty($image) ) return;
$out = '<style type="text/css">';
$out .= 'body { background: url("'. $image .'") no-repeat center center;}';
$out .= '</style>';
echo $out;
}
Das Hintergrund-Bild sollte nicht zu groß ausfallen (keine 3 MB großen Bilder). Am besten schon vor dem Upload auf ein gescheites Maß, z.B. 1920px Breite, verkleinern.
vielen Dank! Ich hab soweit alles eingegeben und es an folgender URL ausprobiert: http://awayfromlife.com/home/info/
Konnte unter Seite bearbeiten auch ein Bild unter Hintergrund hochladen, doch leider wird das nicht angezeigt. Die function.php habe ich auch angepasst.
An was könnte es liegen, dass es nicht funktioniert? Brauch das Bild eine Mindestgröße?
So wie es aussieht, überschreibt momentan dein unter Design > Anpassen ausgewählter Hintergrund den individuellen Seiten-Hintergrund. Also entweder den Hintergrund bei Design > Anpassen löschen, oder das Stylesheet mit !important priorisieren:
/*
* Hintergrund
*/
add_action('wp_head', 'hintergrundbild');
function hintergrundbild() {
$image = get_field('hintergrund');
if( empty($image) ) return;
$out = '<style type="text/css">';
$out .= 'body { background: url("'. $image .'") repeat top center !important;}';
$out .= '</style>';
echo $out;
}
In diesem Code-Schnipsel habe ich auch Wiederholung (repeat) und Ausrichtung (top) geändert. Du kannst ja ein bisschen ausprobieren, was besser passt.
Mercy! Das priorisieren mit Important funktioniert bestens.
Kann ich das Bild jetzt noch irgendwie fixieren, wie das Standardhintergrundbild wie bei der Startseite?
Vielen, vielen Dank! Das hätte ich nie hinbekommen.
Kann man denn ein Custom Field auch einer Kategorie-Übersichtsseite geben?
Da könnte man per CSS (Child-Theme oder Custom CSS Plugin) z.B. so das Hintergrundbild ändern:
body.category-1 {
background-image: URL(Pfad-zum-Bild);
}
In diesem Fall für die Kategorie mit der ID 1. Die Body-Klassen der unterschiedlichen Seiten kann man im Codex nachlesen oder selbst im Quelltext nachschauen.
Gruß, Torsten
@torsten Hm, das würde ich wahrscheinlich eher über Conditional Tags in der archive.php abbilden oder mit einer Extraseite mit Theme-Optionen, bei der man den Kategorien Bilder zuweist. Ist allerdings vermutlich nicht mit zwei Zeilen Code erledigt.
@awayfromlife Das sollte mit background-attachment:fixed recht einfach zu lösen sein:
/*
* Hintergrund
*/
add_action('wp_head', 'hintergrundbild');
function hintergrundbild() {
$image = get_field('hintergrund');
if( empty($image) ) return;
$out = '<style type="text/css">';
$out .= 'body { background: url("'. $image .'") repeat top center !important; background-attachment: fixed; }';
$out .= '</style>';
echo $out;
}
PS: Ich bin immer wieder überrascht, welche Möglichkeiten ACF bietet. Anscheinend kann man auch Kategorien ein Bild zuzuweisen.
background-attachment:fixed ging super. Musste nur inmportant anhängen.
Und wie genau kann man mit ACF Kategorien Hintergrundsbilder zu weisen? Nutze auch ein paar Kategorie-Seiten im Menü. Das wäre perfekt, wenn das klappen würde.
Ein Wunsch, der in Erfüllung geht …
Zunächst musst du das Feld in Advanced Custom Fields unter „Position“ um eine neue Regelgruppe erweitern: „Taxonomy-Term ist gleich Kategorien“.
Wenn du anschließend eine neue Kategorie anlegst und sie bearbeitest (also nochmal im rechten Fenster anklicken), kannst du ein Bild für die Kategorie festlegen.
Damit auch für Kategorien ein entsprechendes Stylesheet hinzugefügt wird, muss der Code in der functions.php entsprechend angepasst werden (das meinte ich mit Condittional Tag, s.o.):
/*
* Hintergrund
*/
add_action('wp_head', 'hintergrundbild');
function hintergrundbild() {
if(is_category()) {
$image = get_field('hintergrund', 'category_'.get_query_var('cat'));
} else {
$image = get_field('hintergrund');
}
if( empty($image) ) return;
$out = '<style type="text/css">';
$out .= 'body { background: url("'. $image .'") repeat top center !important; background-attachment: fixed; }';
$out .= '</style>';
echo $out;
}
Idealer wäre übrigens, den Code in die functions.php eines Child-Themes zu schreiben, weil sonst Änderungen beim nächsten Theme-Update überschrieben werden.
PS: Torsten, ich denke wir können das Thema dann endgültig als [resolved] markieren? 🙂
Ok ich kann jetzt nachdem ich auf „Kategorie bearbeiten“ geklickt habe ein Hintergrundbild hinzufügen.
Ich habe den Code auch in die function.php eingebaut, aber sobald ich auf folgende Kategorie gehen: http://awayfromlife.com/category/interview/ ist das Hintergrundbild immer noch das normale Background Image, obwohl unter Kategorie bearbeiten ein anderes angewählt ist.
Habe ich irgendetwas übersehen und wo genau findet man die Child-Themes?
Hast du vielleicht vergessen, die Kategorie nach dem Hinzufügen des Hintergrundbilds zu aktualisieren?
Zu Child Themes gibt es nun wirklich genügend deutschsprachige Anleitungen. Zum Beispiel bei die-netzialisten.de
ist aktualisiert. Hast du vielleicht eine Idee an was es liegen könnte? Muss ich etwas priorisieren, oder an den Code anpassen?
Wenn das noch klappen würde, wäre ich endlich mit der Umsetzung fertig. Tut mir Leid deine Zeit und Nerven so strapazieren zu müssen, aber bin dir wirklich dankbar für die Hilfe!
