Programming

WordPress: Modifying or Adding Stylesheets with wp_enqueue_style and wp_dequeue_style

1 minute read

This post is from June 2014. The screenshots show the interface as it was then; today it looks slightly different in places.

WordPress LogoAnyone who has worked with WordPress knows that plugins often bring their own styles, which may need to be adjusted. Of course, it is not a good idea to change styles directly within the plugin, as these customizations will be lost during the next update. Furthermore, plugin styles often cannot be overwritten using the style.css in the root directory because they are frequently loaded later in the process.

How it works: wp_enqueue_style / wp_dequeue_style

# Der Code hier sollte in die functions.php eingetragen werden
# Sollte das Theme ein Child-Theme sein, und es gibt noch keine functions.php in 
# dem Child-Theme-Verzeichnis, dann genügt eine eigene functions.php in dem 
# Child-Theme Verzeichnis mit den Angaben hier unten (die neuen Anweisungen 
# und Funktionen ergänzen dann die functions.php des Parent-Themes)
#
# Hier wird verhindert, das "Problem_Stylesheet" zu laden
# 'plugin-style' ist der unique Identifier

function plugin_style_drop(){
  wp_dequeue_style( 'plugin-style' );
}

# Hier wird ein extra Stylesheet eingebunden
# Beispielsweise um die Stylesheet Informationen eines Formular-PlugIns zu überschreiben

function style_extension_scripts() {
  wp_enqueue_style( 'custom-plugin-style', get_template_directory_uri() . '/plugin-new-style.css' );
}

# Hier werden die Funktionen ausgeführt
# wp_print_scripts; diese Funktion stellt sicher, dass das zu 
# dequeuende Style auch geladen wurde, um es sicher zu entfernen
# Die Prio wird als drittes Argument in add_action hinzugefügt,
# der Wert kann individuell angepasst werden

add_action( 'wp_print_scripts', 'plugin_style_drop', 100 );
add_action( 'wp_enqueue_scripts', 'style_extension_scripts', 101 );

Published on 16. June 2014, last updated on