Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Så här ändrar du färgschemat för admin i WordPress (snabbt och enkelt)

Även om standardfärgschemat för WordPress-admin är funktionellt kan det kännas lite oinspirerat. Så du kanske vill ändra färgschemat för admin i WordPress.

Genom att ändra färgschemat för WordPress dashboard kan du skapa en custom dashboard för dig och ditt team. Färgschemat kan matcha designen för ditt varumärke eller bara utvalda dina favoritfärger.

Vi har experimenterat med att ändra färgschemat för administratörer på både våra egna och våra kunders webbplatser, och vi har upptäckt att det kan ha en betydande inverkan på arbetsflödet och användarupplevelsen.

I den här artikeln visar vi dig hur du enkelt ändrar färgschemat för admin i WordPress.

How to change the admin color scheme in WordPress

Varför ändra färgschemat för Admin i WordPress?

Om du inte gillar standard admin färgschema i WordPress, kan du enkelt ändra färgschemat till något du gillar.

Du kan också ändra färgschemat för att matcha designen på ditt WordPress theme, eller till och med add to en mörk funktion.

Detta kan vara användbart om du har en membership site eller en online store där användare kan logga in på din site, och vill att din website och adminpanelen ska erbjuda en liknande upplevelse.

Du kan också använda ett annat färgschema för admin för din staging site för att lättare skilja den från din live site.

Med det sagt, låt oss visa dig några olika sätt du kan ändra admin färgschema i WordPress. Du kan använda snabblänkarna under för att hoppa direkt till den metod du vill använda.

Så här ändrar du Admins färgschema med standardinställningar för WordPress

WordPress har en utvald funktion som låter dig välja mellan några förutbestämda färgpaletter för din WordPress adminpanel.

För att ändra admin färgschema, logga in på din WordPress dashboard och navigera sedan till Användare ” Profil.

Därefter väljer du det nya färgschemat i sektionen ”Admin Color Scheme” genom att klicka på alternativknappen.

Select new admin color scheme

Det finns 9 olika färgscheman att välja mellan, inklusive Standard, Light, Modern och mer.

När du klickar på olika alternativ ändras färgschemat automatiskt.

Admin color scheme change example

När du har valt ett färgschema som du gillar måste du rulla ner längst ner på sidan och klicka på knappen ”Update Profile”.

Save new admin color scheme

Du kan även kontrollera färgschemat för admin för andra registrerade användare på din WordPress website.

För att göra detta går du till Användare ” Alla användare, hoverar över användaren och clickar på knappen ”Edit”.

Edit user color scheme

Följ sedan samma process som ovan för att ändra färgschemat för admin för den användaren.

När du är slutförd, se till att du klickar på knappen ”Update Profile” längst ner på sidan.

Hur man skapar Customize Admin Färgscheman i WordPress

Om du vill ha ännu fler färgval för din adminpanel kan du skapa customize färgscheman och uploada dem till din WordPress blogg.

För att göra detta går du till den gratis WordPress Admin Colors website och klickar på knappen ”Start Creating”.

Click start creating button

Enter sedan ett namn i boxen ”Color Scheme Name”.

Detta namn kommer att dyka upp i din WordPress adminpanel som ett new alternativ för färg.

Enter color scheme name

Efter det kan du helt customize ditt färgschema genom att clicka på färgalternativen i ”Choose your colors” section.

Om du vill ändra en av de befintliga färgerna klickar du på färgen och väljer din new färg i popup-fönstret. Du kan clicka var som helst i färgväljaren eller enter en Hex-kod för en specifik färg.

Click to customize colors

När du är klar med att customize ditt färgschema klickar du på knappen ”Generate Color Scheme” längst ner på sidan.

Detta skapar koden för färgschemat som du behöver add to WordPress.

Click to generate color scheme

På nästa page kommer det att finnas två olika kodfiler.

Du måste downloada CSS-filen och kopiera code snippet och paste in det i din favorit textredigerare. Vi kommer att lägga till dessa i dina WordPress-filer.

Download CSS and copy PHP code

Om du inte har gjort det tidigare kan du kontrollera vår guide om hur du copy and paste-kod i WordPress.

Du kan add the code snippet to your functions.php file eller genom att använda ett code snippets plugin.

För denna tutorial kommer vi att använda code snippets plugin WPCode. Det är den enklaste och mest nybörjarvänliga metoden för att lägga till code snippets på din WordPress site.

WPCode

Först måste du installera det gratis pluginet WPCode. För mer detaljer, se vår guide för nybörjare om hur du installerar ett plugin för WordPress.

När du har aktiverat den kommer du att ha ett new menu item med namnet ”Code Snippets” i din WordPress admin bar. Om du klickar på det visas en lista över de code snippets som du har saved på din site. Eftersom du precis har installerat pluginet kommer din lista att vara tom.

Gå vidare och klicka på knappen ”Add New” för att lägga till ditt code snippet i WordPress.

Click the Add New Button to Add Your First Custom Code Snippet in WordPress

Därefter ser du sidan ”Add Snippet”. Navigera till alternativet ”Add Your Custom Code (New Snippet)” och klicka på knappen ”Use snippet”.

Add your new custom code snippet in WPCode

Därefter väljer du ”PHP Fragment Kodu” som kodtyp från listan med alternativ.

Select PHP Snippet as the code type

Nu kan du ge ditt fragment kod ett namn. Det kan vara vad som helst för att hjälpa dig att komma ihåg syftet med din kod.

Klistra sedan in fragmentet kodu som du kopierade från ovan i rutan ”Code Preview”.

Name and add new code snippet

Därefter måste du välja infogningsmetoden för ditt code snippet.

You can leave it on the ’Auto Insert’ method, so it will automatically insert and execute the code snippet in the proper place.

Pick the insertion method for your custom code snippet

Därefter togglar du omkopplaren från ”Activate” till ”Inaktiverad” och klickar sedan på knappen ”Save Snippet” högst upp till höger på vyn.

Detta kommer att save koden och aktivera det nya admin färgschemat.

Save and activate your custom code snippet

Nu måste du uploada CSS stylesheet som du downloadade tidigare till din theme directory på ditt WordPress webbhotell account.

För att göra detta kan du använda en FTP-klient eller alternativet filhanterare i kontrollpanelen på ditt WordPress webbhotell.

Om du inte har använt FTP tidigare kan du kontrollera vår guide om hur du använder FTP för att uploada filer till WordPress.

Först måste du ansluta till din website med hjälp av en FTP-klient eller filhanteraren i cPanel. När du är ansluten måste du navigera till mappen /wp-content.

Select wp-content folder FTP

I mappen wp-content hittar du en folder som heter themes. Det är här WordPress lagrar alla themes som din website använder eller har använt tidigare.

You need to click on the themes folder, and then open up the folder for the theme you’re using.

Open themes folder and select theme

Sedan uploadar du filen display.CSS som du downloadade.

Din CSS-fil kommer att ha det namn som du valde tidigare.

Upload new CSS file

Note: If you change WordPress themes, then you will need to upload the CSS file to your new theme folder.

Därefter navigerar du till Användare ” Your Profile.

Sedan kan du selecta det nya färgschema som du just har skapat.

Select custom color scheme

Om du vill använda det här färgschemat, se till att klicka på knappen ”Update Profile” längst ner på sidan.

Hur man kontrollerar standard Admin färgschema för nya användare

När en new användare skapar ett account får de alternativet att customize sitt färgschema. Men du kanske vill kontrollera administratörens standardfärgschema eller förhindra användare från att ändra färgschemat helt och hållet.

Det enklaste sättet att göra detta är att använda det gratis tillägget Force Admin Color Scheme.

Först måste du installera och aktivera pluginet. För mer detaljer, se vår steg-för-steg guide om hur du installerar ett WordPress plugin.

Efter aktivering, navigera till Användare ” Profil och välj sedan din adminfärg och klicka på checkboxen ”Force this admin color scheme on all users”.

Check force admin color scheme checkbox

Efter det klickar du på knappen ”Update Profile” längst ner på sidan.

Nu kommer admins standard färgschema att vara detsamma för alla nya och befintliga användare på din site.

Pluginet inaktiverar också administratörens färgschema-väljare för alla dina användare. De enda användare som kan ändra den här färgen är de med admin-åtkomst.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du ändrar admin-färgschemat i WordPress. Du kanske också vill se våra expertval om de bästa plugins för kokpit i WordPress-admin och vår przewodnik om hur man döljer onödiga menyalternativ från WordPress-admin.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Avslöjande: Vårt innehåll stöds av våra läsare. Det innebär att om du klickar på några av våra länkar, kan vi tjäna en provision. Se hur WPBeginner finansieras, varför det är viktigt, och hur du kan stödja oss. Här är vår editoriala process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Den ultimata WordPress-verktygslådan

