10 lépés a professzionális megjelenésű WordPress Admin létrehozásához
Akár a WordPress webhelyeket az ügyfelek számára készít, akár saját szerzői blogja van, vagy csak személyre szabottabb keresést szeretne a webhelyére, sok esetben érdemes lehet változtassa meg a WordPress admin panel és a bejelentkezési oldal tervezését. Biztosan telepíthet egy előre elkészített admin téma bővítményt, de mi van, ha nagyobb szabadságot szeretne?
Branding a WordPress admin nem csak a tervezés, ez lehet a intelligens módja az önfejlesztésnek is. Ebben a hozzászólásban megnézzük, hogyan lehet testre szabni a WordPress műszerfalát és a bejelentkezési oldalt, hozzáadni saját logóját, eltávolítani vagy megváltoztatni a menüelemeket, eltávolítani a WordPress.org-ra mutató hivatkozásokat, és finomítani kell a többi adminisztrátori beállítást a az AG Custom Admin Panel plugin segítségével.
1. Telepítse az AG egyéni adminisztrátori bővítményt
Először navigáljon a Bővítmények> Új hozzáadása admin menüpont a WordPress műszerfalán, keresse meg a AG Adminisztrátor bővítmény, telepítse és aktiválja. A bővítmény új almenüt hív meg AG Adminisztrátor benne Eszközök menüpontot, és egy gombot a felső Admin Barra, hogy gyorsan elérhesse a beállításokat.
2. Általános beállítások
Az első lapon beállíthatja az Általános beállításokat. A plugin egyik nagyszerű dolog az, hogy ha a kurzort az opciócímkék fölé helyezi, egy kis eszköztipp jelenik meg, amelyben többet olvashat az adott opcióról.
Az Általános beállítások első opciója a “Az AGCA-adminisztrátor kizárása a testreszabásokból” hol lehet gyorsan kapcsolja be és ki az adminisztrátori felhasználók testreszabását. Ez hasznos lehet, ha azt szeretné, hogy az adminisztrátori szerepkörrel rendelkező felhasználók láthassák az alapértelmezett WordPress műszerfal.
A következő két beállítás elrejteni vagy felfedni “Képernyő beállítások” és a “Segítség” menü minden admin oldal jobb felső sarkában található (lásd alább). Túl sok választás zavarhatja a kevésbé fejlett felhasználókat, így jó ötlet, hogy megszabaduljon a két lehetőség közül.
Az általános beállítások lehetővé teszik a WordPress képesség kiválasztását is, amely a felhasználók számára hozzáférést biztosít a bővítmény beállításaihoz.
3. Az Admin Bar elrejtése vagy testreszabása
A Adminisztrátori beállítások fül segít elrejteni vagy testre szabni az admin sávot, a vízszintes menüt a tetején. Teljesen elrejtheti azt az admin panelről, és csak egy stílusos kijelentkezési gombot mutat a jobb felső sarokban.
Más esetekben egyszerűen leegyszerűsítheti az admin sávot a kevésbé fontos elemek eltávolításával. Az Admin Bar beállítások sok lehetőséget kínálnak elrejti az egyes részeket egyenként, testreszabhatja a blog fejlécét, adja hozzá saját logóját az alapértelmezett WordPress logó helyett vagy teljesen távolítsd el.
Az alábbi képernyőképen módosítottam a blog címét “Válts nézőpontot” jelzi, hogy ez az a hely, ahol a frontend és a backend között válthatnak.
Teljesen eltávolítottam a WordPress logót, de nem helyettesítettem a Hongkiat logóval, mert inkább hozzáadom ezt a függőleges admin menühöz (7. lépés). A következő lépésről folytatom a teljesen eltávolított admin sávot.
4. Márka a lábléc
Ban,-ben Admin lábléc lapon vagy teljesen eltávolíthatja a láblécet az admin panel alján, vagy módosíthatja a szöveget a kívánt helyre. Jó ötlet lehet helyezzen el egy linket a vállalkozás kezdőlapjára, így ügyfelei gyorsan kapcsolatba léphetnek veled, ha valamilyen támogatást igényelnek.
5. Tisztítsa meg a műszerfalat
A Dashboard oldal beállításai lehetővé teszi az adminisztrációs panel kezdőlapjának módosítását. Ez a képernyő a műszerfal widgetekkel, mint például a “Ránézésre” és “WordPress News” ha először jelentkezik, amikor bejelentkezik adminisztrátorként.
Az első beállításban módosítsa a címsor szövegét a szóból “Irányítópult” saját márkanévre, és hozzáadhatja az egyéni tartalmát is.
Ez biztosan segíthet a felhasználóknak, ha Ön helyezz egy “Több információ” a cím alatt található link (ahogy azt az alábbi képernyőképen tettem). Így könnyen elérhetik Önt. Egy gyors “Üdvözöljük adminisztrációs területen” az intro hasznos lehet.
Az AG Custom Admin bővítmény is lehetővé teszi elrejti a műszerfal-widgeteket egyenként. Én csak kettőt hagyok, hogy a márkás adminisztrátort nehezebbé tegyem. Ha elrejti a widgeteket itt nem lesznek elérhetők a felhasználók számára “Képernyő beállítások” menü.
A testreszabott WordPress műszerfal mostanra úgy néz ki, mintha a WordPress.org-ra való utalás eltűnt volna, és tisztábbnak és egyszerűbbnek tűnik.
6. Add hozzá a logót a bejelentkezési oldalhoz
A Bejelentkezés oldal beállításai engedje meg testre szabhatja a bejelentkezési oldalt helyére, cserélje ki a WordPress logót saját grafikájával, és elrejtse vagy felfedi a “Vissza a bloghoz”, “Regisztráció”, és “Elfelejtett jelszó” linkek.
Az alábbi képernyőképen láthatjuk, hogy a logó megváltoztatása és a link mögött a saját webhelyére való hivatkozás testreszabott megjelenést adhat a bejelentkezési oldalon, és biztosan segíthet a márka népszerűsítésében.
7. Módosítsa a bal oldali Admin menüt
Az adminisztrátori menü az admin panel bal oldalán található. Sok elemet és még több elemet tartalmaz, amelyek közül sokan nem rendelkeznek a leginkább magyarázó címkével. Ez a tanulási görbe meredekebbé teheti a nem technológiai emberek számára.
A Adminisztrátori beállítások segít gyorsan megtisztítani az admin menüt. Ha akarja, eltávolíthatja a teljes admin menüpontot, de valószínűleg jobb, ha csak elrejti azokat az elemeket, amelyekre a felhasználóknak nincs szüksége.
Nem csak a felső menüpontokat láthatod láthatatlanná, hanem az almenüket is; csak kattintson a felső szintű menüre, és megjelenik egy praktikus legördülő lista. Sőt, te is átnevezheti a címkéket valamire, amit könnyebb megérteni a laikusok számára, éppúgy, mint én “Irányítópult”, “Média”, és “Megjelenés” címkék alatt.
Te is módosítsa az admin menü alaptervezését ha akarod. Elrejtheti az ikonok, a menüelem-elválasztók, az almenü nyíl és a “Collapse menü” gomb, adja hozzá az almenük határát, és helyezze el saját logóját az admin menü tetején.
Én magam is hozzáadtam egy Hongkiat logót az admin menühöz, amely mögött egy link található a hongkiat.com honlapjára, amely világosan jelzi az egész admin panelet, de nem tolakodó módon.
Átneveztem 3 menüpontot (az újok “Admin”, “képek”, és “Tervezés”), eltávolította a “Csatlakoztat” menüpontot, és 10px sugárral egészítette ki az almenü felugró ablakainak sarkait.
A következőképpen néz ki:
8. Színezzük az Admin-t
A Colorizer A fül lehetővé teszi, hogy a WordPress adminisztrátort fel tudja tölteni a fő elemek szövegének és háttérszínének megváltoztatása. A színező funkció valósidejű, így ha új színt vesz fel, egyszerre láthatja a változást a beállítások mentése nélkül.
Itt csak az alapértelmezett háttérszínt módosítottam világoskékre, így most megegyezik a Hongkiat logó királyi kékével, de ha akarod, megváltoztathatod más dolgokat. Valószínűleg jó ötlet, hogy a színekkel egy kicsit játsszon, hogy lássa, mi a legjobb, hol.
Nemcsak az admin panel színeit, hanem a bejelentkezési oldal színét is megváltoztathatja.
9. Adja meg az egyéni kódot
Ha Ön tapasztalt front-end fejlesztő, akkor adjunk hozzá egyéni CSS és JavaScript kódot az adminisztrációs területhez is. A böngésző fejlesztői eszközeivel könnyedén megragadhatja a módosítani kívánt elem CSS-választóját.
Ebben a lépésben a következő kódrészlet segítségével kicsit szélesebb körben teszem a bejelentkezési oldal paneljét:
#login szélesség: 480px; max. szélesség: 90%; margin: 0 auto;
Mint látható, a bejelentkezési panel szélesebb körűvé vált, de még mindig érzékeny a max-width szabály. Valószínűleg ez a változás jobb élményt nyújt a legtöbb felhasználó számára. Az egyéni kódot akár egy .Agca fájlba, és később importálja azt más WordPress webhelyekre.
10. Telepítsen egy előkészített adminisztrációs témát
Az utolsó lap neve Adminisztrátori témák lehetővé teszi egy előre elkészített admin téma telepítését a beállítások tetején. Ha így tesz, akkor elveszíti a Colorizer lapon beállított egyéni színeket, de továbbra is megtarthatja más beállításokat.
A legtöbb adminisztrátori téma itt nem ingyenes (itt 10 WordPress admin témát találunk), de a vásárlások nagyszerű módja lehet ennek a félelmetes bővítménynek a szerzőinek támogatására..
