WordPress 7.1 “Mary Lou” ger responsiva stilar och snabbare mediahantering

WordPress 7.1, med kodnamnet Mary Lou, förbättrar både redigeringsflödet och verktygen för dig som bygger på WordPress. Versionen lägger till responsiva stilkontroller i Site Editor, en samlad medieeditor, mer flexibla Notes och nya block för spellistor och flikar.

Utgåvan hyllar jazzpianisten, arrangören och kompositören Mary Lou Williams. Hon spelade offentligt redan som sexåring, verkade inom swing, bebop och sacred jazz och fortsatte att förnya sitt uttryck. Under 1940-talet blev hennes lägenhet i Harlem en plats där bland andra Thelonious Monk, Dizzy Gillespie och Bud Powell utbytte idéer och formade bebopen.

Responsiva stilar direkt i Site Editor

Du kan nu styra hur ett block ser ut på olika skärmstorlekar från Global Styles eller från blockets egna inställningar. Funktionen kompletterar de befintliga alternativen för att visa och dölja block, och du behöver inte längre skriva egen CSS för dessa responsiva stilval.

Redigeraren låter dig också förhandsgranska ändringarna i olika viewport-storlekar medan du arbetar. Det gör det enklare att bygga layouter som anpassar sig efter hur besökaren använder webben.

Adminfältet följer med i alla redigerare

Adminfältet visas nu genomgående när du rör dig mellan WordPress olika redigerare. Du får därmed samma navigering och tillgång till välbekanta verktyg, oavsett om du arbetar i adminpanelen, skriver ett inlägg eller ändrar webbplatsens design. Versionen finjusterar också adminfältets visuella utformning.

En samlad medieeditor

Den tidigare inbäddade beskärningen ersätts av en ny modal för medieeditorn. Du öppnar fortfarande flödet med den välbekanta knappen Crop, men redigerar sedan bilden i ett och samma arbetsflöde.

Medieeditorn har fri beskärning och beskärning med bildförhållande, horisontell och vertikal vändning, precis rotation, rotation med snäppsteg samt redigering av metadata.

Notes får rik text och omnämnanden

Notes har nu stöd för rik text och omnämnanden. Du kan formatera en kommentar med fetstil, kursiv text och kod, lägga till länkar eller skriva @ för att nämna en samarbetspartner och skicka en notifiering.

Du kan dessutom fästa en note vid ett specifikt textstycke i stället för enbart vid ett helt block. Flera diskussioner kan pågå på samma block, och du kan fälla ihop längre notes för att hålla marginalen överskådlig.

Snabbare och bredare bildhantering

Webbläsaren sköter nu bildkomprimering, storleksändring och generering av miniatyrbilder. Det minskar belastningen på servern, ger mindre filer och hjälper dig att undvika PHP:s minnesgränser och timeout vid uppladdningar.

WordPress 7.1 har dessutom inbyggt stöd för AVIF, HEIC och HDR gain maps. Därmed kan WordPress hantera bildformat som moderna kameror och telefoner redan producerar.

Nya block och fler designkontroller

Skapa spellistor

Det nya blocket Playlist samlar flera ljudspår i en spellista. Du kan välja att visa en waveform som ger lyssnaren en visuell bild av varje spår medan det spelas upp.

Anpassa responsiva brytpunkter

Blockteman kan definiera egna brytpunkter för mobil och surfplatta i theme.json. Temat kan därmed ersätta standardvärdena som styr responsiva stilar och blocksynlighet.

Ordna innehåll med flikar

Det nya blocket Tabs delar upp relaterat innehåll i flikpaneler. Du kan alltså presentera informationen utan att visa allt på en gång och utan att tränga ihop sidan.

Lägg till egna ikoner

Du som utvecklar kan utöka WordPress ikonbibliotek med egna samlingar. Ikonerna blir tillgängliga i redigeraren vid sidan av det inbyggda biblioteket.

Styla interaktiva tillstånd

Du kan ge Button-block olika utseende för tillstånden hover, focus och active direkt i redigerarens stilkontroller. Välj om stilen ska gälla en specifik knapp eller samtliga knappar.

Postredigeraren får samma grund som Site Editor

Postredigeraren körs nu helt i en iframe för alla teman, precis som Site Editor. Redigeringsytan körs separat från WordPress admin-gränssnitt, så adminstilar inte påverkar innehållet.

Viewport-relativa enheter och media queries riktar sig nu direkt mot redigeringsytan. Responsiva layouter beter sig därför mer förutsägbart medan du bygger dem, och redigerarupplevelsen blir mer konsekvent.

Utvecklarverktyg i WordPress 7.1

WordPress 7.1 utökar flera API:er och verktyg för ikoner, automation, admin-gränssnitt och responsiv styling.

• SVG Icon API är nu ett publikt API. Du kan registrera egna ikonsamlingar och ikoner och använda dem i hela redigeraren med wp_register_icon_collection(), wp_register_icon() och wp_get_icon().
• Abilities API bygger vidare på infrastrukturen från WordPress 6.9. API:t får en filtrerbar exekveringslivscykel, egen validering och gemensam discovery. Det förenklar integrationer och automation ovanpå WordPress, inklusive AI-baserade verktyg.
• Ett nytt Design System lägger en grund för att tema WordPress admin-gränssnitt. Det omfattar färg, rundning och muspekarstilar. Du kan använda semantiska design tokens och React-komponenten ThemeProvider för att skapa mer konsekventa egna admin-gränssnitt som fortfarande känns hemma i WordPress.
• Temaförfattare får responsiv styling och pseudo-tillstånd för hover, focus, focus-visible och active genom theme.json. Nya filter låter dig också konfigurera vyerna DataViews och DataForm, som ligger bakom skärmarna för sidor, mallar, mall-delar och mönster i Site Editor.

Tillgänglighet

WordPress 7.1 förbättrar tillgängligheten i både WordPress core och redigeraren. De nya funktionerna wp_get_tooltip() och wp_get_toggletip() gör tillgängliga tooltips möjliga i fler delar av admin-gränssnittet, bland annat i postens metaboxar och på inloggningsskärmen.

Skärmläsare får tydligare etiketter och mer förutsägbar navigering i inläggslistornas tabeller. Tabs- och Playlist-blocken samt förbättringar i redigerarens navigering och interaktion ingår också i tillgänglighetsarbetet.

Prestandaförbättringar

Webbläsaren bearbetar nu bilder via en WebAssembly-version av libvips. Det minskar serverns bearbetningslast och hjälper större uppladdningar att undvika minnesgränser och timeout.

En valbar konvertering från GIF till video ger vanligtvis mindre filer. Uppladdningar får dessutom förloppsindikatorer och automatiska återförsök, vilket gör dem tåligare när anslutningen bryts.

Mediabiblioteket använder infinite scrolling som standard, men varje användare kan välja paginering igen. Du kan ställa in standardvärden för speculative loading genom miljövariabler eller konstanter, så webbhotell och webbplatsägare kan styra hur WordPress förhämtar sidor utan att skriva ett tillägg.

Nästa steg

Installera WordPress 7.1 och gå igenom responsiva stilar, medieflödet och de nya blocken i din egen miljö. När du utvecklar teman eller admin-gränssnitt bör du också läsa release notes och den detaljerade Field Guide innan du anpassar befintlig kod.

För handfasta genomgångar av funktionerna finns kostnadsfria videor, interaktiva workshoppar och lektionsplaner på Learn WordPress, inklusive interaktiva workshoppar. Du kan också se hela funktionsöversikten på WordPress 7.1:s releasesida.