WordPress 5.3 - und Gutenberg!

Transcript

1. WordPress 5.3 und -
   Gutenberg!
   Jessica Lyschik
   WordPress Meetup München, 27.11.2019
   

   View Slide

2. Jessica
   Lyschik
   Webentwicklerin &
   WordPress-Profi
   CSS Nerd, Gründerin der
   Gutenberg-Fibel
   https://jessicalyschik.de
   https://gutenberg-fibel.de
   

   View Slide

3. Neues in
   WordPress 5.3
   

   View Slide

4. Twenty Twenty
   Das neue Standard-Theme
   Beispiele:
   https://2020.wordpress.net
   https://francescamarano.com
   https://joost.blog
   

   View Slide

5. Sichtbare Passwörter
   Nur auf Klick natürlich ;)
   Neu ist das Auge-Symbol
   rechts im Passwort-Feld.
   

   View Slide

6. Prüfung der E-Mail-Adresse
   Direkt nach dem Login, alle 6 Monate.
   

   View Slide

7. Neues Design der Formular-Elemente
   Alle Input-Felder, Dropdowns und Buttons wurden
   angepasst.
   Dies dient der Verbesserung der Barrierefreiheit.
   

   View Slide

8. Bilder-Upload
   • Sehr große Bilder werden automatisch auf maximal
   2560px Höhe oder Breite verkleinert
   • Diese Maximalgröße wird auch im Frontend ausgegeben
   • Dies dient zur Verbesserungen der Ladezeit
   • Weitere Verbesserungen bei der Generierung der
   Bildgrößen
   

   View Slide

9. Ein Blick zurück:
   Der „Classic Editor“
   

   View Slide

10. WordPress 1.0
    

    View Slide

11. WordPress 2.0
    

    View Slide

12. WordPress 3.0
    

    View Slide

13. WordPress 3.8
    

    View Slide

14. Fällt dir etwas auf?
    

    View Slide

15. seit WordPress 5.0
    

    View Slide

16. Neues im
    Block-Editor
    

    View Slide

17. Neues im Block-Editor
    • Vorschau von Blöcken -> Inserter oben
    • Snackbar
    • Navigationsmodus
    • Neuer Block: Gruppe
    • Bild-Block: Styles
    • Button-Block: Ecken-Radius, Link-Eigenschaften
    

    View Slide

18. Neues im Block-Editor
    • Cover-Block: Hintergrundfarbe, Mindesthöhe, alle Blöcke innerhalb
    verwendbar
    • Galerie-Block: Bilder verschieben
    • Medien und Text-Block: vertikale Ausrichtung, Zuschnitt
    • Spalten-Block: Vorlagen, Spaltenbreite
    • Tabellen-Block: Kopf-/Fußzeile, Textausrichtung
    • Überschriften: Farbe
    

    View Slide

19. Weiterentwicklung testen?
    • Installiere dir das Gutenberg-Plugin!
    • Social Links Block
    • Gradients bei Buttons und Cover-Block
    • Breadcrumb Bar unten
    • Navigations-Block
    

    View Slide