Hogyan adjunk a saját kütyü a konzolra wordpress oldal szól wordpress

Maga az ötlet, hogy a WordPress konzol nem túl hatékony? Ma megpróbálunk változtatni. Természetesen vannak különböző plug-inek, hogy hozzá saját modulok a konzol, de továbbra is a különböző mutatók és címkék felveheti a saját. Ebben a cikkben megmutatom, hogyan tudod hozzáadni a saját - teljesen testreszabható - konzol kütyü.

Basic konzol modul

Anatomy konzol kütyü nagyon egyszerű. Először is, meg kell használni wp_add_dashboard_widget () függvény regisztrálni a widget a WordPress. Ezután létrehoz egy függvényt, amely kezeli a tartalom kimenet. Itt látható a sablon kódját, amelyek segítségével gyorsan létrehozta a modult:

Megjegyzendő, hogy ezt a kódot kell elhelyezni a plugin. Ha azt szeretnénk, hogy gyorsan kipróbálni, akkor is hozzá kódot a functions.php iratai a témát.

Az első lépés - ez podtseplenie funkciót wp_dashboard_setup. Az üzenet tartalma a funkció - egy egyszerű felhívás wp_add_dashboard_widget () három paraméter:

  • csiga modul
  • Headline modul
  • O funkció

A második lépés - létrehozása O funkciók my_dashboard_widget_display (), és feltölteni azt tartalommal.

Következtetés hirdetések a tetején a konzol

Bizonyos esetekben szükség lehet, hogy fontos információkat és a funkcionalitás a tetején a konzol. WordPress-nek nincs jó API a művelet elvégzésére, azonban bizonyos erőfeszítéseket, akkor végre kell hajtani. Mi kell hozzá kiegészítő kód a regisztrációs funkció. Itt van a teljes kód tesztünk widget:

Hét további sorok a rekonstrukció egyszerű konzol - nagyon sok, de a többi módszer nem. Az első lépésben meg kell csinálni egy globális változó $ wp_meta_boxes, amely információkat tartalmaz az összes regisztrált kütyü. Egyszerűsítése érdekében a megértése a kódot, tettem hozzá widgeteket, hogy megjelenik a konzol változót $ műszerfalon.

A következő lépésben már regisztrált widget tömb kütyü. Ez tárolja a változó $ my_widget, mert szükségünk lesz, hogy távolítsa el a tömböt, majd össze a tömb újra.

A következő lépésben kombináljuk tartalom és $ my_widget $ műszerfalon. array_merge () funkció egy második tömbben az első, így a modul már az első egy új tömböt $ sorted_dashboard. Az utolsó lépésben megváltoztatjuk az eredeti tömb egy új konzol rendezve tömb.

További funkciók hozzáadása

Hogyan adjunk a saját kütyü a konzolra wordpress oldal szól wordpress

HTML struktúra

Hoztunk létre a fenti példa segítségével csak CSS, JS nélkül. Ahhoz, hogy ezt elérjük, az alábbi HTML struktúra:

Stílusú widget segítségével CSS-fájlt, és néhány beépített stílusok, hogy vigyázni fog a magasság és szélesség.

Styling oszlopok

A magassága a teljes tartály (.comment-STAT-bar) van rögzítve - 120 pixel. Oszlopok a magassága is tartalmaznak 120 pixel. Különböző magasságú oszlop hozzáadásával érjük el keretek (határ) különböző magasságú. Így tudjuk garantálni, hogy az oszlopok indul az alsó, és a túlfolyó: rejtett a tartályba, akkor elrejti a felesleges.

A stíluslap hozzáadjuk a szokásos módon, a alternatív kapcsolaton:

Felhívjuk figyelmét, hogy ellenőrizze a változó $ horog, hogy megbizonyosodjon arról, hogy a stílusok használata csak a konzol oldalt, mert nincs rájuk szükség máshol. Ha hozzá kódot a fájlban functions.php téma, akkor kell használni get_template_directory_uri () helyett plugins_uri ().

Tartalom stíluslap leereszkedik. A más stílusú integrált:

A számítás a magassága

A stíluslap adtunk mező (árrés) 1% mindkét oldalán az oszlop. Ez azt jelenti, hogy minden egyes oszlop, amely már, van 2% -kal kevesebb helyet felosztható az oszlopok között. Így, ha az általunk használt 100% a teljes szélességnek, tudjuk testre a százalékos szélességét az egyes oszlop:

Most megy a tetejére. Az oszlopot a legmagasabb érték a magasság mindig töltik ki az egész magassága a tartály. A példánkban a harmadik oszlop (amelynek értéke 40) a legnagyobb érték, így ez lesz a legnagyobb magassága 120 képpont. Minden következő oszlop, ami kisebb lesz az értéke, akkor adjuk hozzá a felső széle (felső margó).

Pontosan hogyan felső szélén, ez függ az arány a méretét az oszlopok és a legnagyobb oszlop a készlet. Példánkban az első oszlop - ami pontosan fele akkora a harmadik oszlop. Ezért kell, hogy felső határt 60 képpont, pontosan a fele a 120 képpont. Íme a kód nézne:

Bemutatás statikus grafikus

Ha összevetjük az összes kódot együtt, akkor egy kényelmes bar chart, annak ellenére, hogy a számok benne kódolt. Lássuk:

következtetés

Widgets konzol lehetővé teszi számunkra, hogy egyszerűbbé életét maguk és a szakmai személyzet a helyszínen. Amellett, hogy a statikus tartalom, akkor „fűszer” dolgokat CSS és további funkciókat használja JS.

Mellett egyre adatainak WordPress, akkor is úgy egy harmadik fél API adatokat. Tudod kap statisztikát MailChimp, a Google Analytics, Twitter, stb

Kapcsolódó cikkek