I want to work on my style.css file.
But It would be better if after all change and test I publish it for users.
So Is there any way to make another style.css which load just for admin user?
You need to check the logged in user role before queuing it.
So the code should be like bellow.
you need to replace the plugins_url( 'my-plugin/css/plugin.css' ) with your stylesheet's path
function register_only_for_admin_styles() {
if( current_user_can('editor') || current_user_can('administrator') ) {
wp_register_style( 'admin-style', plugins_url( 'my-plugin/css/plugin.css' ) );
wp_enqueue_style( 'admin-style' );
}
}
add_action( 'wp_enqueue_scripts', 'register_only_for_admin_styles' );
Try the code then let me know the result.
Thanks
Related
I have a basic bunch of CSS/Js files defined in my functions.php file. There I register and enqueue those scripts and stylesheets.
But in specific situations I want to load additional scripts based on the site template which is used.
I tried to register and enqueue those additional scripts in the specific template file, but it didnt work. It does only work when included in the functions.php.
What is the correct way to do this?
You can try like this
add_action( 'wp_enqueue_scripts', 'enqueue_file' );
function enqueue_file() {
if(is_front() || is_archive()){ // you can set here condition
wp_enqueue_style( 'main-css', get_template_directory_uri() .
'/static/css/main.min.css"' );
}
}
add this to your functions.php in child theme:
add_action(
'wp_enqueue_scripts',
'loadActionFrontend'
);
function loadActionFrontend()
{
if( is_page( 'pageid here' ) ) {
wp_register_script(
'scriptName',
'scripturl',
[],
'',
true
);
wp_enqueue_script('scriptName');
}
}
with the query if( is_page( 'pageid here' ) ) you can insert your desired pageid where the script shold loaded.
I am trying to find a way to dequeue styles and scripts on the "login, password reset and register " default wp pages.
I understand there is 'login_enqueue_scripts' but no such thing as login_dequeue_scripts.
Whats your approach ? Ive tried something like this:
add_filter('body_class', function($classes) {
if (in_array('login', $classes)) {
wp_dequeue_style( 'list-css' );
wp_dequeue_style( 'blog-css' );
wp_dequeue_style( 'dir-css' );
wp_dequeue_style( 'author-css' );
}
return $classes;
});```
You could just use the wp_dequeue_script/style function for the login_enqueue_script action. Like so:
function custom_login_page() {
wp_dequeue_style( 'list-css');
}
add_action( 'login_enqueue_scripts', 'custom_login_page' );
The action of 'login_enqueue_scripts' is what happens when the other scripts/styles are loaded on that page. You can create a custom function to run when that happens, which is what you want.
However, rather than dequeueing, why not just write some of your own CSS for the elements on the page, then enqueue whatever that custom CSS?
function custom_login_css() {
wp_enqueue_style( 'custom-login-styles', get_stylesheet_directory_uri() . '/custom-login.css' );
}
add_action( 'login_enqueue_scripts', 'custom_login_css' );
Here's a good reference for the different elements you can customize with CSS on the WP login page.
I'm developing my first WordPress plugin. I need to use a custom CSS for the settings pages that I created for the plugin but when I enqueue my stylesheet file, it affects the whole WordPress backend and not just my plugin's settings page.
Is possible to solve this problem? How?
When you want to add styles or scripts in WordPress you enqueue them using hooks. For the admin side the hook you are looking for is called admin_enqueue_scripts.
You can add something like
/**
* Register and enqueue a custom stylesheet in the WordPress admin.
*/
function wpdocs_enqueue_custom_admin_style() {
wp_register_style( 'custom_wp_admin_css', plugin_dir_url( __FILE__ ) . 'css/woo-solo-api-admin.css', false, '1.0.0' );
wp_enqueue_style( 'custom_wp_admin_css' );
}
add_action( 'admin_enqueue_scripts', 'wpdocs_enqueue_custom_admin_style' );
You just need to be careful to correctly specify the url of the css script you want to enqueue.
Hope this helps.
Oh and https://developer.wordpress.org page is great for finding out about WordPress functionality, core functions, hooks etc.
Also check out the plugin handbook: https://developer.wordpress.org/plugins/
Loads of useful information can be found there :)
EDIT:
admin_enqueue_scripts has a parameter you can use read more
/**
* Register and enqueue a custom stylesheet in the WordPress admin.
*/
function wpdocs_enqueue_custom_admin_style( $hook ) {
if ( $hook === 'edit.php' ) {
wp_register_style( 'custom_wp_admin_css', plugin_dir_url( __FILE__ ) . 'css/woo-solo-api-admin.css', false, '1.0.0' );
wp_enqueue_style( 'custom_wp_admin_css' );
}
}
add_action( 'admin_enqueue_scripts', 'wpdocs_enqueue_custom_admin_style' );
This will load the script only on the edit post screen.
You can see what hook is loaded on your screen by adding
error_log( print_r( $hook, true ) );
In your wpdocs_enqueue_custom_admin_style function before the condition. Enable the debug log in your wp-config.php and you'll get a name of your custom post screen hook.
Alternatively, you could target the $current_screen to match the CPT's screen. This will load the script only on that page.
I'm trying load a style sheet is a user role is subscriber, what am I doing wrong:
<?php
global $current_user;
get_currentuserinfo();
if ( user_can( $current_user, "subscriber" ) ){
echo '<link rel="stylesheet" href="/login/subscriber-style.css">'
}
?>
This is in the header.php of the theme
You're using an outdated method of getting the current user role. get_currentuserinfo() was deprecated in WordPress 4.5.
https://codex.wordpress.org/Function_Reference/get_currentuserinfo
Also, you shouldn't be loading CSS directly from your header.php file, you need to enqueue it instead.
Add the following code to your functions.php file.
function wpse_load_subscriber_stylesheet() {
if ( current_user_can( 'subscriber' ) ) {
wp_enqueue_style( 'login-subscriber-style', home_url( '/login/subscriber-style.css' ) );
}
}
add_action( 'wp_enqueue_scripts', 'wpse_load_subscriber_stylesheet' );
This assumes that your CSS is placed in your web root (https://example.com/login/subscriber-style.css). If it's in your theme folder instead then you need get_template_directory_uri() . '/login/subscriber-style.css'.
https://developer.wordpress.org/reference/functions/wp_enqueue_style/
I was trying to include a css file in my WordPress plugin admin page. I have tried below method
function theme_name_scripts() {
wp_enqueue_style( 'jspro', '/includes/parts/css/jspro.min.css');
}
But unfortunately it doesn't work. My css file path is correct as given here,and I have tried almost every method. Any idea?
You need to have an absolute URL to your css file, and hook into the correct admin hook (in this case, 'admin_init'):
add_action( 'admin_init', 'theme_name_scripts' );
function theme_name_scripts() {
wp_enqueue_style( 'jspro', plugins_url('includes/parts/css/jspro.min.css', __FILE__));
}
In admin mode there is a special hook 'admin_enqueue_scripts' that WP reccomends to use.
add_action('admin_enqueue_scripts', 'theme_name_scripts');
function theme_name_scripts() {
wp_enqueue_style('jspro', '/includes/parts/css/jspro.min.css');
}
Also, hook can also be used to check the name of current admin page:
function theme_name_scripts( $hook ) {
if ( $hook != 'edit.php' )
return;
wp_enqueue_style('jspro', '/includes/parts/css/jspro.min.css');
}