Sådan tilpasses dit WordPress Admin Dashboard

Sådan tilpasses dit WordPress Admin Dashboard

Brugerdefinerede biler. De vil tage dig fra punkt A til B ligesom enhver anden bil. De er lavet af de samme materialer og brænder gallons af gas ligesom ethvert andet motorkøretøj. Alligevel har vi (eller i det mindste bilelskere blandt os) en dyb kærlighed til den skræddersyede bil. Hvorfor?


  • De ser bedre ud end deres kolleger lige fra samlebåndet
  • De er optimeret til bedre ydelse

WordPress er en af ​​de største køretøjer, du kan bruge til at nå dine online drømme. Det leveres med et fantastisk instrumentbræt, og ud af boksen vil WordPress hjælpe dig og / eller dine klienter med at opbygge fantastiske websteder på kort tid.

Men WordPress admin-betjeningspanelet er for “mainstream” til at føle og se ud. Jeg mener, at selvom det er smukt, affyrer det ikke nøjagtigt personlig stil. Det er en smule generisk og vil sandsynligvis ikke imponere en klient, der har brugt platformen før. Heck, det vil ikke imponere en klient, der værdsætter personlig styling eller en lignende lighed med branding.

På den anden side er brugerdefinerede WordPress-dashboards personlige og giver dine kunder den ekstra feel good-faktor, der holder dem længsel efter mere. Du kan opbygge dit brand eller indstille WordPress-betjeningspanelet til dine kunders behov og give dig et godt produkt, der kommer i fantastisk emballage – din egen brugerdefinerede emballage. I dagens indlæg vil vi:

  • Fjern unødvendige widgets og menuer for at skabe et renere og lettere brugerdefineret instrumentbræt
  • Tilpas linket til instrumentpanelets sidefod
  • Slip af med generiske elementer som WordPress-logoet
  • Tryk på skærmindstillinger
  • Tryk på et par plugins, du kan bruge til at tilpasse dit dashboard

I slutningen af ​​dette indlæg skal du være i stand til at oprette smukke og personlige WordPress admin-dashboards, der giver en klang på dine klienter eller styrker din online brand-tilstedeværelse. Nyd til slutningen og wow os med dine tanker i kommentarafsnittet nedenfor!

Vente! Opret et barn-tema, før vi starter

Du kan redigere dine kerne-temafiler eller bruge Editoren under Udseende i dit temadashboard, men det ville betyde, at du aldrig opdaterer dit WordPress-tema igen. Inden du foretager ændringer i temafiler, skal du gøre det oprette et barn tema. På denne måde, når du opdaterer kernetemaet, forbliver alle dine ændringer i takt. Her er nogle hurtige trin for at få dig klar til netop denne tutorial, men vi har også en komplet guide til oprettelse af temaer til børn, eller du kan henvise til WordPress codex for mere hjælp.

  1. Opret din barnemapmappe: Log ind på din WordPress-installation og find wp-content / temaer / yourthemename folder. Inden for denne mappe skal du tilføje en ny mappe og navngive det “barn-tema” eller “dit navneord-barn” (du får idéen).
  2. Opret dit barnes tema’s CSS-fil: Nu hvor du har en ny mappe med underordnet tema, kan du tilføje nye filer til at justere eller tilsidesætte stilen og funktionen for dit nuværende tema. Opret først en ny style.css-fil i din underordnede mappe, rediger derefter den nye fil for at tilføje nogle grundlæggende overskriftsinfo (bare så du eller efterfølgende udviklere ved, hvad der foregår):
    / *---------------------------------------------------
    Tema Navn: Dit barn Tema-mappenavn her
    Beskrivelse: Børnetema for Forældertema Navn her
    Forfatter: Dit navn her
    Skabelon: Navn på overordnet tema her
    ----------------------------------------------------* /

    Efter overskriften kan du tilføje alle dine fantastiske CSS for at ændre udseendet på dit overordnede tema ved hjælp af dit barn-tema.

  3. Opret dit barn-temas PHP-fil: Inden i din nye mappe med underordnet tema skal du oprette en features.php-fil. Rediger derefter den nye funktionsfil for at tilføje kode, der indlæser dit originale “overordnede” -tema’s styling:

    Bare sørg for at tilføje dine function.php-justeringer efter det sidst åbne PHP-tag.

Du kan selvfølgelig tilføje meget mere til dit barnetema for at foretage ændringer i skabeloner til din header, sidefod eller noget andet virkelig. Men med henblik på denne tutorial er du klar! Så her går vi …

