php - How to modify CSS in a specific page of the WP admin dashboard (backend)
Get the solution ↓↓↓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";
}
Answer
Solution:
You have to inject the css into the wordpress header to actually modify the wordpress css admin console. In yourfunction.php
file add the following:
<?php function theme_admin_css() {
echo '
<style media="screen">
/* ... Your custom css goes here ... */
</style>
'; }
add_action( 'admin_head', 'theme_admin_css' ); ?>
Now to easily find your the element you want to target and style you can do the following:
In your browser: Right click on the element > Inspect. Find your element in the source code: Right Click > Copy > Copy selector
Now you can paste your selector in-between the style tag and customize it.
One more thing, you should you the!important
statement (eg:background-color:red!important
)
Answer
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 yourCSS
code.
// 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
- 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 );
Share solution ↓
Additional Information:
Link To Answer People are also looking for solutions of the problem: trying to access array offset on value of type bool in
Didn't find the answer?
Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.
Similar questions
Find the answer in similar questions on our website.
Write quick answer
Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.