1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Twenty Fifteen: Wie Transparenz einrichten?

Dieses Thema im Forum "Design" wurde erstellt von chrischroschris, 14. März 2016.

  1. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    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"?
     
  2. MarkusNi

    MarkusNi Member

    Registriert seit:
    14. März 2016
    Beiträge:
    10
    Zustimmungen:
    0
    Navigationsbalken:


    Im Bereich:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    den background von body:before entfernen.

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  3. MarkusNi

    MarkusNi Member

    Registriert seit:
    14. März 2016
    Beiträge:
    10
    Zustimmungen:
    0
    [Habe aus Versehen auf "Veröffentlichen" anstatt auf "Vorschau" geklickt beim vorherigen Beitrag, deswegen steht oben der
    Beitrag nicht vollständig :/ Sorry dafür.]

    Hier nochmal der vollständige Beitrag.

    Ich orientiere mich im folgenden Beispiel an:
    https://twentyfifteendemo.wordpress.com/


    Sidebar:


    Im Bereich:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    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.

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    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.

    Artikel:


    Hier muss man z.B. in der style.css folgendes ändern
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Solltest du eine andere Hintergrundfarbe als weiß wählen wollen, kannst du hier die entsprechenden RGBa-Werte
    generieren lassen.

    Gruß Markus
     
    #3 MarkusNi, 15. März 2016
    Zuletzt bearbeitet: 15. März 2016
  4. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    Danke Markus - den Hintergrund der Sidebar kann ich entfernen, aber die Transparenzen kriege ich nicht hin - was kann der Fehler sein?
     
  5. MarkusNi

    MarkusNi Member

    Registriert seit:
    14. März 2016
    Beiträge:
    10
    Zustimmungen:
    0
    Hast du einen Link zur Seite bzw. zum Blog?
     
  6. BvW

    BvW Well-Known Member

    Registriert seit:
    18. Februar 2014
    Beiträge:
    1.190
    Zustimmungen:
    0
  7. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
  8. BvW

    BvW Well-Known Member

    Registriert seit:
    18. Februar 2014
    Beiträge:
    1.190
    Zustimmungen:
    0
    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);}
     
  9. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    Der weiße Hintergrund der Beispiel-Seite soll transparent sein ;)
     
  10. BvW

    BvW Well-Known Member

    Registriert seit:
    18. Februar 2014
    Beiträge:
    1.190
    Zustimmungen:
    0
    Das ist dann:

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

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    Aha, Danke - es klappt :) und Sidebar und Footer und Kommentar wahrscheinlich genau so, nur wo genau?
     
  12. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    Bzw. da sind ja eine ganze Menge an Elementen ,die dann auf Transparent zu stellen sind, also alle eigentlich, die im Vordergrund stehen.
     
  13. BvW

    BvW Well-Known Member

    Registriert seit:
    18. Februar 2014
    Beiträge:
    1.190
    Zustimmungen:
    0
    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 :)
     
  14. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    Ja - das stimmt wohl ;)
     
  15. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    Oh - wenn ich das Basis-Farbschema im Theme umstelle z.B. auf "Blau", dann funktioniert es nicht mehr - was ist da zu beachten?
     
    #15 chrischroschris, 15. März 2016
    Zuletzt bearbeitet: 15. März 2016
  16. chrischroschris

    chrischroschris Well-Known Member

    Registriert seit:
    20. Oktober 2015
    Beiträge:
    78
    Zustimmungen:
    0
    Aber ist egal, man muss ja nicht das Basis-Farbschema umstellen, sondern kann es anpassen, dann geht es auch alles.
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden