CSS background:url(images/bg-image.png) für Theme

  • Wie bekommt man die Hintergrundbilder für das Wordpress-Design angezeigt?

    Normalerweise legt man diese ja in /images ab. Dann kann man in der style.css einfach machen:

    Code
    background:url(images/image.gif)

    Und auf jeder Unterseite hat man dann die Hintergrundbilder.

    Bei einem Wordpress-Theme aber liegen die Bilder unter /wp-content/themes/mein-theme/images. Aber derartige Pfade tippt man ja sicher nicht in die style.css, oder? Bei dem Twentyeleven-Theme jedenfalls nicht, wie ich gesehen habe.

    Ferner möchte man, sofern die Seiten SEO-Technisch gut sein sollen, dass man zu den Unterseiten Pfade wie diese hat: /wordpress/2011/artikel-sowieso/. Und nun? Wie bekommt man da jetzt noch die Hintergrundbilder in alle Unterseiten?

    Ich könnte vermutlich in der CSS-Datei schreiben:

    Code
    background:url([URL]http://meine-domain.de/wp-content/themes/mein-theme/images/image.gif[/URL])

    Aber das ist absolut inakzeptabel, weil ich dann sämtliche Pfade in der CSS-Datei ändern muss, sobald ich das Theme auf meinem HTTP-Server erweitern und testen will. Und auf einer anderen Domain könnte man das Theme dann natürlich auch nicht verwenden. Was tun?

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Mojn,

    Zitat

    Bei einem Wordpress-Theme aber liegen die Bilder unter /wp-content/themes/mein-theme/images. Aber derartige Pfade tippt man ja sicher nicht in die style.css, oder?

    Nein, die Tipperei kann man sich sparen, da die style.css die man baut sich ja auch im selben Themeordner befindet, für welches sie geschrieben ist.
    Zumindest kenne ich es nicht anders.
    Also wäre dein erstes Beispiel mit der Pfadangabe in der Hinsicht schon korrekt. ;)

    Bitte keine Fragen per PM, oder Foren-Chat. Für Fragen ist das öffentliche Forum da. Meine Uerdinger Seite

  • Und warum musste ich den Ordner /wp-content/themes/mein-theme/images in das Wurzelverzeichnis für die Domain kopieren, um die Images zumindest mal auf der Startseite zu haben?

    Wenn das soweit stimmt was ihr meint, dann muss ich ja noch irgend etwas wichtiges übersehen haben. Kann es sein, dass man im Theme irgendwo den Pfad zu dem Ordner mit den Images angeben muss? Ich meine, woher sonst soll Wordpress das wissen? In der CSS-Datei steht ja nunmal images anstatt wp-content/themes/mein-theme/images. Folglich sucht jede Seite und Unterseite nach einem Ordner namens images, der aber nicht im selben Ordner der Seite existiert. Was muss man da machen?

  • les dir mal das durch:


    Das ist mir schon klar. Das Problem ist, wenn ich in der style.css den Pfad zu einem Bild so angebe: 'images/image.gif', dann muss im Stammverzeichnis der Ordner images existieren. Wie sonst sollte der Browser das Bild finden? Da der Ordner images aber bei einem Wordpress-Theme nicht im Wurzelverzeichnis ist, muss das ja irgendwie anders geregelt werden.

    Hinzu kommt, wenn man dann Unterseiten wie meine-domain.de/thema1/artikel20/ hat, dann müsste ich folglich in allen möglichen Ordnern, wie laut diesem Beispiel dann also im Ordner thema1/artikel20, den Ordner images haben. Hat man aber nicht, zumal diese Unterordner nicht real existieren, weil Wordpress in dem Fall mit ModRewrite arbeitet.

    Und wie gesagt: absolute Pfade dürfen in der style.css nicht verwendet werden, damit das Theme später auch mit anderen Domains benutzt werden kann. Deutlicher kann man es nicht erklären, denke ich.

  • also ich sag dir mal wie es bei mir ist.

    in wp-content/themes/meintheme/

    gibt es eine "images" ordner. also wp-content/themes/meintheme/images/ da liegen die ganzen bilder drinnen. die binde ich in der css wie folgt ein:

    background:url(../meintheme/images/back.png);

    und gut ists. somit kannst das theme überall verwenden.

  • Ok, scheint Du hast Recht und es reicht ein simples url(image/image.gif). Ich habe mir noch mal etwas genauer das Theme Twentyeleven angeschaut und habe dann bei meinem Theme festgestellt, dass zwei Background-Images funktionieren, alle die danach kommen müssten, die fehlen jedoch.

    Vermutlich ist irgendetwas in dem HTML-Code fehlerhaft, den der Browser erhält. Ich versuche das mal mit Weblint zu testen. Irgendwo ist da auf jeden Fall der Wurm drin.

    Update v. 01.12.2011 22:09:

    Ja, da war wirklich ein Fehler in einem meiner PHP-Skripte. Nun klappt alles. Danke für die Antworten.

    Einmal editiert, zuletzt von matman (1. Dezember 2011 um 22:09)

Jetzt mitmachen!

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