StackTips
 2 minutes

How to use custom CSS in Redux framework option panel

By Editorial @stacktips, On Sep 17, 2023 PHPWordpress 2.49K Views

Redux WordPress framework is awesome in its way. It powers developer with an awesome options panel, that you can use for developing themes or plugins without having to worry about complexities of WordPress settings API.

I absolutely love the way the option panel is organized into tabs and sections. However, if you feel you need more customization, you can include your own CSS and customize the option panel look that suits you.

Add the following code snippet to your redux framework options-init.php file to add your custom css to Redux framework options panel.

// This is your option name where all the Redux data is stored.
$opt_name = 'my_theme_options';
//...

// Append custom css to redux framework
if (!function_exists('my_theme_redux_custom_css')):
    function my_theme_redux_custom_css()
    {
        wp_register_style('my-redux-custom-css',
            CSS_URI . '/admin/theme-options-custom.css', array('redux-admin-css'),
            THEME_VERSION, 'all');
        wp_enqueue_style('my-redux-custom-css');
    }
endif;
add_action('redux/page/' . $opt_name . '/enqueue', 'my_theme_redux_custom_css');
stacktips avtar

Editorial

StackTips provides programming tutorials, how-to guides and code snippets on different programming languages.