Nyheder i WordPress 6.2: Browse Mode, Style Book, forbedrede navigationsmenuer, nye API’er og meget mere

WordPress 6.2 “Dolphy” er blevet frigivet, og det er tid til at udforske, hvad der er nyt i den første version af 2023.

Med WordPress 6.2 går vi ind i den sidste fase af fase 2 af den langsigtede Gutenberg-udviklingsplan, og blokeditoren removal officielt betafasen.

Denne udgivelse fokuserer primært på at forbedre grænsefladen og strømline redigeringsoplevelsen.

Der er blevet indført en ny tilgang til at navigere mellem skabeloner og skabelondele samt muligheden for at importere widgets til bloktemaer, en ny skrivetilstand uden distraktioner, en oplevelse med blokindstillinger i skala og masser af store og små forbedringer af eksisterende blokke, ydeevne og brugervenlighed.

Men hvis der er noget, der springer fremad med hensyn til funktionalitet og brugervenlighed, er det navigationsblokken. Siden den blev udgivet første gang, har Navigationsmenuen gennemgået flere iterationer, der har strømlinet redigeringsprocessen betydeligt med tiden. Med WordPress 6.2 fortsætter udviklingen, og i denne artikel viser vi dig, hvor nemt du nu kan administrere en navigationsmenu.

Tjek vores videoguide for at finde ud af, hvad der er nyt i WordPress 6.2

Forbedret redigeringsoplevelse

WordPress 6.2 bringer en forbedret redigeringsoplevelse, hvor hele sidestrukturen er placeret i centrum. Du kan nu nemmere administrere navigationsmenuer, skubbe stilændringer fra en enkelt blok til globale stilarter og nemt navigere mellem skabeloner og skabelondele med farvelagte skabelondele og genanvendelige blokke.

Men der er meget mere. Lad os udforske de vigtigste tilføjelser og ændringer i editorens brugerflade i detaljer.

En fornyet grænseflade og gennemsetilstand for webstedseditoren

Med WordPress 6.2 kommer flere forbedringer til editorgrænsefladen til kernen. Den første og mest interessante opdatering påvirker Site Editor-grænsefladen. Takket være en ny Browse Mode er det nu nemmere at navigere gennem skabeloner og skabelondele.

Den nye grænseflade giver dig også mulighed for at tilføje en ny skabelon eller skabelondel direkte fra editorens sidebar ved blot at klikke på plusikonet (+), der er placeret til højre for menutitlen.

Ifølge Ryan Welcher, Wp Core and Documentation contributor, “[D]et arbejde med denne funktion er i gang og vil fortsat blive forbedret, efterhånden som nye Gutenberg-versioner frigives.”

Arbejdsgangen er nu glattere og mere problemfri. For at begynde at redigere den aktuelle skabelon/skabelondel skal du blot klikke på knappen Rediger i menuen til venstre eller på skabelonforhåndsvisningen i midten af siden.

Distraktionsfri tilstand

WordPress 6.2 introducerer en ny Distraction Free-redigeringstilstand, som skærer rod fra lærredet og giver dig mulighed for at fokusere på sidens indhold.

Du kan aktivere denne funktion i indstillingspanelet, der vises ved at klikke på ellipse-ikonet (tre prikker) i øverste højre hjørne.

Når Distraction Free-tilstand er aktiveret, forsvinder uvedkommende sidebars og værktøjslinjer, så der kun er det indhold, du arbejder på, tilbage på skærmen.

Inspektør af blokke med faneblade

WordPress 6.2 introducerer en ny Block Inspector, der har til formål at skabe orden i sidebaren ved at opdele indstillingerne i separate paneler.

Blokindstillingerne er nu opdelt i faner for at adskille stilindstillinger fra andre blokindstillinger.

Hvis de er tilgængelige, vises fanerne i Block Inspector i følgende rækkefølge:

• Listevisning: Indeholder kontrolelementer til administration af en bloks børn, f.eks. undermenuer og links i blokken Navigation
• Indstillinger: Indeholder konfigurationsindstillinger, der ikke vedrører blokkens udseende
• Udseende: Indeholder indstillinger, der specifikt er relateret til den aktuelle bloks styling, f.eks. typografi og farver

Dette er en bemærkelsesværdig forbedring af brugervenligheden af grænsefladen, især for avancerede blokke med mange konfigurationsmuligheder som gruppeblokken eller navigationsblokken.

