Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WordPress 5.3 - und Gutenberg!
Search
Jessica Lyschik
November 27, 2019
Programming
240
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
WordPress 5.3 - und Gutenberg!
Jessica Lyschik
November 27, 2019
More Decks by Jessica Lyschik
See All by Jessica Lyschik
Performance 101
jessicalyschik
0
73
Performance 1x1
jessicalyschik
0
190
CSS Grid in freier Wildbahn
jessicalyschik
0
240
CSS Grid in the wild
jessicalyschik
0
450
Keine Angst vor Gutenberg und WordPress 5.2
jessicalyschik
0
160
Keine Angst vor Gutenberg und WordPress 5.0
jessicalyschik
0
430
Einstieg in CSS Grid
jessicalyschik
1
700
CSS für Anfänger
jessicalyschik
0
260
Frauen in der IT und der WordPress Community
jessicalyschik
0
200
Other Decks in Programming
See All in Programming
初めての模倣学習とVLA
natsutan
0
400
異なる設計思想のフレームワークを経験して得た学び
amekuhideki
2
1.4k
Gmail/Google DriveをトリガーにAIエージェントを動かそう! / Run AI agents with Gmail/Google Drive as triggers!
har1101
3
460
Jindong: Introducing Declarative Haptics in Compose Multiplatform
l2hyunwoo
0
140
AIと壁打ちしながら進めるコスト管理
fufuhu
2
1.9k
Go 1.27 における memory allocation の高速化
andpad
0
370
AI Readyの正体はデータマネジメントだ メダリオン2.0の最前線
freee
PRO
0
530
源内ハンズオン概要編
hideg
0
240
Dockerfile CMD for Node.js
grazie1999
0
160
MySQLとPostgreSQLって何が違うの?
akagami
0
150
AIを上手に使っていこうとしたら越境せざるを得なくなった話 〜実践1年で見えた境界を越えなければならない理由と進め方〜 / Crossing borders with AI
tomoyakitaura
2
920
ソフトウェアエンジニアにとっての生成AI - 特性を知って使い倒す / generative ai for software enginner
kishida
7
2.3k
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
698
190k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
63
45k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
430
Principles of Awesome APIs and How to Build Them.
keavy
128
18k
We Have a Design System, Now What?
morganepeng
55
8.3k
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Designing for Performance
lara
611
70k
How GitHub (no longer) Works
holman
316
150k
Raft: Consensus for Rubyists
vanstee
141
7.7k
Navigating Team Friction
lara
192
16k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
230
How to make the Groovebox
asonas
2
2.4k
Transcript
WordPress 5.3 und - Gutenberg! Jessica Lyschik WordPress Meetup München,
27.11.2019
Jessica Lyschik Webentwicklerin & WordPress-Profi CSS Nerd, Gründerin der Gutenberg-Fibel
https://jessicalyschik.de https://gutenberg-fibel.de
Neues in WordPress 5.3
Twenty Twenty Das neue Standard-Theme Beispiele: https://2020.wordpress.net https://francescamarano.com https://joost.blog
Sichtbare Passwörter Nur auf Klick natürlich ;) Neu ist das
Auge-Symbol rechts im Passwort-Feld.
Prüfung der E-Mail-Adresse Direkt nach dem Login, alle 6 Monate.
Neues Design der Formular-Elemente Alle Input-Felder, Dropdowns und Buttons wurden
angepasst. Dies dient der Verbesserung der Barrierefreiheit.
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
Ein Blick zurück: Der „Classic Editor“
WordPress 1.0
WordPress 2.0
WordPress 3.0
WordPress 3.8
Fällt dir etwas auf?
seit WordPress 5.0
Neues im Block-Editor
Neues im Block-Editor • Vorschau von Blöcken -> Inserter oben
• Snackbar • Navigationsmodus • Neuer Block: Gruppe • Bild-Block: Styles • Button-Block: Ecken-Radius, Link-Eigenschaften
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
Weiterentwicklung testen? • Installiere dir das Gutenberg-Plugin! • Social Links
Block • Gradients bei Buttons und Cover-Block • Breadcrumb Bar unten • Navigations-Block