Share
Så uppfriskande som den nya WordPress instrumentbrädan är inte alla nöjda med några av förändringarna. Jag älskar personligen den nya minimalistiska stilen.
Det var bara en sak som jag verkligen saknar: Den vänstra navigeringen saknade sin visuella separering av olika WordPress-områden.
I det här snabba tipset ska jag visa dig hur du inspekterar backend-CSS och ta separatorerna tillbaka med några få rader kod.
De separatorer som vi ska försöka återställa är inte faktiskt borta - de är bara transparenta. Högerklicka i det tomma området mellan kommentarer och Utseende och inspektera detta element.
Du ska se den renderade HTML-filen. Menyerna är ul-element med li-element för varje menyobjekt.
Öppna ul roll = "navigering". Du ser alla menyalternativ i li-element inslagna, men du kommer också att se en li mellan. När du klickar på det kan du se stilar och märka CSS för det här objektet.
#adminmenu li.wp-menyseparator bakgrund: transparent; kantfärg: transparent;
Det är vår separator stil. Specifikt är det det vi behöver ändra.
Nu ska vi skriva en funktion för att ansluta våra egna CSS-stilar till WordPress Backend.
Lägg till den här koden i dina teman functions.php fil.
Accentsconagua
funktion tutsplus_separators () add_action ('admin_head', 'tutsplus_separators'); Den första delen definierar funktionen och add_action-kroken lägger till den i WordPress-panelen. I mitten lägger vi nu till ett eko för att lägga in vår egen CSS-kod.
funktion tutsplus_separators () echo ''; add_action ("admin_head", "tutsplus_separators"); Om du laddar om dina sidor kommer dina separatorer att vara i färgen # 444 - grå. Jag bytte också skillnaden mellan separatorn eftersom det behövde någon justering enligt min mening.
Om du är en perfektionist, kommer du att märka att den här färgen bara passar för standard svart och blått adminstyp av WordPress. Låt oss ta en titt på hur vi kan täcka alla nya färgscheman.
De kropp-tagg av WordPress har många praktiska klasser för att identifiera olika användningsområden. Om du tittar närmare tittar du också på en klass för färgschemat. Standarden heter admin-färg färska.
Försök ändra din stil i "Användare"> "Din profil" och se hur klassen ändras. Med denna klass tillgänglig kan vi ge varje färgstil en egen separatorfärg. Lägg bara till klassnamnet framför din css-kod så här .admin-color-fresh #adminmenu li.wp-menyseparator bakgrund: # 444;
Här är koden nu med alla färgstilar för matchande separatorer:
funktion tutsplus_separators () echo ''; add_action ("admin_head", "tutsplus_separators"); Om du vill ha separatorlinjer mellan varje menyalternativ försök att justera menyns toppklassli-saker lite med border-botten och border-top.
Jag gjorde det här lilla koden i ett plugin för att helt enkelt lägga till det snabbt på några av mina installationer. Om du vill kan du hämta det från WordPress Plugin Directory.
