WordPress 7.1 „Mary Lou”: reszponzív stílusok, új médiafolyamat és fejlesztői API-k
Megjelent a WordPress 7.1, „Mary Lou” kódnévvel. A kiadás a napi adminhasználatot, a Site Editort, a médiakezelést és a közös tartalmi munkát is fejleszti, miközben több új lehetőséget ad a bővítmény- és témakészítőknek.
A verzió Mary Lou Williams jazz-zongorista, hangszerelő és zeneszerző előtt tiszteleg. A 7.1 fókuszában is az alkalmazkodás és az együttműködés áll: a szerkesztési felület következetesebben működik, a reszponzív megjelenést pedig egyre kevesebb egyedi CSS-szel kell megoldani.
WordPress 7.1 letöltéseReszponzív stílusok közvetlenül a szerkesztőben
A Site Editorban mostantól képernyőméretenként szabályozhatod egy blokk megjelenését. Ezt a Global Styles felületén és az egyes blokkok beállításaiban is megteheted, így a legtöbb ilyen feladathoz nem kell egyedi CSS-t írnod.
Munka közben eltérő viewportméretekben is előnézheted az eredményt. Így az elrendezés viselkedését már szerkesztéskor ellenőrizheted mobilon, tableten és nagyobb kijelzőn is.

Az admin bar minden szerkesztőben megjelenik
Az admin bar már minden szerkesztőnézetben veled marad. Ez egységesebb navigációt ad a Vezérlőpult, a bejegyzésszerkesztő és a webhelyszerkesztő között: mindig látod, hol jársz, és elérheted a megszokott admineszközöket.
A sáv kisebb vizuális finomításokat is kapott, hogy jobban illeszkedjen az egységes szerkesztési élményhez.

Új képszerkesztő folyamat
A korábbi beágyazott vágóeszközt egy külön média-szerkesztő modal váltja fel. A megszokott Crop gomb továbbra is ezt a felületet nyitja meg, de egy helyen kezelheted a szabadkézi és képarány szerinti vágást, a vízszintes és függőleges tükrözést, a pontos vagy léptetett forgatást, valamint a metaadatokat.

Szövegen belüli jegyzetek, említések és formázás
A Notes funkció most rich text formázást és említéseket is támogat. Félkövér, dőlt, kód formázást és linkeket adhatsz a jegyzethez, a @ karakterrel pedig megemlíthetsz egy közreműködőt, aki értesítést kap.
Nem kell többé teljes blokkhoz kötni a megjegyzést: közvetlenül egy kijelölt szövegrészhez is fűzhetsz jegyzetet. Egy blokkon több beszélgetés is futhat, a hosszabb megjegyzéseket pedig összecsukhatod, hogy a margó átlátható maradjon tartalmi ellenőrzés közben.

Gyorsabb médiakezelés és új képformátumok
A képtömörítés, az átméretezés és a bélyegképgenerálás a böngészőben fut. Ez csökkenti a szerverterhelést, kisebb fájlokat eredményez, és nagy feltöltéseknél elkerülheti a PHP memóriakorlátját vagy a feltöltési időtúllépést.
A feldolgozást a libvips WebAssembly-változata végzi. A WordPress 7.1 natívan támogatja az AVIF, HEIC és HDR gain map képformátumokat is, vagyis azokat a fájltípusokat, amelyeket a mai telefonok és fényképezőgépek már gyakran állítanak elő.

Új blokkok és részletesebb megjelenési vezérlők
A kiadás két új blokkot vezet be, és több ponton finomabb beállításokat ad a tartalom viselkedéséhez és megjelenéséhez.
Playlist blokk
Több hangsávot egyetlen lejátszási listába rendezhetsz. Opcionálisan hullámforma is megjelenhet, amely lejátszás közben vizuálisan jelzi az egyes hanganyagok alakulását.

Egyedi reszponzív töréspontok
A blokk témák a theme.json fájlban saját mobil- és tablet-töréspontokat definiálhatnak. Ezek felülírják a reszponzív stílusokhoz és a blokkok láthatóságához használt alapértelmezett értékeket.

Tabs blokk
A Tabs blokk füles paneleken rendezi el az összetartozó tartalmat. Így nem kell minden információt egyszerre megjelenítened, és zsúfoltság nélkül szervezheted egy egységbe a kapcsolódó részleteket.

Saját ikonok az Icon blokkhoz
A fejlesztők saját ikonkollekciókkal bővíthetik a WordPress ikonkészletét. Az így regisztrált ikonok a beépített könyvtár mellett a teljes szerkesztőben használhatók.

Interaktív gombállapotok
A Button blokkokhoz közvetlenül a szerkesztő stílusvezérlőiben adhatsz eltérő hover, focus és active állapotot. A beállítás érvényes lehet egyetlen gombra vagy az oldal összes gombjára.

Kiszámíthatóbb szerkesztési vászon
A bejegyzésszerkesztő most már minden témánál teljesen iframe-ben fut, ugyanúgy, mint a Site Editor. A szerkesztési vászon így elkülönül a WordPress adminfelületétől, ezért az admin stílusai nem szólnak bele a tartalom megjelenésébe.
A viewporthoz kötött egységek és a media queryk közvetlenül a szerkesztési vásznat célozzák. A változás nagyrészt észrevétlen marad, de a reszponzív elrendezések szerkesztés közben megbízhatóbban viselkednek.
Fejlesztői eszköztár
A WordPress 7.1 az ikonok, az automatizálás, az adminfelületek és a reszponzív stílusok körül is bővíti a fejlesztői API-kat.
Az SVG Icon API nyilvános API-vá vált. Saját ikonkollekciókat és ikonokat regisztrálhatsz, majd a szerkesztőben használhatod őket például a wp_register_icon_collection(), wp_register_icon() és wp_get_icon() függvényekkel.
Az Abilities API a WordPress 6.9-ben bevezetett infrastruktúrára épít. Szűrhető végrehajtási életciklust, egyedi validációt és megosztott felfedezést kapott, ami egyszerűbbé teszi az integrációk és automatizációk – köztük AI-alapú eszközök – építését.
Az új Design System alapot ad a WordPress adminfelületeinek témázásához: színeket, lekerekítést és kurzorstílusokat is kezel. Szemantikus design tokenekkel és a ThemeProvider React komponenssel olyan egyedi adminfelületet készíthetsz, amely vizuálisan továbbra is illeszkedik a WordPress-hez.
A témaszerzők a theme.json fájlban reszponzív és pszeudoállapot-stílusokat is megadhatnak a hover, focus, focus-visible és active állapothoz. Új filterekkel konfigurálhatják a Site Editor Pages, Templates, Parts és Patterns felületeit kiszolgáló DataViews és DataForm képernyőket is.
Akadálymentességi fejlesztések
A WordPress core és a szerkesztő akadálymentessége is javul. Az új wp_get_tooltip() és wp_get_toggletip() függvények hozzáférhető tooltipet adnak az admin több területén, beleértve a bejegyzés meta boxait és a bejelentkezési képernyőt.
A képernyőolvasós használat egyértelműbb címkéket és kiszámíthatóbb navigációt kap az adminfelületeken, különösen a bejegyzéslista-táblázatokban. A Tabs és Playlist blokkok, valamint a szerkesztő navigációjának és interakcióinak javításai is ezt a munkát egészítik ki.
További teljesítményjavítások
A GIF-videóvá alakítás opcionálisan bekapcsolható, és jellemzően kisebb fájlokat készít. A feltöltések folyamatjelzőt és automatikus újrapróbálkozást is kapnak, ezért kapcsolatmegszakadáskor ellenállóbbak.
A Médiatár alapértelmezésben végtelen görgetést használ. Felhasználónként visszaállítható a lapozás, ha inkább azt a navigációt részesíted előnyben.
A spekulatív betöltés alapértelmezett viselkedése környezeti változókon vagy konstansokon keresztül is megadható. A hoszting szolgáltatók és a webhelytulajdonosok így bővítmény írása nélkül szabályozhatják, hogyan töltse előre a WordPress az oldalakat.
Frissítés előtt és után
A kiadás teljes funkcióbemutatóját a WordPress 7.1 kiadási oldalán nézheted át. Telepítési tudnivalókért, javításokért és fájlváltozásokért olvasd el a WordPress 7.1 Release Notes dokumentációt.
Fejlesztőként a részletes változásokat és integrációs tudnivalókat a WordPress 7.1 Field Guide gyűjti össze. A Learn WordPress ingyenes útmutatóvideókat, interaktív workshopokat és részletes lecketerveket kínál kezdő és tapasztalt felhasználóknak; a workshopok a social learning felületen érhetők el.
Gyakorlati teendő
Frissítés előtt ellenőrizd a téma és a használt bővítmények kompatibilitását tesztkörnyezetben. Ha blokk témát fejlesztesz, külön vizsgáld meg a theme.json reszponzív töréspontjait és pszeudoállapot-stílusait, mert a 7.1 több új konfigurációs lehetőséget ad.
Hivatkozások / Források
Nagy Eszter
Frontend fejlesztő, a CSS és a reszponzív design megszállottja. Hiszek abban, hogy a szép kód szép weboldalakat eredményez. Tailwind CSS evangelista.
Összes bejegyzés