Cuándo un plugin aplica un estilo a su output que no se adapta al look and feel de tu web, tienes dos opciones, o sobreescribes las reglas CSS del plugin o las reemplazas completamente, no hay otra. En este post veremos dos formas de hacerlo.

Debido al funcionamiento en cascada de las reglas CSS, sobreescribir los estilos del plugin es muy fácil. Basta con cargar nuestro stylesheet después del stylesheet del plugin utilizando wp_enqueue_style() y el manejo de dependencias de WordPress.

Por ejemplo, supongamos que el identificador del stylesheet del plugin es miplugin y vamos a sobreescribir las reglas CSS en un archivo localizado en el tema y llamado miplugin-override.css:

add_action( 'wp_enqueue_scripts', 'cyb_enqueue_style' );
function cyb_enqueue_style() {

    // handler, src, array de dependencias
    wp_enqueue_style( 'miplugin-override', get_template_directory_uri() . '/miplugin-override.css', array( 'miplugin' ) );

}

Lo que hacemos con el tercer parámetro de wp_enqueue_style() es decirle a WordPress el identificador de un CSS del que depende el nuestro. Es decir, le decimos a WordPress que cargue nuestro CSS después del otro.

Pero esta solución no me gusta mucho. Implica cargar un archivo más. Si son pocas reglas las que vamos a sobreescribir las podríamos poner en el archivo principal del tema y punto; se seguiría cargando el CSS del plugin y las pocas reglas introducidas en el tema no harían ningún daño.

Pero si vas a sobreescribir una gran parte mejor reemplazar el stylesheet completamente. ¿Cómo? Con el fabuloso filtro que acabo de descubrir: style_loader_src:

add_filter( 'style_loader_src', 'cyb_replace_stylesheet', 10, 2 );
function cyb_replace_stylesheet( $stylesheet_src, $handle ){

    if( 'miplugin' == $handle ){

        $stylesheet_src = get_template_directory_uri() . '/miplugin-override.css';

    }

    return $stylesheet_src;

}

Evidentemente para que cualquiera de los métodos propuestos funcione, el plugin debe cargar su hoja de estilos utilizando wp_enqueue_style(). De lo contrario WordPress no tendrá ni idea de su existencia. Una prueba más de que utilizar el manejo de dependencias de estilos y scripts de WordPress es siempre una buena práctica.