Bemærk, at:

• Den nye inspektør viser kun en fane, når den indeholder elementer, der skal vises.
• Hvis fanen Indstillinger kun indeholder panelet Avanceret, flyttes det til fanen Udseende.
• Hvis blokinspektøren kun har én fane, vises den som før WordPress 6.2.

Tjek dev-noten for at se nærmere på den nye Block Inspector.

Farvelagte skabelondele og genanvendelige blokke

For lettere at skelne dem fra grupper og blokke er skabelondele og genanvendelige blokke nu fremhævet i en anden farve i listevisning, blokindsats, blokværktøjslinjen og i editorens lærred.

Dette sker både i Site Editor og i indlægseditoren, som vist i billedet nedenfor.

En fornyet blokindsætter

Block Inserter er påvirket af flere ændringer, der forbedrer den overordnede redigeringsoplevelse betydeligt.

For det første forbedrer et nyt interface-design navigationen mellem mønster- og mediekategorier og giver større forhåndsvisninger for mønstre og medieelementer.

Når der findes medier på webstedet, vises en Media-fane i Block Inserter for at forenkle indsættelse af medier i indholdet. Du kan trække og slippe billeder/medier eller blot klikke på dit medie for at tilføje det til indholdet.

Inde i fanen er der en knap Åbn mediebibliotek, der fører dig til WordPress Media Lybrary.

Openverse-integration i Block Inserter

Openverse er et værktøj, der har til formål at dele værker med åben licens eller offentligt domæne til brug for alle. Nu, med WordPress 6.2, er Openverse integreret i Block Inserter.

For at få adgang til denne nye funktion skal du klikke på fanen Medier i Block Inserter. Dette viser et panel med et søgefelt og billedeforhåndsvisninger direkte fra Openverse-repositoriet.

Du kan se de tekniske detaljer i Pull Request for Openverse-integration.

Migrering af widgets til blok-temaer

Fra og med WordPress 6.2 kan brugere, der driver et websted med et klassisk tema, og som beslutter sig for at skifte til et blok-tema, migrere deres eksisterende widget-områder til det nye tema og konvertere dem til skabelondele.

Lad os finde ud af, hvordan det fungerer.

Først skal du oprette et widgetområde i et klassisk tema. Du kan f.eks. aktivere Twenty-Eleven og tilføje en kalender til Footer Area One.

Nu ændrer du temaet til Twenty Twenty-Three. Åbn Site Editor, vælg en skabelon til redigering og tilføj en skabelondel.

I bloksidebaren skal du vælge det widgetområde, der skal importeres, i rullemenuen Importer widgetområde.

Og det er det. Nu kan du administrere dit tidligere widgetområde som enhver anden skabelondel.

Dokumentdetaljer og listevisning kombineret

Før WordPress 6.2 var der to separate knapper i Editor-værktøjslinjen for Detaljer og Listevisning. På følgende billede kan du se popoveren med dokumentdetaljer i WordPress 6.1, herunder antal ord, antal tegn, læsetid og antallet af overskrifter, afsnit og blokke samt dokumentoversigt.

Fra og med WordPress 6.2 er Listevisning og Detaljer flyttet til et enkelt panel med dokumentoversigt, der er opdelt i to faner: Listevisning og Oversigt.

Denne ændring skulle give en nemmere måde at administrere dokumentet på.

Udvidede blokkapaciteter

Med WordPress 6.2 er mulighederne for flere centrale bloktyper blevet udvidet. Dette gælder især for navigationsblokken, som er påvirket af flere ændringer og forbedringer af redigeringsoplevelsen.

Lad os tage et kig på de vigtigste ændringer i detaljer.

Listebaseret redigering for navigationsblokken

Med udgivelsen af WordPress 6.2 er det muligt at ændre arrangementet af Navigationsblokelementer fra en listevisning i blokindstillingernes sidebar.

Hvis du klikker på menupunktet, kommer du til indstillingssidebjælken for det valgte sidelink, hvor du kan redigere linkdetaljerne, herunder label, URL, beskrivelse, linktitel og link rel.

Denne ændring forenkler i høj grad redigeringsoplevelsen af navigationsmenuer, så du kan tilføje, arrangere og slette elementer i din menu eller endda oprette nye navigationsmenuer.

