Edit CSS of WP Theme Customiser

Hi,

I was wondering if their was anyway to edit the CSS of the wp theme customiser? The one on the front end? I have found customize.php and several CSS file but no of theme seem to affect the style.

Thanks

  • Jude

    Hey Joey

    Welcome to the community !

    Here is some CSS that can make it blue

    <?php
    
    /**
     * This function adds some styles to the WordPress Customizer
     */
    function my_customizer_styles() { ?>
    	<style>
    .customize-controls-close,
    .wp-full-overlay-sidebar {
        background: blue;
        color:white;
        border-right: 1px solid blue;
    }
    
    #customize-controls .customize-info .accordion-section-title {
        background: blue;
        color: white;
        border-left: none;
        border-right: none;
        border-bottom: none;
        cursor: default;
    }
    #customize-theme-controls .accordion-section-title {
        color: white;
        background-color: blue;
        border-bottom: 1px solid blue;
    }
    	</style>
    	<?php
    
    }
    add_action( 'customize_controls_print_styles', 'my_customizer_styles', 999 );

    Of course you'd want to replace blue with your own color code.

    Insert that into either your theme's functions.php, or you can insert it as a mu-plugin.

    To create an mu-plugin, go to your /wp-content/ folder via FTP, and find the folder called "mu-plugins". If there is no folder with that name, then you'll want to create one. Then, create a file inside that folder, and give the file any name you like (making sure the file as an extension of .php, e.g. example.php) and paste the code in there.

    You don't need to activate that plugin, as it will be always be automatically activated. Please be sure to add a PHP start tag at the beginning of the code if you insert this code as a mu-plugin, like this:

    <?php

    Thank you for being a WPMU DEV member and have a fantastic day!

    Cheers
    Jude

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.