Änderung an Style.css zeigt keine Wirkung

  • Hallo,
    ich habe auf einem lokalen apache2 Server eine Kopie des Themes twentytwentyone erstellt. wenn ich die Style.css Datei dieses Themes bearbeite, spiegeln sich diese Änderungen nicht auf der Website im Browser wider.
    Ich habe testweise die Überschriften auf eine Größe gesetzt:


    Effekt: keiner
    [Blockierte Grafik: https://i.ibb.co/H4BXWrR/1.jpg]
    Wenn ich den gleichen Code im Theme Customizer bei Zusätzliches CSS eintrage funktioniert es
    [Blockierte Grafik: https://i.ibb.co/48xwwHk/2.jpg]

    Was mache ich falsch?

    • 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

  • Bei diesem Theme ist das teilweise springen von und zu Variabeln ;-)
    Versuche mal in Zeile 333, [FONT=Courier New]--global--font-size-xxl: 6rem; [FONT=Arial]zu ändern.[/FONT][/FONT]
    [FONT=Courier New][FONT=Arial]Das heißt grundsätzlich ist size-xxl 4rem und ab min-width: 652px wird auf 6rem vergrößert.[/FONT][/FONT]
    [FONT=Courier New][FONT=Arial]Aber grundsätzlich solltest du die style.css des Themes NICHT verändern, die wird beim nächsten Update wieder überschrieben![/FONT][/FONT]
    [FONT=Courier New][FONT=Arial]Wenn du dir nicht generell einen eigenen Style basteln willst, solltest du CSS-Änderungen in Zusätzliches CSS in Customizer vornehmen. Dort sind sie Updatesicher.[/FONT][/FONT]
    [FONT=Courier New][FONT=Arial]Wenn viele Änderungen anstehen, lese dich in Child-Themes ein, beginnend hier LINK.[/FONT][/FONT]

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • Ich habe mich jetzt für ein anderes theme entschieden: https://de.wordpress.org/themes/astra/
    und ein child theme angelegt. Das Problem hat sich aber nicht geändert. Ich habe die backgroundcolor des containers geändert:

    Code
    .ast-separate-container .ast-article-post, .ast-separate-container .ast-article-single:not(.ast-related-post) {
        background-color: rgba(255, 255, 255, 0.6);
    }


    Wenn ich das im style.css des child themes anlege passiert nichts. Wenn ich es ich im Theme Customizer bei Zusätzliches CSS eintrage funktioniert es.

  • Ich habe mir auf einer meiner lokalen Testinstallationen mit dem Plugin Child Theme Configurator ein Astra-Child angelegt und deinen o.g.Code ungeprüft in die style.css eingefügt.

    Offensichtlich kein Problem bei mir, wenn es das ist, was du farblich ändern willst ;-)

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • Obwohl ich seit gestern nichts mehr geändert habe, funktioniert es heute. Wenn ich den Code wieder auskommentiere, bleibt die Änderung trotzdem erhalten.
    Das liegt vermutlich am Browser-Cache. Dafür muss es doch eine bequemere Variante geben, als den Cache nach jeder Änderung manuell zu löschen, oder?

  • Der Browser-Cache hat aber mit WordPress nichts zu tun ;-)
    Wenn du nach einer Änderung deine Seite mit einem "Inkognito-Modus" oder ein "Neues privates Fenster", je nach erwendetem Browser öffnest sollte das nicht passieren :rolleyes:

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • Ändere bei Änderungen von [FONT=Courier New]style.css[/FONT] auch die Versionsnummer im Headerbereich der Datei, die Version wird bei Twenty Twenty-One in der URL von [FONT=Courier New]style.css[/FONT] angehängt, so dass der Browser dann die Datei vom Server neu laden sollte.

    Besser wäre noch ein Child-Theme mit einem ähnlichen Mechanismus bei [FONT=Courier New]wp_enqueue_style()[/FONT].

    Generell ist Twenty Twenty-One aber leider kein gutes Beispiel, wie man eine [FONT=Courier New]style.css[/FONT] einbindet, da die serverseitige Unterscheidung in [FONT=Courier New]functions.php[/FONT] ob ein älterer Internet Explorer genutzt wird oder nicht, nicht Cache-Plugin tauglich ist.

    Ergänzung: Und zum Theme Astra, wie man dafür ein Child-Theme anlegt, ist hier in der Theme-Anleitung beschrieben, mit Verweis auf einen speziellen Child Theme Generator für Astra. Es sind ggf. je nach Parent Theme durchaus bestimmte Dinge zu beachten, die bei vermeintlich allgemeingültigen Child Theme Generator Plugins oder Tutorials aussen vor bleiben.

    7 Mal editiert, zuletzt von b3317133 (10. Mai 2021 um 14:07)

Jetzt mitmachen!

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