Lås navigation

En anden forbedring af navigationsblokken er muligheden for at låse menueredigering på en mere granulær måde. Nu kan du Begrænse redigering, Deaktivere bevægelse og Forhindre fjernelse, hvorimod der med WordPress 6.1 kun var mulighederne Begrænse redigering og Deaktivere bevægelse tilgængelige.

Desuden kan de valgte indstillinger også anvendes på de indre blokke (links og undermenuer).

Tilføj/fjern billedtekster fra blokværktøjslinjen

En ny knap Tilføj/fjern billedtekst giver brugerne mulighed for at styre billedtekster fra blokværktøjslinjen for flere blokke (Lyd, Video, Billede).

Hvis du allerede har indstillet en billedtekst, vil den automatisk blive inkluderet, når du tilføjer billedet til dit indhold.

Forbedringer til blokken Sideliste

To forbedringer vedrører blokken Sideliste.

For det første kan blokken Sideliste nu udvides for at vise listen over sider i panelet Listevisning.

Desuden giver en ny indstilling i bloksidebaren dig nu mulighed for at angive en startside og kun vise sider, der er nedadgående fra den, i blokken.

Ny pladsholder for gruppeblokken

Nu viser pladsholderen for gruppeblokken en variationsvælger, når blokken tilføjes til sidens indhold.

Støtte til klæbrig placering af blokke

WordPress 6.2 introducerer en ny funktion til understøttelse af positioneringsblokke, begyndende med sticky positionering.

Denne nye funktion gælder i øjeblikket kun for Gruppeblokke, som den som standard er valgt til.

Temaudviklere kan aktivere sticky positionering på deres temaer ved hjælp af funktionen appearanceTools i theme.json. Hvis du ønsker mere granulær kontrol over udseendeværktøjer, kan du også indstille settings.position.sticky -prop’en til true.

Du kan aktivere klæbende positionering i panelet Position i inspektørens kontrolsidebar.

Når klæbende positionering er aktiveret, får HTML-tagget en is-position-sticky -klasse, og nogle CSS-regler gælder for det tilsvarende element:

.wp-container-6 {
    top: calc(0px + var(--wp-admin--admin-bar--position-offset, 0px));
    position: sticky;
    z-index: 10;
}

Sticky positioning fungerer kun for gruppeblokke ved roden af dokumentet. Selvom dette kan forhindre forvirring og fejl for brugerne, kan du finde indbygget sticky positionering lidt vanskelig i øjeblikket (og du vil måske tjekke forskellige metoder til at tilføje en sticky header til dit WordPress-websted). Men ifølge dev-noten

… i manuel test viste feedback, at uden yderligere UI- eller UX-arbejde kunne det være forvirrende for brugere, der forsøger at oprette klæbende overskrifter, hvis de ved et uheld indstiller en ikke-rodblok til klæbende, eller for eksempel en blok inden for en del af en overskriftsskabelon til klæbende. Beslutningen blev at reducere funktionen til kun at omfatte rodblokkene i 6.2 for at give mere tid til at undersøge en passende løsning for indlejrede blokke.

Placeringsfunktionen er kun tilgængelig for individuelle blokke, så du finder den ikke i globale stilarter.

Yderligere forbedringer af oplevelsen af blokredigering

Nogle andre bemærkelsesværdige opgraderinger af blokredigering omfatter følgende:

• Du kan nu drag n drop billeder på et tomt afsnit for at erstatte det med en billedblok.
• Typografikontroller er blevet grupperet i paneler. Dette gør grænsefladen for stilarter mere konsistent med grænsefladen for indstillinger og forbedrer dens brugervenlighed, da du nu kan vise og skjule kontrolelementer som i grænsefladen for blokindstillinger.

  

