Weitere Informationen und den Download findest du auf der offiziellen Anlaufstelle de.wordpress.org
Ergebnis 1 bis 7 von 7
  1. #1
    PostRank: 0
    Registriert seit
    04.01.2018
    Beiträge
    3

    Headerüberschrift mobile Ansicht viel u groß Theme Twenty Seventeen

    Hallo zusammen,
    ich bin Laie im Bereich CSS und habe im Theme Twenty Seventeen folgendes Problem.
    Wir haben einen recht groß geschriebenen Titel & Untertitel auf der Seite oberhalb des Menüs, welche mit dem Theme Child Theme Advanced Twenty Seventeen erstellt wurde.
    Jetzt meine Frage. Welchen CSS Code muß ich nutzen, damit sich der Titel & Untertitel bei der mobilen Ansicht entsprechend verkleinert. Am PC / Notebbok sieht es ganz normal aus, nur in der mobieln Ansicht ist die Schrift nicht lesbar, sondern läuft aus dem Display heraus.
    Einen Screenshoot nahe ich beigefügt.

    Ich danke schon jetzt für Eure Hilfe.

    Gruß
    BSH
    Angehängte Grafiken Angehängte Grafiken


  2. #2
    PostRank: 4
    Registriert seit
    20.07.2017
    Beiträge
    165
    Zitat Zitat von tabularaza Beitrag anzeigen
    Wir haben einen recht groß geschriebenen Titel & Untertitel auf der Seite oberhalb des Menüs ...
    Genau das ist das Problem. Der Titel und Beschreibung ist etwas groß geraten, ebenso der Buchstabenabstand. Sieht so nicht sehr schön aus.

    Gehe zu Design-->Customizer. Unter Advanced Header-->Site-Branding stellst Du die Schriftgröße auf 32px (statt 35px) und das Letter-Spacing auf 1px.

    Dann unter Design-->Customizer-->Zusätzliches CSS das einfügen und speichern
    Code:
    /*------------------------------------------------------
    Zeilenabstand im Vereinsnamen
    --------------------------------------------------------*/
    .site-branding .site-branding-text .site-description {
        line-height: 31px;
    }
    Gruß
    Sophie

  3. #3
    PostRank: 0
    Registriert seit
    04.01.2018
    Beiträge
    3
    hallo, besten dank für die Unterstützung.
    1 Frage hab ich noch. Wie kann ich einstellen, dass sich die beiden Schriftzüge automatisch an die Displaygröße anpassen? Also bei nem kleinen mobile Display auch verkleinern und keine Buchstaben verschwinden? Am liebsten ohne einen Zeilenumbruch.
    Danke
    BSH

  4. #4
    PostRank: 4
    Registriert seit
    20.07.2017
    Beiträge
    165
    Und dann noch ...
    "Bildergalerie" (mit einem L)
    Herzlich willkommen ... (Adjektiv)
    ... Spaß beim Stöbern ...


    Schönen Abend
    Sophie

  5. #5
    PostRank: 5
    Registriert seit
    03.02.2016
    Beiträge
    458
    @tabularaza,
    du verwendest das Advanced Twenty Seventeen Child.

    Für alle Fälle vor der Aktion ein Full-Backup anlegen (also inkl. Datenbank). Ich mache das mit All-in-One WP Migration.

    Im Childordner ist eine style.css, die holst du dir mit einem FPT Programm (z.B. FileZilla) auf deinen Rechner und legst davon eine Sicherheitskopie an.
    Dann öffnest du die Datei mit z.B.: Notepad++
    In der ersten Textzeile steht - "Theme Name: Advanced Twenty Seventeen Child" - dann bist du richtig

    Dort ersetzt du alles ab/inkl. Zeile 60 - @media (max-width: 1170px) {

    Code:
    @media screen and (max-width: 20em) {
        .site-title a {
            font-size: 22px !important;
        }
        .site-description {
            font-weight: 200 !important;
            font-size: 12px !important;
        }
        .wrap {
            padding-left: .2em;
            padding-right: .2em;
        }
    }
    
    @media screen and (min-width: 20em) {
        .site-title a {
            font-size: 26px !important;
        }
        .site-description {
            font-weight: 200 !important;
            font-size: 14px !important;
        }
        .wrap {
            padding-left: .2em;
            padding-right: .2em;
        }
    }
    
    @media screen and (min-width: 30em) {
         .site-title a {
            font-size: 36px !important;
        }
        .site-description {
            font-weight: 600 !important;
            font-size: 22px !important;
        }
        .wrap {
            padding-left: .2em;
            padding-right: .2em;
        }
       .ats-widget-area-advanced .widget-column {
            float: left !important;
            padding-left: 15px !important;
            padding-right: 15px !important;
        }
    
        .ats-widget-area-advanced .widget-column:first-child {
            padding-left: 0 !important;
        }
    
        .ats-widget-area-advanced .widget-column:last-child {
            padding-right: 0 !important;
        }
    }
    
    @media screen and (min-width: 48em) {
            .site-description {
            font-weight: 600 !important;
            font-size: 35px !important;
        }
        .wrap {
            padding-left: 2em;
            padding-right: 2em;
        }
    }
    @media screen and (max-width: 48em) {
        .ats-widget-area-advanced .widget-column {
            width: 100% !important;
        }
    }
    
    @media (max-width: 1170px) {
        .ats-preview.ats-layout-boxed #page,
        .ats-preview.ats-layout-boxed .site-navigation-fixed {
            max-width: 960px;
        }
    }
    Danach wieder über FTP hochladen und sehen obs das ist, was du willst.

    Wenn nicht alte Datei wieder hochladen.
    nothing is so easy as it looks

  6. #6
    PostRank: 4 Avatar von Kurt Singer
    Registriert seit
    28.05.2017
    Ort
    Koblenz
    Beiträge
    246
    Zitat Zitat von SEpp55 Beitrag anzeigen
    Ich mache das mit All-in-One WP Migration.
    Sicher jetzt OT, aber trotzdem die Frage: wie ich gelesen habe ist das doch gut für Migration und auch für Backup, oder? Nur die Handhabung scheint mir etwas komliziert.
    Meine Webergüsse: www.kurt-singer.de

  7. #7
    PostRank: 5
    Registriert seit
    03.02.2016
    Beiträge
    458
    @Kurt - du hast eine PN
    nothing is so easy as it looks

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •