Ugrás a tartalomra
WordPress 7.1 „Mary Lou”: reszponzív stílusok, új médiafolyamat és fejlesztői API-k
Nagy Eszter
Nagy Eszter 2026. augusztus 22. · 9 perc olvasás

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ése wordpress-7.1.zip

Reszponzí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.

Reszponzív blokkstílusok beállítása a WordPress szerkesztőjében
A blokkstílusok képernyőméretenként is szabályozhatók. — Forrás: WordPress.org

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.

WordPress admin bar a szerkesztőfelületen
Az admin bar most már a teljes szerkesztési környezetben elérhető. — Forrás: WordPress.org

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

Új WordPress médiatáras képszerkesztő vágási beállításokkal
A vágás, tükrözés, forgatás és metaadatszerkesztés egy közös felületre került. — Forrás: WordPress.org

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.

Szövegen belüli WordPress-jegyzet említéssel és formázással
A jegyzetek már kijelölt szövegrészhez is kapcsolhatók, és említéseket is fogadnak. — Forrás: WordPress.org

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

Gyorsabb WordPress-feltöltés és új képformátumok támogatása
A böngészőoldali képfeldolgozás levesz terhet a szerverről. — Forrás: WordPress.org

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

Playlist blokk hullámforma-megjelenítéssel
A Playlist blokk több hangfájlt kezelhet egy lejátszási listaként. — Forrás: WordPress.org

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.

Egyedi mobil- és tablet-töréspontok beállítása WordPress témában
A témák saját töréspontokkal szabályozhatják a reszponzív stílusokat. — Forrás: WordPress.org

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.

Tabs blokk füles tartalmi panelekkel a WordPress szerkesztőben
A Tabs blokk rendezettebben jeleníti meg az egymáshoz kapcsolódó tartalmakat. — Forrás: WordPress.org

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.

Egyedi ikonkollekció hozzáadása a WordPress szerkesztőhöz
Saját ikonok is elérhetővé tehetők a szerkesztő ikonkészletében. — Forrás: WordPress.org

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.

Gombblokk hover, focus és active állapotainak szerkesztése
A Button blokkok interaktív állapotai egyedi stílust kaphatnak. — Forrás: WordPress.org

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.

Nagy Eszter

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

Csatlakozz a HelloWP közösséghez!

Beszélgess velünk a WordPressről, a webfejlesztésről, és oszd meg a tapasztalataidat más fejlesztőkkel.

- tag
- online
Csatlakozás

Sütiket használunk az élményed javítása érdekében. A folytatással elfogadod a Sütikre vonatkozó irányelveinket.