• Hallo zusammen,

    seit einiger Zeit beschäftigt mich die Frage, wie ich ein Bild bildschirmfüllend in meine Website integriere. Dank eines Hinweises habe ich mittlerweile ein Childtheme erstellt um diesem Wunsch näher zukommen. Nach einigem Probieren und Lesen bin ich jetzt soweit, dass ich eine CSS Vorlage habe und diese am liebsten in den functions.php-Ordner einfügen möchte. Leider fehlt mir das nötige Wissen dafür.

    Mein CSS-Code wäre:

    element.style {
    background-image: url(https://philippfalkenhagen.de/wp-content/uploads/2019/10/Reh-im-Mohnfeld-Startseite-1.jpg);
    max-width: 100%;
    height: 801px;
    width: 100%;
    }

    Die Höhe würde sich damit immer der 100 prozentigen Weite anpassen. Ich bin mir leider nicht ganz sicher ob der functions.php-Ordner der richtige Ansatz ist.

    Ich würde mich sehr freuen, wenn mir jemand auf die Sprünge helfen könnte und ich das Problem endlich lösen könnte.

    Vielen Dank und beste Grüße

    Philipp

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 9 Antworten – 1 bis 9 (von insgesamt 9)
  • Hallo,
    hier einige Infos, wie Du mit der CSS-Regel verfahren kannst:

    1. Ein Childtheme verwenden und die geänderten Regeln in die style.css schreiben
    2. die geänderten CSS – Regeln über Design -> Customizer -> Individuelles CSS festlegen

    Einen

    functions.php-Ordner

    gibt es nicht. Es gibt allerdings eine functions.php (Datei) in dem Ordner, in dem das childtheme liegt.
    Viele Grüße
    Hans-Gerd

    Thread-Starter philippf

    (@philippf)

    Vielen Dank! Leider funkitoiniert es bei mir auch als Custrom CSS nicht, da ich es auf einer untergeordneten Seite und nicht der Startseite anwenden möchte. Ich bräuchte also die CSS-Regeln für genau diese Seite oder einen Weg, die generelle Bildbreite zu ändern.

    Viele Grüße zurück!

    Philipp

    Thread-Starter philippf

    (@philippf)

    Ich denke außerdem, dass es mit diesem Code zusammenhängt

    // set default content width
    if ( ! isset( $content_width ) ) {
    	$content_width = 680;
    }

    Leider kann ich hier die 680 nicht durch 100% ersetzten.

    Hallo,
    leider ist Deine Seite nicht erreichbar.

    Leider kann ich hier die 680 nicht durch 100% ersetzten.

    … das geht schon: Änderung des entsprechenden templates im childtheme.
    Viele Grüße
    Hans-Gerd

    @hage Die Webadresse funktioniert mit https. Eine Weiterleitung von http auf https wurde anscheinend noch nicht eingerichtet.

    @pixolin danke – hatte ich nicht getestet.

    Thread-Starter philippf

    (@philippf)

    Wenn ich das entsprechende Template änder, ist meine Website nicht mehr erreichbar. Wenn ich die 680 jedoch durch jede andere erdenkliche Zahl ändere, passiert praktisch nichts.

    Thread-Starter philippf

    (@philippf)

    Das hier wäre mein functions.php Ordner: functions.php . Leider kann ich die Werte dort nicht einfach durch 100% ersetzten.

    Wieso beharrst du eigentlich darauf, die Datei mit den Funktionen wäre ein Ordner? 🙂

    // set default content width
    if ( ! isset( $content_width ) ) {
    	$content_width = 680;
    }

    Damit ist normalerweise die Breite eines Inhaltsbereichs gemeint, sofern sie nicht von Benutzern im Customizer anders eingestellt wird. Das kann z.B. erfolgen, in dem der Benutzer sich für eines von verschiedenen angeboten Layouts entscheidet. Als Beispiel mal ein paar Zeilen Code aus dem Theme Colormag:

    if ( $layout_meta == 'default_layout' ) {
        if ( $colormag_default_layout == 'no_sidebar_full_width' ) {
            $content_width = 1140; /* pixels */
        } else {
            $content_width = 800; /* pixels */
        }
    }

    Umgangssprachlich: „Wenn du dich für das Standard-Layout entscheidest und außerdem keine Sidebar haben möchtest, setze ich die Breite auf 1140 Pixel, sonst auf 800 Pixel“ – und schon ist der ursprüngliche Wert in der Datei functions.php überschrieben. Das erklärt dann auch, wieso sich nichts ändert, wenn du den Wert in der functions.php änderst.

    Wenn du mit einem Theme nicht zufrieden bist, ist die erste Wahl, eigene CSS-Regeln hinzuzufügen. Dazu schaust du dir in den Entwickler-Tools deines Browsers an, welcher HTML-Code für einen bestimmten Abschnitt deiner Website verwendet wurde (Rechtsklick auf den Abschnitt > Element untersuchen). In den Entwickler-Tools wird dann angezeigt, welche CSS-Regeln zu den HTML-Elementen verwendet werden. Hier kannst du dann auch gleich ein wenig mit den Werten spielen und ausprobieren „was wäre, wenn …“. Die CSS-Regel, die du so erarbeitet hast, kannst du dann kopieren und in den Customizer unter Zusätzliches CSS einsetzen.
    (Hier noch eine nette Zusammenfassung: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Open_the_Inspector)

    Child Themes brauchst du eigentlich erst, wenn du auch die Inhalte anders aufbauen möchtest und eine Änderung mit CSS-Regeln nicht ausreicht. Multipurpose-Themes können recht komplex ausfallen und du musst erst einmal schauen, was die einzelnen Funktionen des Themes bewirken und wo sie ggf. überschrieben werden. Wie in meinem Beispiel reicht es nicht, einfach irgendwo ein paar Zahlen auszutauschen.

Ansicht von 9 Antworten – 1 bis 9 (von insgesamt 9)
  • Das Thema „Bilder durch Childtheme in voller Größe anzeigen“ ist für neue Antworten geschlossen.