Issue

I'm trying to remove both padding and title of the dashboard page of the admin panel of wordpress. The dashboard was redesigned with the "Welcome Dashboard for elementor" + Elementor.

I tried the below .js code it's not working. Would you havec fixes or ideas to achieve this please ? Thank you. Ed

var path = window.location.pathname;
if((path == "/wp-admin/" || path == "/wp-admin" || path == "/wp-login.php") && domainURL+path)
{
    document.getElementsByClassName("h1").style.display = "none";
}

Solution

In general, the <body> classes contain a unique class specific to that one page (e.g. page name), you could add this as the first selector to your CSS code.

If not, you can add a CSS classes to the <body> tag with admin_body_class

// Backend
function filter_admin_body_class( $classes ) {  
    // Current url
    $current_url = '//' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
    
    // Get last part from url. Expl: index.php
    $last_part = basename( parse_url( $current_url, PHP_URL_PATH ) );
    
    if ( $last_part == 'index.php' ) {
        // String
        $classes .= 'my-custom-backend-class';
    }
    
    return $classes;
}
add_filter( 'admin_body_class', 'filter_admin_body_class', 10, 1 );

Additional: For frontend pages you could use body_class

Note: The Conditional Tags of WooCommerce and WordPress can be used in your template files to change what content is displayed based on what conditions the page matches.

// Frontend
function filter_body_class( $classes ) {
    // Returns true on the cart page.
    if ( is_cart() ) {
        // Array
        $classes[] = 'my-custom-frontend-class';
    }
    
    return $classes;
}
add_filter( 'body_class', 'filter_body_class', 10, 1 );

Answered By - 7uc1f3r

Monday, February 7, 2022

[FIXED] How to modify CSS in a specific page of the WP admin dashboard (backend)

Issue

Solution

No comments:

Post a Comment