Twenty Fifteen: Wie Transparenz einrichten?

  • Hallo - weiß jemand, was man im Theme Twenty Fifteen-Theme einrichten, bzw. im style.css eingeben muss um eine Transparenz des Navigations-Balkens und der Beitrags- und Seiten-Hintergründe zu erhalten, ähnlich wie im Twenty Fifteen-Child-Theme "Waffle"?

    • 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

  • Navigationsbalken:


    Im Bereich:

    den background von body:before entfernen.

  • [FONT=arial][Habe aus Versehen auf "Veröffentlichen" anstatt auf "Vorschau" geklickt beim vorherigen Beitrag, deswegen steht oben der
    Beitrag nicht vollständig :/ Sorry dafür.]

    [/FONT][FONT=arial]Hier nochmal der vollständige Beitrag.

    Ich orientiere mich im folgenden Beispiel an:[/FONT] https://twentyfifteendemo.wordpress.com/[FONT=arial]


    [size=12]Sidebar:[/SIZE]


    Im Bereich:

    Code
    @media screen and (min-width: 59.6875em){
    
    
       body:before {
          [...]
       }
    
    
    }

    den background von body:before entfernen.

    Als nächstes die Höhe von .sidebar auf 100% festlegen und den background per rgba(255,255,255,0.8 ) setzen.

    Damit ist die Sidebar schon fertig. Tipp: Am Besten bietet es sich hier an z.B. mit Chrome die einzelnen Elemente mit Rechtsklick und "Prüfen" auszuwählen
    und dann nach und nach im Browser die Seite so zu verändern, wie du es möchtest.

    Analog mit den Artikeln.
    [/FONT]
    [size=12]Artikel:[/SIZE]
    [FONT=arial]

    Hier muss man z.B. in der style.css folgendes ändern

    Code
    [FONT=courier new].hentry{
       background: rgba(255,255,255,0.8);
    }
    [/FONT]

    [/FONT]

    Code
    [FONT=courier new].entry-footer{
       background: rgba(255,255,255,0.8);
    [/FONT][FONT=arial]}[/FONT]

    Solltest du eine andere Hintergrundfarbe als weiß wählen wollen, kannst du hier die entsprechenden RGBa-Werte
    generieren lassen.

    Gruß Markus

    Einmal editiert, zuletzt von MarkusNi (15. März 2016 um 01:07)

  • Um eine Transparenz zu erzeugen, sollte erst einmal etwas da sein, was man transparent machen kann :-)

    div#sidebar.sidebar{
    background-color: rgba(238, 238, 238, 0.62);}

    Nein, dem habe ich nichts hinzuzufügen :-)
    [HR][/HR]

  • Das ist dann:

    .hentry {background-color: rgba(255, 255, 255, 0.72);}

    Nein, dem habe ich nichts hinzuzufügen :-)
    [HR][/HR]

  • Ich sage mal, selber suchen macht schlau :-)
    Du kannst bei fast jedem Browser die Elemente "untersuchen" und dann musst du nur noch die passende Stelle finden. Learning by doing :-)

    Nein, dem habe ich nichts hinzuzufügen :-)
    [HR][/HR]

Jetzt mitmachen!

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