Cambium Theme Header verkleinern?

  • Wenn du das -

    Code
    .site-content .site-content-inside {
        padding: 0;
    }

    wieder aus den Zusätzlichen CSS entfernst ist der Abstand zwischen Header und Content wie vorher.

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

    • 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

  • So, nun folgendes wieder in die Zusätzlichen CSS

    Code
    .has-site-branding .site-header.stuck-do, .wp-custom-logo .site-header.stuck-do {
        padding: 0;
    }
    .has-site-branding .site-header {
        padding: 0;
    }
    .has-site-branding .site-header, .wp-custom-logo .site-header {
        min-height: 100px;
    }

    Responsivität noch nicht inkludiert ;) unter 1200px ist es noch zu groß!
    Aber für mich heute nicht mehr ;)


    Ich würde einen Teil des Codes ändern, da sonst der Header leicht springt beim Scrollen

    Code
    .has-site-branding .site-header, .wp-custom-logo .site-header {
        min-height: 100px;
    }


    in

    CSS
    .has-site-branding .site-header, .wp-custom-logo .site-header {
        min-height: 86px !important;
    }

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Nochmals vielen Dank! Ihr habt mir super weitergeholfen!:):):)

    Noch eine Frage, könnte man die Startseite so ändern, dass nur 4 Blogs auf der linken Seite angezeigt werden und auf der rechten Seite die Sidebar, welche man sieht, sobald man auf einen Post klickt?

    Vielen Dank!

  • Das sind Grundeinstellungen im Theme bzw. in WordPress!
    4 Beiträge stellst du im Dashboard unter Einstellungen - Lesen ein.
    Das Layout mit Sidebar im Customizer - Themen Potions - [size=14]General Options[/SIZE] und [size=14]Layout Options!
    Manchmal denke ich mir meinen Teil!!!
    [/SIZE]

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

  • Seid ihr noch da?:=)

    Obwohl ich den Code geändert habe, springt der Header mobil immer noch. Könnt ihr mir vielleicht wieder helfen.
    Und wie kann ich die Größe der Überschriften ändern?

  • siehe #17!
    Oder das ansehen und danach selbst suchen und versuchen! LINK
    Wenn das nicht klappt, welche Überschriften meinst du??? Auf der Startseite sind die entry-title h1 mit 19px, auf der Beitragsseite ist die selbe h1 mit 36px in Desktopauflösung unter 768px Breite hat diese h1 dann 30px!!
    Hingegen die Widgetüberschriften = widget-title haben als h2 19px und uppercase.

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

  • Versuch mal das

    CSS
    @media (max-width:1199px) {
        .has-site-branding .site-header, .wp-custom-logo .site-header, .has-site-branding .site-header, .wp-custom-logo .site-header {
            min-height:144px !important;
        }
    }

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Hab alles abgeschaltet!

    Ich meine die Überschriften im Beitrag:)

    Die H1 H2 sind in Ordnung, die anderen hätte ich gerne größer:
    H3 24px, h4 21px, h5 19px

    Des hab ich auch im stylessheet selbst so geändert, allerdings tut sich irgendwie nichts.

  • Dagegen könnte man ja was machen ;-)

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Schau dich in einem Buchhandel in deiner Nähe um und nimm ein Buch über HTML/CSS welches dich anspricht.

    Ansonsten kannst du dich auch hier umschauen:
    https://wiki.selfhtml.org/wiki/CSS
    https://selfhtml.org/

    Leg dir irgendwo eine Testumgebung an und dort kannst du dann alles probieren. So lernst du HTML und CSS zu lesen und zu verstehen.

    Das wird aber nicht von heute auf morgen funktionieren. Aber die ersten Erfolge, auch wenn es nur kleine sind, kommen dann.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Des hab ich auch im stylessheet selbst so geändert, allerdings tut sich irgendwie nichts.


    Das ist eine schlechte Idee, wenn du das in die style.css geschrieben hast!
    Beim nächsten Themenupdate ist dann alles wieder Geschichte und verschwindet in den tiefen des Internets.
    Darum raten wir, die Änderungen in die Zusätzlichen CSS einzugeben, dort bleiben Anpassungen erhalten!
    Als weitere Lektüre kannst du mal "WP Child" in die Suchmaschine deines Vertrauens eingeben.

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

  • Danke euch!

    Jetzt hab ich mal was ausprobiert die Überschrift der h4 zu ändern, aber naja seht selbsto_O

    elementor-heading-title elementor-size-default{

    font-size: 21px;
    }

  • Wenn du noch den Behimm und den Beitrag nennst schaue ich, suchen mag ich nicht!
    Wenn du im Entwicklertool (wie im Video) links auf die Class gehst siehst du oben die Schreibweise ggf.
    Aus @SirEctor letzter Anweisung:
    .has-site-branding .site-header, -> also mit Punkt vor der Class!!!

    Aber versuche mal in die Zusätzlichen CSS:

    Code
    h4 {
      font-size: 21px;
    }

    Damit triffst du alle h4 ;-)

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

  • Das Logo war auf opacity: 0. Allerdings scheint der Wert von einem Caching-Plugin zu stammen.

    Probier mal

    Code
    .lazyload, .lazyloading {
        opacity: 1;
    }

    Oder auch

    CSS
    .lazyload, .lazyloading {
        opacity:  !important;
    }

    in das zusätzliche CSS zu schreiben. Kann gut sein, dass du dir damit was Anderes abschießt, oder dass es (wg. Caching) nicht funktioniert. Aber wenn es klappt, ist das der erste Schritt. Wenn es "Nebvenwirkungen" gibt, eleminierst du diese, indem du das CSs einschränkst. z. B.

    Code
    .custom-logo-link
    .lazyload, .lazyloading {
        opacity: 1;}

    Damit beschränkst du den Effekt (opacity 1) auf einen sehr engen Bereich. Ohne die Seite genau zu kennen, kann ich dir aber nicht unbedingt sagen, was 100% korrekt ist. Bei CSS kann es immer sein, dass du an einer Stelle was änderst und es ist auch an anderer Stelle sichtbar. Wenn eine Seite nur komplex genug aufgebaut ist, kann es einige Zeit dauern, bis man das im Griff hat.

    @ Lernen: Es gibt sehr viele Onlineschulen. Frag di8e Suchmaschine deines Vertrauens. ;) Ich kenne z. B. Treehouse, aber es gibt sicher 20 andere auch. Und probieren und fragen. so wie hier... ;)

  • Danke für deine Hilfe aber irgendwie funktioniert das mit den Codes nicht, bei !important wird immer ein Fehler angezeigt.
    Aktuell verwende ich diese Codes für mein Logo

    .custom-logo {
    max-height: 80px;
    }
    .has-site-branding .site-branding-wrapper, .wp-custom-logo .site-branding-wrapper,
    .has-site-branding .site-header.stuck-do, .wp-custom-logo .site-header.stuck-do {
    padding: 0;
    height: 85px;
    }
    .has-site-branding .site-header {
    padding: 0;
    }
    .has-site-branding .site-header, .wp-custom-logo .site-header,
    .has-site-branding .site-header, .wp-custom-logo .site-header {
    min-height: 86px !important;
    }
    @Media (max-width:1199px) {
    .has-site-branding .site-header, .wp-custom-logo .site-header, .has-site-branding .site-header, .wp-custom-logo .site-header {
    min-height:144px !important;
    }
    }

Jetzt mitmachen!

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