• Det er nu muligt at ændre bogstavafstanden i header blokkene direkte i grænsefladen Globale stilarter.
• Du kan nu indstille baggrunds-, link- og tekstfarve for blokken Kalender.
• Der er blevet indført to nye kategorier af blokmønstre for bannere og sidefødder for bedre at afspejle strukturen på websider.
• Det er nu muligt at autokomplettere links i enhver blok ved hjælp af genvejen [[. Før denne ændring skulle blokke eksplicit erklære understøttelse af automatisk udfyldelse af links ved hjælp af __experimentalSlashInserter.
• En ny tastaturgenvej control + option + 1–6 giver dig mulighed for at omdanne et afsnit til en header
• Blokken Sideliste understøtter nu alle typografiske indstillinger, herunder skrifttypefamilie, skriftstørrelse, udseende, linjehøjde, bogstavafstand, dekoration og bogstavhøjde.

  

Forbedrede designværktøjer

Mange af de nye funktioner og forbedringer, der er indført med WordPress 6.2, forbedrer CMS’ets styling- og designmuligheder. Nedenfor er en liste over de mest interessante designrelaterede funktioner, der kommer med 6.2; vi vil beskrive hver enkelt funktion nærmere længere nede.

Style Book

WordPress 6.2 introducerer en ny Style Book-funktion, der gør det muligt for brugerne at få vist alle blokke, der kan bruges på deres websteder, uden at de behøver at tilføje disse blokke til en skabelon/skabelondel. Du kan starte Style Book ved at klikke på knappen Open Style Book (øjenikonet), der nu vises i Styles-headeren inden for globale stilarter.

Dette åbner en grænseflade, der viser en forhåndsvisning af alle kerne- og tredjepartsblokke efter kategori.

Den nye Style Book-grænseflade forenkler designprocessen ved at gøre forhåndsvisninger af alle blokformer tilgængelige på et enkelt centralt sted.

Teknisk set genereres den nye grænseflade af en ny StyleBook -komponent, der er tilføjet til @wordpress/edit-site for at vise en forhåndsvisning af hver registreret blok i en iframe (se også PR #45960).

Den samme grænseflade giver også forhåndsvisninger af de enkelte blokke. Som et eksempel viser følgende billede en forhåndsvisning af en tilpasset kalenderwidget.

Udviklere kan skjule en blok fra at blive indsat og få vist i forhåndsvisning på to måder. For det første kan du indstille supports.inserter til false i block.json:

{
    "supports": {
        "inserter": false
    }
}

En anden måde at skjule blokgennemgangen på er at undgå example -egenskaben, som bruges til at oprette en forhåndsvisning af blokken i Inspektørens hjælpepanel (læs mere her).

Skygger i globale stilarter

Med WordPress 6.2 er det nu muligt at tilføje og tilpasse skygger til nogle blokke ved hjælp af Global Styles eller theme.json (i skrivende stund er skyggefunktionen kun tilgængelig for Button-blokken).

For det første kan du i temaer, der understøtter denne funktion, tilføje skygger fra Global Styles-grænsefladen.

Hvis du vil se det i aktion, skal du aktivere Twenty Twenty-Three-temaet, navigere til Styles > Blocks > Button (blokke > knap) og klikke på knappen Shadow (skygge).

I en popup-meddelelse Skygge kan du vælge en skygge fra temaets forudindstillinger.

Temaudviklere og avancerede brugere kan også tilføje en skygge til blokke ved hjælp af theme.json. Den følgende definition tilføjer en 4px sort skygge til Button-blokke:

"styles": {
    "blocks": {
        "core/button": {
            "shadow": "4px 4px #000000"
        }
    }
},

Du kan også definere forudindstillinger for at give temabrugere mulighed for at vælge en fra Styles-grænsefladen:

"settings": {
    "shadow": {
        "presets": [
            {
                "shadow": "4px 4px #FF0000",
                "name": "Red",
                "slug": "red"
            },
            {
                "shadow": "4px 4px #00FF00",
                "name": "Green",
                "slug": "green"
            },
            {
                "shadow": "4px 4px #0000FF",
                "name": "Blue",
                "slug": "blue"
            }
        ]
    },
}

Når du har defineret dine forudindstillinger, vises de i Skyggepanelet i blokken Stilarter.

Du kan også vælge værdien af en forudindstilling og bruge den som standardindstillinger for blokken:

"styles": {
    "blocks": {
        "core/button": {
            "shadow": "var(--wp--preset--shadow--blue)"
        }
    }
}

Ny kontrol af minimumshøjde dimensionskontrol

Fra og med WordPress 6.2 indeholder panelet Dimensioner i blokindstillingerne i sidebaren for blokkene Gruppe og Indlægsindhold nu en ny kontrol for minimumshøjde, som er aktiveret som standard i temaer, der bruger funktionen appearanceTools.

Denne nye kontrol giver brugerne mulighed for at indstille en minimumshøjde for blokkene Gruppe og Indlægsindhold og kan bruges til at gengive footeren nederst på siden, selv med lidt indhold.

Kombineret med de nye værktøjer til lodret justering giver den også mulighed for at lodret justere indre elementer øverst/midt/nedre på siden.

Udviklere kan tilføje understøttelse af minimumshøjde til temaer ved at tilføje indstillingen minHeight til theme.json:

{
    "settings": {
        dimensions: "minHeight": true
    }
}

Du kan også bruge appearanceTools -egenskaben:

{
    "settings": {
        "appearanceTools": true
    }
}

Den nye egenskab minHeight kan også bruges til at indstille en bestemt værdi direkte i theme.json:

{
    "styles": {
        "blocks": {
            "core/post-content": {
                "dimensions": {
                    "minHeight": "80vh"
                }
            }
        }
    }
}

Block-udviklere kan tilføje supports.dimensions.minHeight -egenskaben til deres block.json-fil og indstille dens værdi til true. For statiske blokke vil CSS-reglen min-height blive gemt som en inline-stil, mens den for dynamiske blokke vil blive inkluderet i den stilattribut, der returneres af get_block_wrapper_attributes.

Brugerdefineret CSS i panelet for stilarter

En af de funktioner, der manglede i Site Editor i forhold til Theme Customizer, var muligheden for at tilføje brugerdefinerede CSS-stilarter. WordPress 6.2 udfylder hullet, og nu indeholder Global Styles-grænsefladen et tekstfelt til at tilføje brugerdefinerede CSS-regler, som ikke bliver overskrevet, når du opdaterer dit tema.

Du kan tilføje brugerdefinerede stilarter enten pr. blok, fra panelet for blokstilarter eller ved at klikke på knappen Flere stilarter handlinger i værktøjslinjen Stilarter. Dette viser en pop op-menu, der viser et Additional CSS-element.

For at understøtte brugerdefineret CSS er der blevet tilføjet en ny styles.css -egenskab til theme.json.

Brugerdefinerede CSS-regler kan fuldstændigt tilsidesætte alle brugerdefinerede stilarter, der er indstillet i theme.json. Hvis du ikke ønsker, at dette skal ske, kan du overveje at inkludere stylesheet ved hjælp af de eksisterende enqueuing-metoder.

Du kan også tilføje brugerdefineret CSS pr. blok i theme.json ved hjælp af egenskaben styles.blocks.block.css:

"styles": {
    "blocks": {
        "core/button": {
            "css": "background: #FF0000"
        }
    }
}

Du kan også bruge & til indlejrede elementer og pseudo-selektorer.

Du kan se nærmere på den nye brugerdefinerede CSS-funktion under Brugerdefineret CSS til globale stilarter og per blok.

Kopiering og indsættelse af stilarter mellem blokke

En ny gruppe i menuen Indstillinger i blokens værktøjslinje viser nu to knapper til at kopiere stilarter og indsætte stilarter. Før denne tilføjelse var det kun muligt at kopiere stilarter, men det var ikke klart, hvordan man indsætter stilarter.

For at prøve denne nye funktion skal du tilføje en ny blok, f.eks. en overskrift. Ændre stilen og vælg Kopier stilarter i menuen Indstillinger for blokken.

Vælg derefter en anden blok, og vælg Indsæt stil. De kopierede stilarter anvendes automatisk i den anden blok.

Bemærk, at denne funktion kun er tilgængelig på sikre (https) websteder i understøttende browsere. For yderligere detaljer, se pull request.

Anvend blokændringer globalt

WordPress 6.2 introducerer også en knap Anvend globalt under panelet Avanceret for individuelle blokke, som giver dig mulighed for at skubbe dine blokstilændringer til Globale stilarter og anvende disse ændringer på hele webstedet.

Takket være denne nye funktion er det nu lige så nemt som at trykke på en knap at anvende bloktypografi, afstand, dimensioner og farvestyling på alle blokke af den pågældende type (se også denne pull request).

Forbedret designoplevelse med afstandsvisualiseringer

Spacing Visualizers giver dig mulighed for at få vist et eksempel på mængden af margin eller padding, der anvendes på en blok. Med WordPress 6.2 er denne funktion forbedret med et par tilføjelser, der forbedrer redigeringsoplevelsen.

For det første vises Spacing Visualizers nu, så snart du holder musen hen over margin- eller paddingkontrollen.

For det andet skjuler Spacing Visualizer nu automatisk blokværktøjslinjen, så snart du holder musen over afstandsindstillingen, så du kan få vist de nye indstillinger for margen og padding uden at blokværktøjslinjen fylder for meget.

Dette er små, men væsentlige ændringer, der påvirker et stort antal kerneblokke.

Ændringer for udviklere

WordPress 6.2 bringer også mange nye funktioner til udviklere: nye API’er, fejlrettelser, ydelsesforbedringer og meget mere. Lad os dykke ned i de mest tiltalende tilføjelser.

En ny HTML API

WordPress 6.2 introducerer HTML Tag Processor, en HTML5-spec-kompatibel parser, der giver en sikker måde at finde specifikke HTML-tags på og tilføje, fjerne eller opdatere attributter via PHP. HTML Tag Processor er den første komponent i en ny HTML-behandlings-API.

Den nye API gør det nemt at udføre tidligere komplekse opgaver, som ofte krævede brug af regulære udtryk.

I det følgende eksempel tilføjer vi blot attributten alt til et img -tag:

$html = '<img src="/my-image.jpg" />';

$p = new WP_HTML_Tag_Processor( $html );
 
if ( $p->next_tag() ) {
    $p->set_attribute( 'alt', 'Hello WordPress 6.2' );
}
 
echo $p->get_updated_html();

Denne kode ville give følgende img -tag:

<img alt="Hello WordPress 6.2" src="/my-image.jpg">

Metoden $p->next_tag() flytter til det næste tilgængelige tag i HTML-koden. Den accepterer også et tag-navn, en CSS-klasse eller begge dele for at finde specifikke tags, som vist i eksemplet ovenfor.

Hvis du vil redigere HTML-tags, skal du først vælge måltagget:

$p->next_tag();

Når du har valgt måltagget, kan du bruge API-metoderne til at udføre flere operationer:

• $p->get_tag()
• $p->set_attribute()
• $p->get_attribute()
• $p->remove_attribute()
• $p->add_class()
• $p->remove_class()

Du kan indstille en stilattribut:

$html = '<a href="https://example.com">example.com</a>';

$p = new WP_HTML_Tag_Processor( $html );

if ( $p->next_tag( 'a' ) ) {
    $p->set_attribute( 'style', 'text-decoration: wavy underline purple;' );
}

echo $p->get_updated_html();

Du kan også tilføje eller fjerne en klasse eller en attribut. I den følgende kode tilføjer vi en brugerdefineret klasse til et h1 tag:

$html = '<div><h1>Page Title</h1></div>';

$p = new WP_HTML_Tag_Processor( $html );

if( $p->next_tag( 'h1' ) ) {
    $p->add_class( 'title' );
}

echo $p->get_updated_html();

Du kan derefter ekko eller returnere det opdaterede tag ved hjælp af metoden $p->get_updated_html().

Hvis du vil se nærmere på den nye HTML API, kan du se denne interaktive PHP-tutorial fra Adam Zieliński, WordPress Core committer.

Mønstre API og en ny template_types Property

Patterns API ‘et giver WordPress-udviklere mulighed for at “oprette foruddesignede indholdsblokke, der nemt kan indsættes i indlæg, sider, brugerdefinerede indlægstyper og skabeloner”.

Med WordPress 6.2 indeholder Patterns API’et nu en ny template_types -egenskab, så du kan angive, hvilke skabeloner et bestemt blokmønster kan bruges i.

Jorge Costa fremhæver, at dette er en opdatering, der kun gælder for backend, og at der i øjeblikket ikke er nogen tilsvarende UX-funktionalitet. Vi kan dog forvente at se udviklede implementeringer af denne funktion med WordPress 6.3:

Den første anvendelse, som tænkes til WordPress 6.3, er at vise brugeren nogle mønstre, der giver mening på en skabelon, når brugeren begynder at oprette en skabelon. Brugerne kan starte fra et mønster i stedet for “blank” eller fallback-skabelonen.

På den tekniske side er funktionen register_block_pattern() blevet ændret, så den indeholder en ny parameter template_types, som er et array af strenge, der indeholder navnene på de skabeloner, som blokmønstret er beregnet til.

REST API ‘et blev også ændret til at returnere skabelontyperne for et blokmønster, hvis der er defineret mindst én.

React v18.0 og Concurrency Mode

WordPress 6.2 leverer også en ny version af React-biblioteket, som nu er opdateret til version 18.0. Den nye version kommer med nye API’er, funktioner, forbedringer og fejlrettelser. En af de vigtigste funktioner, der kommer med React v18.0, er indførelsen af concurrency mode, “en ny mekanisme bag kulisserne, der gør det muligt for React at forberede flere versioner af din brugergrænseflade på samme tid”.

Et af de vigtigste kendetegn ved Concurrent Mode i React er, at den kan afbrydes:

React garanterer, at brugergrænsefladen vil fremstå konsistent, selv hvis en rendering afbrydes. For at gøre dette venter den med at udføre DOM-mutationer til slutningen, når hele træet er blevet evalueret. Med denne evne kan React forberede nye skærmbilleder i baggrunden uden at blokere hovedtråden. Det betyder, at brugergrænsefladen kan reagere straks på brugerinput, selv om den er midt i en stor renderingsopgave, hvilket skaber en flydende brugeroplevelse.

Den største fordel er, at brugergrænsefladen reagerer på brugerinput med det samme, samtidig med den opgave, den stadig kører i baggrunden.

Konkurrence introducerer dog også potentielle faldgruber, som udviklere bør være opmærksomme på. Du kan få en mere dybdegående oversigt over Concurrent Mode i React i WordPress 6.2 ved at se eksemplerne i dev-noten.

Yderligere ændringer for udviklere

Andre bemærkelsesværdige ændringer, som udviklere bør være opmærksomme på, omfatter følgende:

• WordPress 6.2 introducerer et nyt JavaScript-filter, der kan bruges til at filtrere blokindstillinger, før editoren gengives på skærmen. Det nye blockEditor.useSetting.before -filter giver også udviklere mulighed for at ændre indstillinger baseret på blokplacering, den aktuelle brugerrolle, naboblokke og meget mere. Du kan finde yderligere oplysninger og eksempler på brug i Tilpas indstillinger for enhver blok i WordPress 6.2 for yderligere oplysninger og eksempler på brug.
• Der er indført en ny skipBlockSupportAttributes -prop for at udelukke attributter og stilarter relateret til blokunderstøttelse i ServerSideRender -komponenten.
• En ny theme.json API gør det nu muligt at style eksisterende variationer af kerneblokke fra theme.json.
• Google Fonts er nu inkluderet lokalt og ikke hentet fra Google-adresser i bundlede temaer fra Twenty Twelve til Twenty Seventeen.

Men det er ikke det hele. WordPress 6.2 introducerer mange funktioner, forbedringer og fejlrettelser, som vi ikke har nævnt her for korthedens skyld. Du kan få en mere omfattende oversigt ved at læse WordPress 6.2 Field Guide.

Resumé

WordPress 6.2 bringer os tættere på afslutningen af fase 2 af Gutenberg-projektet ved navn Customization. Men som Matias Ventura påpeger, betyder det ikke, at arbejdet med tilpasningen er afsluttet og i fremtidige versioner. Som altid kan vi forvente yderligere forbedringer af editoren baseret på feedback fra fællesskabet.

I dette indlæg har vi udforsket nogle af de vigtigste funktioner, forbedringer og fejlrettelser, der kommer med WordPress 6.2. Men der er meget mere i 6.2. Med ti versioner af Gutenberg-plugin ‘et i kernen – fra 14.2 til 15.1 – kommer vi til at se en ny Browse Mode, en Tabbed Block Inspector, migrering af Widgets til Block Themes, nye API’er og tonsvis af forbedringer og fejlrettelser. Og der vil også være forbedringer af tilgængelighed og internationalisering.

Og hvis du elsker WordPress og ønsker at erhverve nye WordPress-udviklingsfærdigheder eller teste og yde bidrag til CMS’et, skal du sørge for at tage DevKinsta, Kinstas helt gratis lokale WordPress-udviklingspakke, på en prøvetur.

Nu er det op til dig: Har du allerede testet den nye version i dit udviklingsmiljø? Hvilke funktioner kan du bedst lide i WordPress 6.2? Del dine tanker i kommentarfeltet nedenfor.