How to Customize the Background Color of WordPress Block Editor Video

Do you want to change the background color of the WordPress block editor for admins?

Sometimes when working on a custom client project, you may want to change the Gutenberg editor background color in WordPress to match their brand colors.

In this video, we’ll show you how to easily customize the background color of the WordPress block editor for admin area.

0:00 Intro
0:26 Installing and activating WPCode
1:20 Adding a custom code snippet
2:20 Settings and customization

Related Links
►Don’t forget to read and subscribe! https://www.wpbeginner.com/wp-themes/how-to-customize-the-background-color-of-wordpress-block-editor/
►WPCode https://wordpress.org/plugins/insert-headers-and-footers/

Top Resources

⚡Use Promo Code WPBVIP⚡

►Best WordPress Contact Form Plugin https://wpforms.com/wpbeginner
►Best WordPress Analytics Plugin https://www.monsterinsights.com/
►Best Lead Generation Plugin https://optinmonster.com/
►Best WordPress SEO Plugin
https://aioseo.com/
►Best Theme Builder for WordPress https://www.seedprod.com/

Related Videos
►WordPress Tutorial – How to Make a WordPress Website for Beginners https://www.youtube.com/watch?v=DvbFBxKcORA
►WordPress Gutenberg Tutorial: How to Easily Work With the Block Editor https://www.youtube.com/watch?v=JjfrzGeB5_g
►What is SEO and How Does it Work? https://www.youtube.com/watch?v=JjfrzGeB5_g
►How to Install a WordPress Theme https://www.youtube.com/watch?v=ZIPQRQLAz90

If you liked this video, then please Like and consider subscribing to our channel for more WordPress videos.
https://www.youtube.com/subscription_center?add_user=wpbeginner

Follow us on Twitter:
https://twitter.com/wpbeginner

Check out our website for more WordPress Tutorials
https://www.wpbeginner.com/

#WPBeginner #WordPress #WordPressTutorial


Sometimes when working on a custom Client project you might want to change The Gutenberg editor background in WordPress to match their brand so in This video we'll show you how you can Easily customize the background color of The WordPress block editor for the admin Area and as I've said that this guide is Going to change the editor color in the Admin area if you're looking to change The background color on the front end Then we have several tutorials that show You how you can do that The easiest way to change the background Color is by adding custom code to your Themes function.php but if you're like Most people that may do a little nervous For making changes to the code but keep In mind that there is a simple and easy Way to do this using a plugin we're Going to install something called WP Code it is the best WordPress code Snippets plugin on the market it lets You safely add code to your website and Also has a repository of code Snippets That you can use that will replace Several other plugins on your site so Let's head over to our WordPress Dashboard we'll go to plugins add new And we're searching for WP code This is the one we want so let's go Ahead and click install now And stick around to activate the plugin As well

Great now that it is activated we see That it's activated here we can either Go to code Snippets or if you ever need To come back to make changes then just Know that on the left hand side we have This area down here called code Snippets And we'll click add snippet And you see there's several free Snippets that you can choose from Anywhere from disabling comments all Over your site to automatically Disabling automatic updates and so much More for this one we're going to add Your own custom code so let's go ahead And click on use snippet Now we're going to create our custom Snippet and this is where we can give it A name so a name that is helpful for you And the code type that we want to use is We want to use the PHP snippet and now We need to add a bit of code now this Code you can find in our tutorial we'll Have a link in the description below to Our written tutorial But this is the bit of code that we want To showcase so you'll want to change This hex code to whatever color you're Wanting And then we can scroll down to Showcase Where we want this to go it'll Auto Insert or you could use shortcode but For this one we're going to Auto insert This and the location where we want this To go is we don't want it to run

Everywhere we want it to run an admin Only It'll be admin only and coming all the Way up to the top we want to make sure That we set this to active so we'll Toggle that and let's go ahead and save The snippet And then to see it in action we'll go Say to a post and we'll click add new And now this area is blue again this is The hex code that we showed you you can Change that to whatever you want And if you want to see a little bit more Of what WP code can do then you can Watch this video next on how to easily Add custom code in WordPress and I'll See you over there

You might like