Fjernelse af unødvendige WordPress Dashboard-widgets

Når du logger ind på dit WordPress-dashboard, vil du bemærke et par sektioner (widgets) som f.eks Ved første øjekast, Webstedsstatistikker, Hurtigt udkast, og WordPress Nyheder blandt andre. De fleste af disse dashboard-widgets tilføjes af WordPress, men antallet af viste widgets kan stige eller ned afhængigt af dit tema og / eller plugins. Nogle temaer og plugins føjer deres egne widgets til dashboardet.

Mens nogle af disse widgets er nyttige, er dine klienter nødt til at se dem? Skal du se hver af disse widgets, hver gang du logger ind? Måske var du nødt til at slå op med widgets, fordi du ikke havde nogen måde at slippe af med dem. I dag er din heldige dag. Du kan nemt fjerne så mange dashboard-widgets, som du ønsker ved hjælp af et par kodelinjer:

// Fjern instrumentpanelet
funktion remove_dashboard_meta () {
if (! current_user_can ('manage_options')) {
remove_meta_box ('dashboard_incoming_links', 'dashboard', 'normal');
remove_meta_box ('dashboard_plugins', 'dashboard', 'normal');
remove_meta_box ('dashboard_primary', 'dashboard', 'normal');
remove_meta_box ('dashboard_secondary', 'dashboard', 'normal');
remove_meta_box ('dashboard_quick_press', 'dashboard', 'side');
remove_meta_box ('dashboard_recent_drafts', 'dashboard', 'side');
remove_meta_box ('dashboard_recent_comments', 'dashboard', 'normal');
remove_meta_box ('dashboard_right_now', 'dashboard', 'normal');
remove_meta_box ('dashboard_aktivitet', 'dashboard', 'normal');
}
}
add_action ('admin_init', 'remove_dashboard_meta'); 

Kopiering af ovenstående kode i dit barntema’s features.php-fil (findes på wp-content / temaer / yourthemename / barn-tema / functions.php) og at gemme ændringerne vil eliminere alle dashboard-widgets med undtagelse af dem, der er tilføjet af dit tema eller plugins. Fra koden ovenfor er alle brugere med mindre end admin kapaciteter ser ikke widgets takket være denne del af koden:

if (! current_user_can ('management_options'))

… som kontrollerer, om brugeren kun har (‘management_options’) kapacitet, der kun er tilgængelig for administratorer. Måske vil du ikke slippe af med dit instrumentbræt for alle widgets. Du kan i stedet bruge følgende kode:

// Opret den funktion, der skal bruges i handlingskrog
funktion wpexplorer_remove_dashboard_widget () {
remove_meta_box ('dashboard_quick_press', 'dashboard', 'side');
}
add_action ('wp_dashboard_setup', 'wpexplorer_remove_dashboard_widget');

Kopier ovenstående kode til din features.php-fil, og gem ændringer for at slippe af med Hurtigt udkast widget. For at fjerne enhver anden widget skal du blot udskifte ‘Dashboard_quick_press’, ‘dashboard’, ‘side’ med tilsvarende snegle for hver widget. Andre standard widget-slugs inkluderer:

  • dashboard_incoming_links
  • dashboard_plugins
  • dashboard_primary
  • dashboard_secondary
  • dashboard_quick_press
  • dashboard_recent_drafts
  • dashboard_recent_comments
  • dashboard_right_now
  • dashboard_activity

Men du har måske tilføjet yderligere widgets efter dit overordnede tema, andre plugins, du har installeret eller endda dit hosting (WP Engine tilføjer en kaldet wpe_dify_news_feed). For at finde slug til disse tilføjede widgets skal du bruge en browserinspektør (vi kan godt lide den i Chrome – det er en del af deres standard webudviklerværktøjer, så alt hvad du skal gøre er at højreklikke på et element og vælge “inspicere”) og derefter kopiere div ID for den widget, du vil fjerne.

Tilføjelse af WordPress Dashboard Widgets

Nu hvor du kan eliminere dashboard-widgets, som du synes, lad os prøve at tilføje vores egne brugerdefinerede widgets. Du kan vise hvad du vil med din widget, så intet er at holde dig tilbage fra at oprette det brugerdefinerede betjeningspanel til dine drømme. Det bedste er, at det er nemt at tilføje en widget til dit WordPress-dashboard med superduper. Bare tilføj følgende kode til din wp-content / temaer / yourthemename / barn-tema / functions.php fil:

