Bild im "page-header" einer Seite zuweisen

    Hallo zusammen,


    ich bin gerade dabei mich in CSS einzuarbeiten. Einige Dinge klappen auch schon ganz gut aber bei folgendem Problem brauche ich Hilfe:


    Ich verwende das Theme OceanWP und möchte im Bereich "page-header" Bilder bestimmten Seiten zuordnen.


    Mit folgendem Befehl kann ich das Bild für alle Seiten erfolgreich ändern:


    CSS
    .page-header {
background-image: url(URL);
}

    Wenn ich die Seiten-id wie folgt enbinde passiert leider nichts:


    CSS
    .page-header-id-[Seiten ID] {
background-image: url(URL);
}

    Wenn ich als Selektor nur die verwedete id nehme, ändert sich das Hintergrundbild auf der Seite. Also stimmt die id definitiv. Nur in Verbindung mit ".page-header" passiert nichts.


    Wäre lieb wenn mir jemand sagen kann, was ich falsch mache!


    Beste Grüße

    ricas

    Wenn ich raten würde ,wäre mein Ergebniss so

    Code
    .page-id-12 .page-header{
     background-image: url(URL);
}

    Die 12 muß natürlich in deiner Id getauscht werden.

    Wenn das nicht geht solltest du mal einen Link zu deiner Seite posten , dann kann man das genauer sagen

    Hallo,


    danke für deine Antwort!


    Das hat leider nicht geklappt.


    Hier findest du meine Seite. Ich habe den Coming Soon mode vorrübergehend deaktiviert.


    Ich würde gerne das Foto für die Seite Bootfahren (ID-50) wechseln. WIe ich oben schreibe geht es um den Bereich, der mit in der Entwicklerkonsole als ""page-header" angezeigt wird.

    Du weißt aber das deine verlinkte Seite page id 2 ist oder ?

    Nehme ich meinen Code von heute morgen auf der richtigen Seite dann geht das auch schon.

    Man kann da auch noch genauer dran gehen zb

    Code
    .page-id-2 .background-image-page-header

    Falls du dir nicht sicher bist welche Seiten Id du gerade bist,

    das kann man an den Link sehen , oder du kuckst im Quelltext . bei body im class Name steht page-id-2 drinne.


    Mit den page-id kann besonders einfach jede Seite anders anpassen.

    Sorry- ich habe die Startseite verlinkt. Konkret geht es mir um die Seite mit der Id 50 (Bootfahren).


    Jetzt- grade beim tippen ist mir der Fehler aufgefallen: Ich habe das Leerzeichen vergessen ".page-id-50.page-header".


    Klar das es dann in der Kombination funktioniert^^


    Trotzdem tausend Dank für deine Hilfe :)

    Zitat von m.scatello

    Falsche Herangehensweise!


    Bei WordPress stellt man das Header-Image nicht per CSS ein, sondern im Backend per Beitragsbild für jede Seite.

    In diesem Theme (OceanWP) scheinbar nicht?!

    Wenn ich im Beitragsbild der jeweiligen Seite Änderungen vornehme passiert nichts. Auch in der Seitenvorschau nicht.

    Lediglich im Customizer lässt sich der Bereich unter Seitentitel ansprechen.


    Oder halt als CSS...


    Was hat das für Konsequenzen wenn ich es mit CSS mache?

    Wenn du ein Child-Theme erstellt hast (was man eigentlich grundsätzlich machen sollte), dann kannst du das relativ einfach selber anpassen, in dem du in der page.php das Bild selber einbaust. Beispiel:


    PHP
    <div class="banner" style="background-image:url(<?php echo get_the_post_thumbnail_url(); ?>);">
    Zitat von m.scatello

    Wenn du ein Child-Theme erstellt hast (was man eigentlich grundsätzlich machen sollte), dann kannst du das relativ einfach selber anpassen, in dem du in der page.php das Bild selber einbaust. Beispiel:


    PHP
    <div class="banner" style="background-image:url(<?php echo get_the_post_thumbnail_url(); ?>);">

    Das habe ich gemacht. Aber Irgednwas habe ich dabei scheinbar falsch gemacht.


    Zum Beispiel funtionieren alle CSS Befehle die ich im Customizer eingebe wunderbar. Wenn ich sie in der style.css eintrage passiert irgendwie nichts.


    Wo soll ich auf Fehlersuche gehen?

    ich weiß ja nicht wie weit sich m.scatello sich mit WP auskennt , oder die anderen hier , aber notfalls solltest du da mal in einen WP Forum fragen weil die sich mit ihren gedönst an besten auskennen.


    Denke aber auch daran das du die ganzen änderungen , die du in der Css gemacht hast erst wieder rückgängig machst oder auskommentierst , dann sollte der Tip von m.scatello was er in #8 geschrieben hat auch klappen.

    Zitat

    Wenn ich sie in der style.css eintrage passiert irgendwie nichts.

    Das kann nicht sein, wenn du alles richtig gemacht hast. Da hier aber niemand weiß, wie und was du genau gemacht hast, wird dir so niemand helfen können.

    Zitat von basti1012

    ich weiß ja nicht wie weit sich m.scatello sich mit WP auskennt , oder die anderen hier , aber notfalls solltest du da mal in einen WP Forum fragen weil die sich mit ihren gedönst an besten auskennen.


    Denke aber auch daran das du die ganzen änderungen , die du in der Css gemacht hast erst wieder rückgängig machst oder auskommentierst , dann sollte der Tip von m.scatello was er in #8 geschrieben hat auch klappen.

    Danke für den Tipp! Letzteres habe ich getan.


    Zitat von m.scatello

    Das kann nicht sein, wenn du alles richtig gemacht hast. Da hier aber niemand weiß, wie und was du genau gemacht hast, wird dir so niemand helfen können.

    Ich habe die Dateien vom "Theme-Autor" über github als Downlaod bezogen. Hier der Link. Keine Ahnung was man da falsch machen kann. Offensichtlich genug :( Ich Probiers noch einmal.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden