CSS

How/where to add additional stylesheet to WP

The WordPress API provides the functions wp_enqueue_style() and wp_enqueue_script() for including stylesheets and JavaScript. These functions should be used instead of hardcoding style or script tags within HTML. // Runs wpse_enqueue_styles() on the wp_enqueue_scripts() hook. // (Yes, we’re enqueuing a stylesheet here, but the proper hook is wp_enqueue_scripts. add_action( ‘wp_enqueue_scripts’, ‘wpse_enqueue_styles’ ); function wpse_enqueue_styles() { … Read more

How to override Gutenberg admin CSS

To override Gutenberg’s styles you need to add your own stylesheet. So hook into enqueue_block_editor_assets and then add your own stylesheet in which you target the selectors you wanna override. In the following example I placed a stylesheet in a custom theme’s assets/ folder. functions.php: // Add backend styles for Gutenberg. add_action(‘enqueue_block_editor_assets’, ‘gutenberg_editor_assets’); function gutenberg_editor_assets() … Read more

Style classic editor buttons

You can add CSS to the admin area of WordPress using the [admin_head][1] hook add_action(‘admin_head’, ‘my_custom_admin_styles’); function my_custom_admin_styles() { echo ‘<style> #qt_content_center { color: red; } </style>’; } Note: Alternatively, you could add a stylesheet using the same function. Edit: Adding custom stylesheet to WP Admin. add_action( ‘admin_enqueue_scripts’, ‘load_admin_styles’ ); function load_admin_styles() { wp_enqueue_style( ‘admin-styles’, … Read more

Write text below a specific part of a sentence

Maybe you could find the x/y-position of the span with Javascript and position another div with an increased y-position? I don’t think there will be an out-of-the box css solution to this problem. Here is a quick example: <!DOCTYPE html> <html lang=”en”> <head> <meta name=”viewport” content=”width=device-width” /> <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /> <style> p {font-size: … Read more

Enable specific CSS Code for Visitors and specific Roles

You can add custom css on your html header using wp_head hook action & checking your current User Role add_action(‘wp_head’, ‘add_css_of_current_specific_user_role’); function add_css_of_current_specific_user_role() { /*Check Current User is Login*/ if ( is_user_logged_in() ) { $user = wp_get_current_user(); /*Check Current User Role*/ if (in_array(‘visitor’, $user->roles)) { ?> <style> // Some CSS </style> <?php } } }

removing my underline from hyperlinks

The code you said you tried, a {text-decoration:none;}, should work. Using, a {text-decoration:none!important;}, should definitely work or using an inline style, like in the <p> tag would take precedence over the stylesheet. The more correct way would be to either edit the CSS, ideally in a child theme, and apply your own styling. Using !important … Read more

Adding HTML to the Header, Screws up in IE7

Write a stylesheet just for ie7 and link it in wordpress like so: <!–[if IE 7]><link rel=”stylesheet” type=”text/css” href=”https://wordpress.stackexchange.com/questions/4324/<?php bloginfo(“stylesheet_directory’); ?>/css/ie7.css” /><![endif]–> in the file add this #header table {float:right;} #header table tr td p {margin-top:45px;}

Looking for methods to Check if File Exist

There’s a lot of ways you could go with this. I might enqueue the style in your theme’s functions.php dependent on a file_exists() check. $your_css_file_path = “/path/to/file”; if ( file_exists($your_css_file_path) ) { wp_register_style(‘your_theme_stylesheet’, $your_css_file_path); wp_enqueue_style( ‘your_theme_stylesheet’); } Here’s the relavent core source.

WooCommerce change number of columns in the frontpage

You didn’t say what snippets you’ve actually tried, but according to the docs, you can filter loop_shop_columns like so: function wpa65503_woo_shop_columns( $columns ) { return 3; } add_filter( ‘loop_shop_columns’, ‘wpa65503_woo_shop_columns’ ); tested and working for me with Twenty Eleven theme. EDIT – this is the particular line in the default content-product.php template file that makes … Read more

+ More