/ **
* Føj en widget til instrumentbrættet.
*
* Denne funktion er koblet til 'wp_dashboard_setup' -handlingen nedenfor.
* /
funktion wpexplorer_add_dashboard_widgets () {
wp_add_dashboard_widget (
'wpexplorer_dashboard_widget', // Widget-slug.
'My Custom Dashboard Widget', // Titel.
'wpexplorer_dashboard_widget_function' // Displayfunktion.
);
}
add_action ('wp_dashboard_setup', 'wpexplorer_add_dashboard_widgets');

/ **
* Opret funktionen til at sende indholdet af din Dashboard-widget.
* /
funktion wpexplorer_dashboard_widget_function () {
ekko "Hej der, jeg er en fantastisk Dashboard-widget. Rediger mig!";
}

Gem ændringer. Selvfølgelig kan du redigere plugin, så det passer til dine behov. Læg din HTML, PHP eller hvad du end har:

ekko "Hej der, jeg er en stor dashboard-widget. Rediger mig!";

Din nye tilpassede widget vises i den absolutte bund – under alle widgets – som muligvis er uden for visningen, hvis du har mange widgets. Du kan dog trække og slippe widgeten øverst (eller hvor som helst andet sted for den sags skyld).

Tilpasset WordPress Dashboard-side

Lad os sige, at du er interesseret i at oprette et helt andet dashboard. En, der leveres med din egen tilpassede HTML, PHP og endda styling. Hvis du vil gå ud over bare at tilføje / fjerne dashboard-widgets, skal du tjekke Sådan opretter du en WordPress brugerdefineret betjeningsside af Remi Corson.

Han har bygget et fantastisk plugin, der kan hjælpe dig med at fremskynde oprettelsen af ​​din egen side om brugerdefineret dashboard (custom-dashboard.php). Du skal gøre brug af dine PHP-udviklingsevner for at gaffel plugin, der passer til dine specifikke behov. Alt i alt prøvede jeg Sweet Custom Dashboard og det er fantastisk. Dit tilpassede betjeningspanel kan være en installation væk :). Vil du tilpasse din velkomstbesked, tjek vores indlæg om Tilpasning af din WordPress Dashboard velkomstbesked.

Fjernelse af WordPress Dashboard-menuer

Vi kan tilføje eller eliminere WordPress-dashboardwidgets og endda ændre, hvordan dashboardet ser helt ud (takket være Remi). Lad os nu gå videre til næste del: fjerne uønskede menupunkter.

Hvorfor? Du vil fjerne nogle menuer for at give klienter et slankere betjeningspanel og forhindre dem i at få adgang til “begrænsede” områder. Hvis en klient ikke kender deres vej rundt WordPress, kan de muligvis ende med at bryde webstedet, hvis de besøger og ændrer indstillinger på sider som Indstillinger eller Plugins. Føj følgende kode til din features.php-fil:

funktion wpexplorer_remove_menus () {
remove_menu_page ('temaer.php'); // Udseende
remove_menu_page ('plugins.php'); // Plugins
remove_menu_page ('brugere.php'); // Brugere
remove_menu_page ('tools.php'); // Værktøjer
remove_menu_page ('option-general.php'); // Indstillinger
}
add_action ('admin_menu', 'wpexplorer_remove_menus');

Ovenstående kode fjerner menuelinkene til Indstillinger, plugins, udseende, brugere og værktøjer for alle brugere. Du kan også fjerne undermenuer. Her er eksemplekoden, der fjerner undermenuen Widgets under Udseende:

funktion wpexplorer_adjust_the_wp_menu () {
$ page = remove_submenu_page ('temas.php', 'widgets.php');
}
add_action ('admin_menu', 'wpexplorer_adjust_the_wp_menu', 999);

I eksemplet ovenfor får brugerne adgang til alle undermenuer under Udseende undtagen Widgets. Du kan fjerne så mange menuer eller undermenuer, som du ønsker. Husk bare, at dette ikke forhindrer brugere i at få adgang til disse sider direkte. Jeg mener, hvis en bruger indtaster, f.eks. Yourdomain.com/wp-admin/options-general.php, vil de få adgang til siden Indstillinger. God ting, de fleste brugere gider ikke, hvis varen ikke er i menuen.