Få GRATIS tillgång till vår verktygslåda - en samling WordPress-relaterade produkter och resurser som varje professionell användare bör ha!

Reader Interactions

45 kommentarerLämna ett svar

  1. Dayo Olobayo

    I always forget the exact steps to change the color scheme but having this guide bookmarked saves me a ton of time whenever I want to refresh the look of my admin dashboard. Thank you.

    • WPBeginner Support

      You’re welcome!

      Administratör

  2. llarron

    Works brilliantly! The standard colour schemes are so boring and never match brand colours this is a great addition to the back of a website and easy to do. Thanks.

    • WPBeginner Support

      Glad you found our recommendation helpful :)

      Administratör

  3. Puck

    Hi,
    I’m trying to make this work but it won’t show up on the users panel. I followed the exact steps as shown above. Do you have any tips? :)
    Thanks!

    • WPBeginner Support

      If you are not using it, to change everyone’s admin color scheme, you would need to use the plugin method from this guide and ensure you save changes.

      Also, if you have a caching plugin, you may want to clear your caching to ensure it updates.

      Administratör

  4. Angelo

    I tried to change but not convinced of others and I kept default color scheme :-)

    • WPBeginner Support

      That’s perfectly fine, its a personal preference if you change the colors or not :)

      Administratör

  5. David Swanson

    Spend a lot of time in wp-admin. Havn’t found away to make your own color sceme. Might need to take a weekend and create a plugin that does that with a few color wheels.

  6. Barry

    @maxpen:disqus did you find a solution? i want the same thing

    • Aria

      you’ll find the css files in ”wp-admin > css > colors”

  7. Max Pen

    I want to know where they store the files of each theme and how to create one.

  8. GP Diller

    I think it was a very juvenile move on behalf of the Wordpress team to force such an unprofessional, overly trendy design trend down all their users throats without including a color scheme that somewhat resembles the normal admin interface.

    Flat design does not belong heavy interfaces like admin dashboards. These require more separation than flat design can provide. In about 5 years the designers will all look back and realize all of this and by that point the ”bleeding edge” designer will be posting screenies on Dribbble of their deep designs (which somehow they’ll manage to make overly complicated).

  9. Eleanor

    Personal settings? I looked everywhere on the dashboard and could not find it, Weird thing is, when I click on my profile I can see the color change page flash by before the page that has Proofreading and the rest of the settings. So it’s there, just can’t access it. ~Eleanor

      • Eleanor

        Yes it still does the same thing. I don’t mind the black design but would be nice if worked like it’s supposed to. ~Eleanor

  10. Justin

    As a plugin/theme developer, is there any way to grab the colors to apply to our plugins/theme admin panels so we can match the chosen color scheme?

  11. Peter

    This plugin adds one more admin color scheme, which is similar to the light grey and blue colors of old (Wordpress 3.7) admin panel, strikes a balance between earlier classical view and new flat view. Makes visible menu separators between menu blocks and menu items:
    http://wordpress.org/plugins/wp-admin-classic-colors/

  12. Rima

    Terrible move. Don’t fix something that ain’t broken. The light scheme is too light and the dark is too dark. I want my old color scheme back!!

    • Rudy

      Couldn’t agree more. The old color scheme was perfect, I totally dislike the black color in the admin menu, and the choices you have to change it aren’t good either – the grey (light scheme) is way too light. Absurd move.

    • Doug

      I think you missed the point…you can change them up yourself. You can go back to what you had, but let us who wanted more have the option of having more.

  13. rose reynolds

    i like the sunrise

  14. Giovanni M

    It would be great if you guys would include a ”do-it yourself” solution to adding color schemes in addition of passing it off to a plugin.

    • Sheryl

      I agree — it’s what I had expected, given the article intro.

      Eventually I may poke around and find out for myself where I can alter the colors, and hard code in new combinations.
      For now, I just need to get some work done –now that the Default dark theme is no longer an impediment :)

      The plugin is a good midway option, although I thought the plug in would go one additional step, allowing users to create their own custom colored theme. (good use for kuler)

      To authors: Thanks for the article!
      I could not spend another moment in WP on those Default colors!!
      I hated the new theme and it wasn’t obvious how to change it.

      WP should have Defaulted to colors we are accustomed to,
      and in a prominent location, advertise where we could change it.
      Dark was so unpleasant, distracting, and difficult to read.

  15. Rob

    Thanks for the article. I can’t believe on WP 3.8 none of the colour options included the old colour scheme which people are used to and is far easier on the eye in my opinion. WP needs to learn if it ain’t broke don’t fix it!

  16. Jenny Lens

    Whomever designed these color schemes needs serious lessons about eye strain, user friendliness, color theory and more. I cannot believe they totally eliminated the plain vanilla, easy to read, pleasant dashboard. They are outta their minds to think this is a good move. The last thing I want to see are horrible color schemes designed by fools who don’t understand how disturbing these colors can be to many people. I was a huge WP fan and advocate. I never stop sharing its benefits. But this is a big, bad mistake. I am stunned ….

    • Alison Foxall

      The ”light” scheme seems to be vastly similar to the old color scheme.

    • Sheryl

      Absolutely!
      Black is very difficult to read..maybe if I had my screen brightness way up, the text would be more readable? But then the disturbing contrast and eye strain would also be more pronounced.

      No reason they couldn’t have given us an option closer to what everyone is accustomed to working with.

      I also chose the Only light option they presented. The other non-dark option is a possibility, but a slight downer.

  17. Benjamin Beck

    Exactly what I was looking to get done. Thanks for putting this up so fast!

  18. Ian Allan

    Yep. I LOVE the new look, but I also find it VERY frustrating. There is so little contrast in the comments area that I find it difficult to work out at-a-glance which comments I have responded to and which I haven’t. Changing the color scheme does not affect the color of comments.

    • Charles Kosman

      Ian, I couldn’t stand the comment color either. They definitely should have made it stand out more. Pretty simple fix is to just edit the default color.min.css file.

      Search for #fefaf7 in wp-admin/css/colors.min.css and change with #FFFF88 in both locations. #FFFF88 is an easy to see yellow but you can put any color you want in there.

      Hope that helps anyone looking for a quick fix. If you’re using a different color theme (for example Midnight) then the css file will be in wp-admin/css/colors/midnight/colors.min.css.

      • Sheryl

        Thank You!!

        Notice that the admin bar that appears at the top of our website when we are logged in does Not Change to reflect the chosen theme. It remains black no matter what:( I expect it to be the background color of our chosen admin theme.

  19. Brook Acklom

    Sorry, I don’t like any of the new schemes at all. I have a top-of-the-range 24″ HiRes monitor fed by a good graphics card and get severe colour fringing on most text in the dashboard.

    PLEASE let’s have a plain, old-fashioned Black, White + shades of grey option.

    The old colour scheme was much better IMHO.

      • Curt

        THANK YOU !!!

        WP has features I love, but a forced ”new look” ain’t one of ’em.
        Was starting to think about how I could revert to the 3.7 look, or abandon wordpress completely.
        This isn’t the only non-optional unwanted ”upgrade” that’s happened lately.

  20. Eden Chen

    Good post,

  21. Sean Davis

    I kind of love this part of the new update. Midnight is my favorite one at the moment.

  22. Aksam Zarook

    Its great wordpress is improving and keeping up with current trends like flat design and mobile browsing. But I think they should have left a option for us to continue using the old color scheme and look. I have used wordpress as the cms for several clients and trained them and made user manual with browser shots of the admin panel for them. Now this update is forcing us to change the admin look of these client’s without any option. The even the closest available color schemes and look is too different than the 3.7.1 look. I don’t think my clients will like a change like this thrust on them.

  23. adolf witzeling

    Nice! My favorite One is the ”Flat Theme”. How about a tutorial how to create your own color scheme? WP Beginner Rocks! Keep it up.

    • Mark Bailey

      Alan, thank you! That is exactly what I was hoping to find in this article…how to set the default!

  24. jennifer hyndman

    I went to the dashboard, and then to ’users’, but the colors were not under ’my profile’ for me, they were under ’personal settings’.

Lämna ett svar

Tack för att du väljer att lämna en kommentar. Tänk på att alla kommentarer modereras enligt våra policy för kommentarer, och din e-postadress kommer INTE att publiceras. Vänligen använd INTE nyckelord i namnfältet. Låt oss ha en personlig och meningsfull konversation.