mindenkivel előfordul.

találsz egy témát, amit szeretsz, telepíted, és néhány hónapot töltesz azzal, hogy élvezd a webhelyed megjelenését. De aztán, néhány hónap múlva, a téma elavultnak érzi magát. Egy kicsit unalmas.

az egyetlen probléma az, hogy nem akarsz pár órát tölteni valami új keresésével. Ha csak lenne mód egy kis fűszer hozzáadására a témához, akkor egy kis fáklya, hogy kitűnjön.

mielőtt kétségbeesetten dobja fel a kezét, hadd mutassam meg egy egyszerű módszert a téma fűszerezésére túl sok erőfeszítés nélkül, anélkül, hogy felesleges képeket adna hozzá, amelyek lelassíthatják webhelyét.

írja be a Dashiconokat. A Dashicons betűtípus-ikonok, amelyeket a WordPress 3.8-ban vezettek be. Ezek azok a félelmetes és hűvös ikonok látsz, amikor bejelentkezik a műszerfalon. Nem lenne jó, ha hozzá tudná adni őket a témához is?

Nos, tudod, és meg fogom mutatni, hogyan.

hogyan használhatja a Dashiconokat a navigációs menüben?

kezdjük egy egyszerű példával. A dashiconok már a 3.8-as verzió óta szerepelnek a WordPress-ben, de még mindig be kell vonnia őket, hogy megfelelően megjelenjenek a webhely elején; vagyis a témád.

1. lépés: hogy a téma Dashicons kész

hogy a téma Dashicons kész először nyissa meg a funkciókat.php fájl (megjelenés>szerkesztő – alapértelmezés szerint megnyitja az aktuális téma CSS fájlját. Keresse meg a funkciókat.php fájlt, majd kattintson rá, hogy betöltse a szerkesztő.)

2. lépés: Enqueue a script

görgessen végig az aljára, és illessze be ezeket a kódsorokat a végére:

rendben! Most a téma készen áll a Dashicons használatára.

3. lépés: Dashiconok hozzáadása a menüpontokhoz

adjunk hozzá egy Dashicont az otthoni linkhez. Menjen át a Dashicons weboldalára, és válassza ki a kívánt ikont.

frissítés: a Dashicons eredetileg elérhető volt GitHub.io, de azóta elérhetővé tették őket WordPress.org.

4. lépés:

kattintson a kívánt ikonra (ebben az esetben a Kezdőlap ikont választottam), majd kattintson a HTML másolása elemre. Ez ad egy felugró ablakot a szükséges kóddal.

5.lépés:

menjen vissza a WordPress irányítópultjára, kattintson a megjelenés >

> menük és illessze be a kódot, ahol azt mondja navigációs címke.

Ha továbbra is szeretné, hogy a szó megjelenjen, írja be a záró div zárójel után.

kattintson a Mentés gombra, és töltse be a kezdőlapot. Az otthoni linknek most egy szép, éles Dashicont kell megjelenítenie.

ezt megteheti az összes navigációs menüpontnál, vagy csak otthon. Csak ismételje meg a fenti lépéseket a megfelelő ikonokkal. Ez könnyű volt, igaz?

hogyan használja a Dashiconokat a post meta-ban?

egy lépéssel tovább léphet, és hozzáadhatja a Dashiconokat a bejegyzés metájához, vagy más szóval hozzáadhatja a dashiconokat a szerző neve, dátuma, kategóriája vagy címkéje előtt; a témától és a megjelenített információtól függően.

mivel már enqueued Dashicons a téma, csak annyit kell tennie, most nyissa meg a stílust.css fájl (vagy használjon egyedi CSS szerkesztőt, amely mindig jobb lehetőség, így nem veszíti el a változásokat, ha a téma frissül!), keresse meg a megfelelő választót, és adja hozzá a CSS kódot.

tegyük fel, hogy hozzá szeretne adni egy ikont a neve vagy a szerző neve elé.

1. lépés:

először kiválasztunk egy ikont, amelyet szeretnénk.

2. lépés:

Ezután kattintson rá, és ezúttal válassza a CSS másolása lehetőséget. Ismét egy felugró ablakot ad a beillesztendő kóddal.

3.lépés:

most nyissa meg a stílusát.keresse meg a megfelelő választót, ebben az esetben – .bejegyzés-szerző. Hozzáadásával: a DASHICONS webhelyről másolt CSS-kód előtt, majd beillesztésével a szerző neve előtt egy szép ikon lesz. Azt is meg kell adnia, hogy a Dashicons betűtípust használja. A módosított kód így néz ki:

.entry-author:before {font-family: "dashicons";content: "\f110";}

adjunk hozzá egy kis stílust is, és most a befejezett kód így néz ki:

A végeredmény

szóval hogyan fog ez kinézni a végén?

valami ilyesmi:

olyan sokféle módon használhatja a Dashiconokat – hagyja, hogy a kreativitása megragadjon, és nézze meg, mit tehet.

mindent összerakva

a fenti példákon kívül a Dashicons segítségével különböző ikonokat adhat meg a különböző bejegyzéstípusokhoz, vagy használhatja őket a bejegyzés címeiben, a widget címeiben, vagy ha egyéni céloldalt hoz létre, akkor megkülönböztetheti a webhely különböző oldalait.

jó példa erre a régi WP Superstars honlap. Itt láthatja a weboldal különböző területein használt Dashiconokat:

a Dashicons nem az egyetlen ikon betűtípus, amelyet hozzáadhat. Nézze meg a FontAwesome ikonok bemutató több.