Hvis du ikke kan eller ikke ønsker at redigere din features.php-fil, kan du altid installere Admin Menu Editor plugin, hvilket giver dig fuld kontrol over dine menuer. Det leveres med et par seje funktioner inklusive rollebaserede menubegrænsninger, evnen til at skjule menuer og oprette brugerdefinerede menupunkter blandt andre seje funktioner.

Tilpasning af WordPress Dashboard Footer

I øjeblikket har vi foretaget “betydelig” tilpasning til dit WordPress admin-dashboard. Det er kun rigtigt at tage æren for alt det strålende arbejde, du laver. Tilpasning af sidefoden (“Tak, fordi du oprettede med WordPress.”) Kan yderligere hjælpe med at styrke dit (eller klientens) brand. Lad os ændre din sidefod til “Bygget med kærlighed ved dit navn.” Bare tilføj følgende kodestykke til din features.php-fil og gem ændringer:

// Brugerfod for tilpasset administrator
funktion wpexplorer_remove_footer_admin () {
ekko 'Bygget med kærlighed af WPExplorer';
}
add_filter ('admin_footer_text', 'wpexplorer_remove_footer_admin');

Erstat ‘Dit navn’ med dit navn, websted, e-mail-adresse osv. Og dit domæne.com med dit faktiske domænenavn. Komme videre…

Tilpasning af loginformularen

Indtil videre har du alt, hvad det kræver for at tilpasse dit WordPress admin dashboard. Lad os gå et skridt videre og tilpasse login-siden, så dine brugere kan få en virkelig personlig oplevelse fra start. Når alt kommer til alt, hvorfor gider at tilpasse dit WordPress-dashboard kun for at blive givet væk fra login-siden?

Med denne side er vi nødt til at tilpasse to elementer: standard WordPress-logoet og wordpress.org-linket, der følger med det. Men før jeg viser dig koden ��, kan du nemt tilpasse din login-side ved hjælp af en af ​​disse 15 bedste tilpassede login-plugins til WordPress. Nu, for den varme fuzzy følelse, der kommer fra at lege med koden, skal du kopiere følgende til dine funktioner.php:

