Leírás
Teljes és részletes bővítményleírás, dokumentáció és segítség: RotiStudio honlapján
Ez a bővítmény egy új Gutenberg blokkot ad, amellyel Dashicon választható és inline SVG-ként jeleníthető meg a frontendben. Az ikonok könnyűek, skálázhatók és teljesen testreszabhatók, így ideálisak modern, blokk-alapú WordPress oldalakhoz.
A bővítmény nem a hagyományos ikonmegjelenítési megközelítést használja (CSS-alapú ikonfontok, pszeudo-elemek és nagy icons.css fájlok). Ehelyett egy jóval optimálisabb, gyorsabb, mégis teljesen kompatibilis módszert alkalmaz. Nincs külön ikonfont és a frontend nem tölt be extra erőforrásokat. Csak a tiszta SVG kód kerül beágyazásra amit a böngészők jelenítenek meg. Nincsenek képek és CSS fájlok, az ikonok pedig minden méretben tökéletesen élesek lesznek.
Miért előnyös ez a bővítmény?
– Dashiconok egyszerű használata a frontendben
– 334 ikon közül választhatsz
– Core Web Vitals-barát
– Nincs ikonfont vagy CSS betöltés
– Nincsenek képfájlok
– Nincsenek felesleges, túlkomplikált funkciók
– Nincsenek akadálymentességet rontó CSS pszeudo-elemek
– Az ikonok bármilyen méretben élesek
– Az SVG ikonok tiszta inline kódként jelennek meg
– Biztonságos és ellenőrzött
Ikonok úgy, ahogy a Gutenberg elvárja
A Dashicon beillesztés natív blokk-elemként érhető el. Nincs HTML-hack vagy fontfüggőség — csak tiszta inline SVG közvetlenül a szerkesztőből.
Gyorsabb betöltés, stabilabb megjelenés
Ikonfontok letöltése és renderelése helyett az ikonok azonnal megjelennek a HTML-ben. Nincs FOIT, CSS pszeudo-elem vagy CLS kockázat — jobb Core Web Vitals és kiszámíthatóbb megjelenítés.
Biztonságos SVG használat
Nincs SVG-feltöltés vagy kockázatos adatfeldolgozás, módosítás. A bővítmény kizárólag a WordPress Dashicons hivatalos SVG forrásait használja — ellenőrzött, determinisztikus jelöléssel.
JavaScript mentes, cache-barát
Nincs ikonkönyvtár JavaScript, sprite-betöltő vagy futásidejű feldolgozás. Az SVG statikus HTML — ideális SSR-hez, statikus cache-hez és blokk-témákhoz.
Felhasználóbarát szerkesztői élmény
A Dashicon-választó blokk gyors, ismerős felületet kínál. Egyszerű és következetes használat — a tartalomkészítők ikonokat választanak, nem kódot szerkesztenek.
A saját nyelveden
A bővítmény a hivatalos translate.wordpress.org felületen gyorsan és egyszerűen lefordítható, így a saját nyelveden is kényelmesen használható.
Vannak további bővítményeid? Igen, nézd meg a bővítményes oldalamat: rotistudio.hu
Hol tudhatok meg többet a munkáidról? A személyes oldalamon: rottenbacher.hu
Képernyőmentések
Frontendben megjelenített inline SVG ikon. 
Dashicon SVG blokk-választó a Gutenberg szerkesztőben. 
Testreszabási lehetőségek: szín, méret, háttér, térköz és szegély.
Blokkok
This plugin provides 1 block.
- SVG block for Dashicon
Telepítés
- Töltsd fel a bővítmény mappáját a
/wp-content/plugins/svg-block-for-dashicon-rotistudiokönyvtárba. - Aktiváld a bővítményt a WordPress ‘Bővítmények’ menüjében.
GYIK
-
Hogyan használható?
-
Telepítés és aktiválás után a szerkesztőben (Gutenberg) egy bekezdésben a /svg beírásával azonnal beszúrható. Blokk hozzáadásakor az SVG kifejezésre keresve is megtalálható.
-
Hány ikon található a bővítményben?
-
A bővítmény 334 Dashicont tartalmaz SVG kód formátumban (fájlok nélkül, csak path adatokkal).
-
Mennyire kompatibilis, elterjedt az inline SVG ikonhasználat?
-
Az ikonok SVG kódként jelennek meg, amelyet minden modern böngésző régóta natívan támogat.
-
Működik meglévő témákkal?
-
Igen. A stílusok inline módon kerülnek alkalmazásra, így minden blokk-témával és a legtöbb klasszikus témával is működik.
-
Könnyű, egyszerű és gyors?
-
Igen. A bővítmény kódja minimális, gyors, biztonságos és teljesítményre optimalizált. Csak a kiválasztott SVG ikon kerül renderelésre a honlapon és a szerkesztőben.
-
Testreszabhatók az ikonok?
-
Igen. Testreszabható az ikon mérete, színe, háttérszíne, szegélye, lekerekítése, helyköze és margója.
-
Miért látok kontraszt figyelmeztetést a blokk-szerkesztőben?
-
A WordPress blokk-szerkesztő kontrasztfigyelmeztetést jeleníthet meg, amikor az ikon szövegszínét az oldal háttéréhez hasonlítja. Ez nyugodtan figyelmen kívül hagyható, mert nem a tényleges színkombinációt ellenőrzi.
Amit a szerkesztő ellenőriz: szövegszín vs. oldal háttérszín
Ami a frontendben számít: szövegszín vs. ikon háttérszíne (az SVG elemre alkalmazva)A frontendben minden szín (szöveg, háttér, padding, margin) közvetlenül az SVG elemre kerül alkalmazásra, így a kontrasztarány is helyes lesz, ahol valóban számít.
-
Elérhető más nyelveken is?
-
Igen. A bővítmény teljesen nyelvesített és fordításra kész. A magyar fordítás alapból elérhető. A fordítási fájlokat a WordPress 4.6+ automatikusan betölti, így megfelel a WordPress.org Plugin Check követelményeinek.
-
Kompatibilis a Klasszikus Szerkesztővel?
-
Sajnos nem, a bővítmény kifejezetten a Gutenberg szerkesztőhöz készült.
Vélemények
Nincsenek értékelések erről a bővítményről.
Közreműködők és fejlesztők
“SVG blokk Dashiconokhoz – RotiStudio” egy nyílt forráskódú szoftver. A bővítményhez a következő személyek járultak hozzá:
Közreműködők
“SVG blokk Dashiconokhoz – RotiStudio” 1 nyelvre lett lefordítva. Köszönet a fordítóknak az áldozatos munkájukért!
“SVG blokk Dashiconokhoz – RotiStudio” fordítása a saját nyelvünkre.
Érdekeltek vagyunk a fejlesztésben?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Változási napló
1.3.0
- 100% border-radius javítása.
- Az eredeti SVG pathok javítása a 4 admin-site ikonhoz.
- Akadálymentesség javítása.
- Bekerült a fit-content szélesség és magasság stílusérték.
- Színátmenet támogatása háttérnél.
- Hivatkozás hozzáadás támogatása.
1.2.0
- Bővítmény név, slug és textdomain módosítása.
- WordPress Coding Standards (WPCS) és ESLint javítások.
- Blokk előnézet hozzáadása.
1.1.0
- Teljes internacionalizáció (i18n) magyar fordítással.
- WordPress.org Plugin Check kompatibilis (automatikus fordításbetöltés WordPress 4.6+).
1.0.0
- Első kiadás.