WordPress 7.1 giver blokeditoren responsive styles, tabs og hurtigere mediehåndtering
WordPress 7.1, med kodenavnet “Mary Lou”, gør det lettere at bygge responsive layouts, redigere billeder og samarbejde direkte i blokeditoren. Opdateringen udvider samtidig værktøjskassen for udviklere med nye API’er, design tokens og flere muligheder i theme.json.
Responsive styles direkte i Site Editor
Du kan nu tilpasse en bloks udseende til forskellige skærmstørrelser fra Global Styles eller fra den enkelte bloks indstillinger. Det betyder, at du kan styre responsive styles uden at skrive custom CSS og samtidig forhåndsvise resultatet ved forskellige viewportstørrelser.

Adminbaren følger med i alle editorer
Adminbaren vises nu på tværs af alle editorer. Det giver en mere ensartet navigation mellem kontrolpanelet, indlægseditoren og Site Editor, fordi du hele tiden har adgang til de samme velkendte værktøjer og kan se, hvor du befinder dig.
Opdateringen indeholder også mindre visuelle justeringer af adminbaren, som polerer oplevelsen yderligere.

Én samlet editor til billedbeskæring
Det tidligere inline-værktøj til beskæring er erstattet af en ny modal til medieeditering. Den velkendte Crop-knap åbner stadig redigeringen, men arbejdsgangen samler nu fri beskæring, beskæring efter billedformat, vandret og lodret spejling, præcis rotation og redigering af metadata ét sted.

Notes får rich text og omtaler
Notes understøtter nu rich text og omtaler. Du kan formatere en note med fed, kursiv og kode, indsætte links eller skrive @ for at omtale en samarbejdspartner og sende en notifikation.
Du kan også knytte en note til et konkret tekststykke frem for kun til hele blokken. Flere samtaler kan køre på den samme blok, og du kan folde lange noter sammen, så margenen forbliver overskuelig under redigering og review.

Billedbehandling flytter til browseren
Komprimering, skalering og generering af thumbnails sker nu i browseren. Det aflaster serveren, giver mindre filer og hjælper dig med at undgå PHP-hukommelsesgrænser og upload-timeouts.
WordPress 7.1 får desuden indbygget understøttelse af AVIF, HEIC og HDR gain maps. Dermed kan WordPress håndtere billedformater, som moderne kameraer og telefoner allerede producerer.

Nye blokke og flere designmuligheder
Udgivelsen tilføjer to blokke og udvider samtidig mulighederne for at styre indholds præsentation og interaktion.
Playlist-blokken
Med Playlist-blokken kan du samle flere lydspor i én afspilningsliste. Du kan valgfrit vise en waveform, der giver lytteren en visuel indikation af hvert spor, mens det afspilles.

Egne responsive breakpoints i temaer
Bloktemaer kan definere deres egne breakpoints for mobil og tablet i theme.json. Temaets værdier kan dermed tilsidesætte standardværdierne for responsive styles og bloksynlighed.

Tabs-blokken
Tabs-blokken organiserer beslægtet indhold i faneblade, så du ikke behøver vise alt på én gang. Det giver en mere kompakt måde at præsentere indhold på, når siden ellers ville blive overfyldt.

Egne ikonbiblioteker
Udviklere kan udvide WordPress’ ikonbibliotek med egne samlinger. De registrerede ikoner bliver tilgængelige i editoren på linje med de indbyggede ikoner.

Interaktive styles til Button-blokken
Du kan nu sætte særskilte styles for hover, focus og active på Button-blokke fra editorens stylekontroller. Indstillingerne kan gælde én bestemt knap eller alle knapper.

En mere stabil redigeringsflade
Indlægseditoren kører nu fuldt i en iframe for alle temaer, ligesom Site Editor allerede gør. Redigeringscanvaset er dermed adskilt fra WordPress’ admininterface, så adminstyles ikke påvirker dit indhold.
Viewport-relative enheder og media queries retter sig nu direkte mod redigeringscanvaset. Det gør responsive layouts mere forudsigelige, mens du bygger dem, selv om ændringen for det meste er usynlig i den daglige redigering.
Nye værktøjer til udviklere
WordPress 7.1 udvider flere af de API’er og værktøjer, som du bruger til integrationer, automatisering, admininterfaces og responsive styles.
SVG Icon API er offentlig
SVG Icon API er nu en offentlig API. Du kan registrere egne ikonsamlinger og ikoner og bruge dem på tværs af editoren med wp_register_icon_collection(), wp_register_icon() og wp_get_icon().
Abilities API får udvidet lifecycle
Abilities API bygger videre på infrastrukturen fra WordPress 6.9 med en filtrerbar lifecycle for eksekvering, egen validering og fælles discovery. Udvidelserne gør det lettere at bygge integrationer og automatisering oven på WordPress, også værktøjer med AI.
Design System til admininterfaces
Et nyt Design System giver grundlæggende understøttelse af theming i WordPress’ admininterfaces, blandt andet for farver, runding og cursorstyles. Du kan bruge semantiske design tokens og React-komponenten ThemeProvider, når du vil gøre egne admininterfaces mere konsistente og stadig lade dem føles hjemme i WordPress.
Mere i theme.json og Site Editor
Temaudviklere får responsive styling og pseudo-state-styling for hover, focus, focus-visible og active gennem theme.json. Der kommer også nye filtre til at konfigurere DataViews- og DataForm-skærmene, som driver Pages, Templates, Parts og Patterns i Site Editor.
Tilgængelighed
WordPress 7.1 forbedrer tilgængeligheden i både WordPress core og editoren. Funktionerne wp_get_tooltip() og wp_get_toggletip() gør tilgængelige tooltips mulige flere steder i admin, herunder i indlægs meta boxes og på login-skærmen.
Skærmlæserunderstøttelsen bliver også bedre i admininterfaces med tydeligere labels og mere forudsigelig navigation i indlægslistetabeller. De nye Tab- og Playlist-blokke samt forbedringer af navigation og interaktion i editoren indgår også i opdateringens tilgængelighedsarbejde.
Ydeevne og robuste uploads
Den browserbaserede billedbehandling bruger en WebAssembly-build af libvips. Den reducerer behandlingsbelastningen på serveren og hjælper særligt ved store uploads, hvor hukommelsesgrænser og timeouts ellers kan skabe problemer.
Valgfri konvertering fra GIF til video giver typisk mindre filer. Uploads får desuden statusindikatorer og automatiske genforsøg, så processen bedre kan modstå afbrudte forbindelser.
Mediebiblioteket bruger nu infinite scrolling som standard, men den enkelte bruger kan skifte tilbage til paginering. Standardindstillingerne for speculative loading kan sættes via miljøvariabler eller konstanter, så hosts og siteejere kan styre WordPress’ prefetching af sider uden at skrive et plugin.
Hvad du bør gøre nu
Test WordPress 7.1 på et stagingmiljø, før du opdaterer et produktionssite. Gennemgå især responsive styles i temaet, eksisterende CSS omkring editoren, medieuploads og eventuelle udvidelser, der arbejder med ikoner, admininterfaces eller theme.json.
Du kan finde den samlede oversigt over udgivelsen på WordPress 7.1-siden, de tekniske ændringer i release notes og detaljerede udviklernoter i Field Guide.
Referencer / Kilder
Sofie Nielsen
Chefredaktør for det danske team, TypeScript og type-safe development evangelist. Stærkt typesystem og kodekvalitet er mine prioriteter.
Alle indlæg