Spring til indhold
WordPress 7.1 giver blokeditoren responsive styles, tabs og hurtigere mediehåndtering
Sofie Nielsen
Sofie Nielsen 22. August 2026 · 6 min læsetid

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.

Download WordPress 7.1 wordpress-7.1.zip

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.

Responsive styleindstillinger for en blok i WordPress' Site Editor
Blokke kan få forskellige styles ved forskellige viewportstørrelser. — Forrás: WordPress.org

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.

WordPress' adminbar i editoren
Adminbaren er tilgængelig i alle WordPress-editorer. — Forrás: WordPress.org

É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.

Den nye modal til beskæring og redigering af billeder i WordPress
Beskæring, rotation, spejling og metadata er samlet i én medieeditor. — Forrás: WordPress.org

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.

Notes med rich text og omtaler i WordPress-editoren
Notes kan placeres på tekst, formateres og bruges til at omtale samarbejdspartnere. — Forrás: WordPress.org

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.

Hurtigere upload og flere understøttede billedformater i WordPress
Browserbaseret billedbehandling reducerer belastningen på serveren. — Forrás: WordPress.org

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.

Playlist-blokken i WordPress
Playlist-blokken kan vise flere lydspor og en valgfri waveform. — Forrás: WordPress.org

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.

Indstillinger for responsive breakpoints i et WordPress-tema
Bloktemaer kan styre mobile- og tablet-breakpoints via theme.json. — Forrás: WordPress.org

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.

Tabs-blokken med indhold organiseret i faneblade
Tabs-blokken samler relateret indhold i faneblade. — Forrás: WordPress.org

Egne ikonbiblioteker

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

Tilføjelse af egne ikoner i WordPress-editoren
Egne ikonsamlinger kan bruges sammen med WordPress’ indbyggede ikonbibliotek. — Forrás: WordPress.org

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.

Interaktive styles for Button-blokken i WordPress
Button-blokke kan få styles til hover-, focus- og active-tilstande. — Forrás: WordPress.org

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

Bliv en del af HelloWP-communityet!

Chat med os om WordPress og webudvikling, og del erfaringer med andre udviklere.

- medlemmer
- online
Deltag

Vi bruger cookies til at forbedre din oplevelse. Ved at fortsætte accepterer du vores Cookiepolitik.