funktion wpexplorer_login_logo () {?>

Udskift logo.png med dit brugerdefinerede logo filnavn, som du først skal uploade til wp-content / temaer / yourtheme / billeder. Hold dit brugerdefinerede logo under 80 x 80 pixels, selvom du kan ændre dette med nogle brugerdefinerede CSS. Med det tilpassede login-logo på plads er det tid til at ændre det link, der følger med det originale WordPress-logo. Lad os linke dit nye logo til dit websted. Kopier denne kode til din features.php-fil, og gem ændringer:

funktion wpexplorer_login_logo_url () {
returnere esc_url (home_url ('/'));
}
add_filter ('login_headerurl', 'wpexplorer_login_logo_url');

funktion wpexplorer_login_logo_url_title () {
returner 'Dit websted navn og info';
}
add_filter ('login_headertitle', 'wpexplorer_login_logo_url_title');

Husk at du altid kan stil din login-side som du ønsker ved hjælp af CSS. Eller du kan bare starte med et fantastisk tema som det samlede multifunktions- og responsive WordPress-tema, som kommer med indbyggede muligheder for en brugerdefineret login-side og branding af websteder.

Tilpas WordPress Dashboard: Skærmindstillinger

Hvis du ikke ønsker at dykke ned i kode eller installere plugins, kan du drage fordel af skærmindstillinger til at oprette et tilpasset WordPress-dashboard. Bare log ind på dit WordPress-instrumentbord og øverst på skærmen til højre vil du se en rullemenu med skærmindstillinger. Klik på dette for at udvide og markere / fjerne markeringen for at aktivere / deaktivere widgets. Du kan derefter trække og slippe dine widgets for at arrangere dem, som du ønsker.

Den eneste ulempe er, at denne metode gemmer dine indstillinger pr. Bruger, hvilket betyder, at det ikke gør dig meget godt, hvis du har en blog med flere forfattere. Du kan heller ikke forhindre brugere i at genaktivere widgets efter behov.

Bonus: Brug et plugin

Vi har brugt størstedelen af ​​vores tid på at dække kodeindstillinger. Men hvis du er klemt i tide, kan et plugin være nyttigt.

Valgmulighed 1: Ultimate Tweaker-plugin til WordPress

Ultimate Tweaker til WordPress

Først op, noget lidt anderledes: Ultimate Tweaker til WordPress, tilgængelig fra CodeCanyon. Den virkelig ultimative plugin-mulighed til redigering af din WordPress-administrator (annonce et par andre WordPress-funktioner).

De fleste plugins understøtter funktionalitet til et specifikt formål, men ikke Ultimate Tweaker; dette plugin er en alsidig allrounder, som jeg aldrig har set før. I det væsentlige understøtter Ultimate Tweaker 240+ forskellige WordPress-hacks, tricks og værktøjer til at gøre dit liv lettere. Dette gør det nyttigt på flere måder: forbedre effektiviteten, fjerne de dele af WordPress, der irriterer dig, og udvide WordPress-kernefunktionaliteten ud over, hvad du troede var muligt.

Disse 240 hacks er virkelig forskellige og kan opdeles i 35 forskellige kategorier. For at give dig en idé om, hvad Ultimate Tweaker kan gøre, her er bare et par af dens "hacks:"

  • Tilføj et logo over en sidebar-menu
  • Omstrukturer WordPress-betjeningspanelet og login-siden
  • Deaktiver højreklik eller knappen Udskriv skærm på dit websted
  • Øg sikkerheden ved at tilføje reCaptcha 2 til din login-skærm
  • Indstil JPEG-kvalitet for at reducere filstørrelsen på billeder
  • Aktivér kortkoder i tekst widgets
  • Opret et minimum ordantal for indlæg
  • Deaktiver den forkerte adgangskode “ryst” på loginskærmen
  • Føj Google Analytics-kode til dit websted
  • 19 nye tastaturgenveje til WordPress
  • Opret en brugerdefineret 404 side
  • Deaktiver automatiske WordPress-opdateringer

Mange af disse WordPress-hacks er ting, som vi alle har henvendt os til Google på et eller andet tidspunkt. De fleste af dem er relativt små i sig selv, men med en omfattende liste på flere hundrede kan plugin samlet tilbyde en masse værdi. WordPress-samfundet er normalt meget vokale om, hvad de gerne vil se fra WordPress-kernen, så jeg håber virkelig, at udviklerne lytter til samfundet og implementerer nogle af deres forslag i fremtidige opdateringer til dette plugin.

Valgmulighed 2: Skov - Revolution WordPress Admin Theme

Forest WordPress admin tema

Vil du bare ændre branding af backend på dit websted? Selvom vi typisk vil anbefale at bruge en smule kode, kan du også bruge et plugin. Hvis du keder dig af standarddashboardets udseende, giver Forest WordPress admin-tema dig mulighed for at give det lidt af en ansigtsløftning. Og for kun $ 9. Forest ændrer ikke, hvordan du udfører kendte opgaver i WordPress, ligesom tilføjelse af indlæg / sider, det vil bare gøre WordPress se bedre, når du gør dem! Plugin giver dig også mulighed for at ændre WordPress-standard-login-siden.

Forest admin tema skærmbillede

Ved skov kan du føje dit eget baggrundsbillede til WordPress-betjeningspanelet - eller du kan bruge et af de seks gratis billeder, inklusive dem i skærmbilledet ovenfor. Du kan tilpasse dashboardet ved hjælp af din egen kreativitet (ved hjælp af ubegrænsede farver) eller ved hjælp af et af standard WordPress-farveskemaer. Du kan tilpasse instrumentbrættet yderligere ved at vælge din egen typografi fra over 600 Google-skrifttyper. Plugin understøtter en lys og mørk hud, og du kan konfigurere opacitetsniveauerne for hvert element. Hvis der er nogle knapper i instrumentbrættet, du ikke bruger, kan du endda skjule dem - dette er godt til klientwebsteder, hvor for mange indstillinger kan overbelaste dem.

Bemærk: Skov ændrer ikke udseendet på dit live websted på nogen måde, det er udelukkende til back-end.

Ressourcer til tilpasning af WordPress Dashboard

Leder du efter at lære mere om tilpasning af WordPress-dashboard? Her er et par ekstra ressourcer til din professionelle værktøjssæt:

Over til dig…

Oprettelse af et tilpasset WordPress admin dashboard er en af ​​de bedste måder til at styrke brand image og give personaliserede erfaringer til dine kunder. Det er enkelt og tager ikke meget af din tid. Så hvad venter du på? Bliv tilpasset.

Bortset fra det, hvad lærte du her i dag? Har du nogensinde oprettet et tilpasset WordPress admin dashboard? Del med vores ivrige samfund i kommentarerne herunder. Skål!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map