WordPress Theme optimieren: unnötiges CSS entfernen

So kannst du in deinem WordPress Theme das css deutlich optimieren, indem du alles was nicht gebraucht wird, entfernst:

Basierend auf einer Anleitung von Holger Guggi von fullstackoptimization.com:

Schritt für Schritt:

1. Theme analysieren:
   Finde alle Templates im Theme, d.h. alle PHP Files die nicht inkludiert werden.
   Sie sind entweder aus der Template Hierarchie (index.php, page.php, single.php, home.php, search.php) oder haben ein Kommentar /* Template Name: … */
   Du erkennst sie auch daran, das üblicherweise get_header aufgerufen wird. Wird get_header von woanders inkludiert, musst du einfach rückwärts suchen, wo dieses Script eingebunden ist.
   Man kann die Templates also auch mit „In Folder suchen“ von get_header finden.
   Bei meinem Theme waren es insgesamt 11 Stück, wenn man die 404 mitrechnet.
2. Für jede dieser Templates öffne dir eine möglichst komplexe Beispielseite in einem eigenen Tab im Chrome
   Welche Seite das ist, dabei hilft die Template Hierarchy.
3. Öffne jeweils dazu die css Coverage:
   1. in den Developer Tools hinter den 3 Punkten … -> more Tools -> Coverage
   2. Aktivieren durch den grauen/roten Aufnehmen Button
   3. Reloaden
   4. Ein Click auf style.css öffnet das CSS im Network Fenster der Developer Tools, auf der Seite schön rot oder grün markiert.
      https://developers.google.com/web/updates/2017/04/devtools-release-notes
      
4. Mach dir ein Backup vom style.css
5. Jetzt vergleiche Block für Block im style.css.
   1. Lass alle Tag-Level Style Informationen drinnen: body, h1 … h6, p usw.
   2. Lass alle drinnen, die in irgendeinem Tab grün markiert sind.
   3. Nun durchsuche deinen Code nach den gefundenen Klassen (Suche im Ordner, case-sensitive, *.php)
   4. Vergiss nicht, das auch im CMS Tags und Klassen hinzugefügt werden können.
   5. Achtung! Mobiler responsive CSS Code sollte natürlich nicht entfernt werden.
   6. Wird es nirgends gebraucht -> raus damit.