WordPress PHP, JS und CSS Workflow

Warum nicht in Child Theme und dann direkt mit sftp/Code Editor arbeiten?

  • Weil ich nicht bei allen von mir verwalteten WP-Websites sftp-Zugriff habe.
  • Einige Kunden nutzen shared Hosting Provider welche nicht für professionelle Entwicklungsarbeit gedacht sind. Da geht es mit meinem Setup trotzdem.
  • Der Mental Load ist kleiner, wenn ich überall das gleiche Setup nutze. Sicherheits- und Performance Nachteile sind keine vorhanden. Für PHP gibt es Konflikt- und integrierte Safemode Checks

WPCodeBox2: CSS und JS

Main Stylesheet

  • Frontend CSS
    • scss, frontend, external

Hier kommen alle Styles rein für Frontend-Ausagabe. Zur Vereinfachund kannst du alles in ein Main File packen und dann mit partials arbeiten. Es ist ok, dass die Styles auch in Datenbank gespeichert werden. Wichtig ist nur, dass die Ausgabe auf external ist. Verzichte auf ein „Functionality Plugin“ – sonst musst du nach einer Anpassung in einem partial immer noch das Main Stylesheet auswählen und neu generieren.

Backend Stylesheet

  • Backend CSS
    • scss, admin und login, external

Hier kommen alle Styles rein für unter anderem folgende Aufgaben:

  • Editor Buttons
  • Widgets anpassen
  • Werbung ausblenden
  • ACF Felder Styling
  • Login Styles

Editor Stylesheet

  • Editor CSS
    • scss, frontend und admin, external
  • Du kannst partials nutzen, wenn du auf Folder-Sync verzichtest. Sonst nicht.

Damit Styles im Editor + Frontend fuktionieren, muss jeweils die Klasse mit .editor-styles-wrapper mit zugehörigem Selektor für Editor und einmal ohne Editor Targeting eingefügt werden. Es ist einfacher, dass alles direkt in einem File steht anstatt in Frontend CSS und einmal in Editor CSS.

CSS
.editor-styles-wrapper .has-large-font-size,
.has-large-font-size  {
     color: red;
}

Frontend JS

Für Accordions, Slider, DOM Manipulation etc. Jedoch immer losgelöst von Queries, AJAX etc. Hier wirklich nur schnelle Quickfixes einbinden. Rest in PHP File direkt.

Fluent Snippets: PHP, Shortcodes mit JS und Tracking Skripte

Wird lokal in wp-content in fluent-snippet-storage Ordner gespeichert.
Kann als Standalone ohne Fluent Snippets Plugin genutzt werden.

  • Queries
  • WP Tweaks
  • Projektcode
  • Shortcode mit AJAX
  • ACF Code
  • Tracking Skripte