Ist es jemals in Ordnung, Inline-CSS in Plugins zu integrieren?

21

Normalerweise würde ich in einem Plugin Stile mit wp_enqueue_style hinzufügen. Ich erstelle jedoch gerade ein Plugin, das nur einige Zeilen CSS benötigt, und frage mich, ob es möglicherweise besser ist, die Stile inline bereitzustellen, um eine Anfrage zu speichern. Natürlich hat die Verwendung von wp_enqueue_style viele Vorteile, aber lohnt sich die zusätzliche Anfrage für ein so kleines Stück CSS? Gibt es in diesem Bereich anerkannte bewährte Verfahren?

plugin-development css customization wp-enqueue-style Dustin
quelle

Antworten:

14

TL; DR; Enqueue

Externes Stylesheet verwenden

  • PRO: Alle Ihre Stile sind an einem Ort.
  • PRO: Reduziert die Webseitencodierung.
  • PRO: Einfachere Wartung des Plugins.
  • PRO: Kann Hooks verwenden, um den Speicherort der Datei zu ändern.
  • PRO: Kann Hooks verwenden, um die Datei zu entschlüsseln.
  • PRO: Kann Stile automatisch verkleinern.
  • CON: Könnte zusätzliche HTTP-Anforderung hinzufügen (kann überwunden werden).

Inline-Stile verwenden

  • PRO: Kann den angewendeten Stil direkt sehen.
  • PRO: Keine zusätzlichen HTTP-Anforderungen.
  • CON: Kann keine Hooks verwenden, um die Stile zu ändern.
  • CON: Kann keine Hooks verwenden, um die Stile zu entschlüsseln.
  • CON: Stile können überhaupt nicht verkleinert werden.
  • CON: Need ! Wichtig, um den Stil zu überschreiben

Normalerweise würde ich sagen: Sicher, wenn Sie der einzige sind, der es verwendet, machen Sie es inline. Sie sprechen jedoch von einem Plugin, das bedeutet, dass der Code öffentlich sein wird, also streben Sie Erweiterbarkeit an. Im Moment haben Sie nur ein paar Styling-Linien:

  • CON: Was ist, wenn diese wenigen mehr werden?
  • CON: Was ist, wenn jemand dein Plugin erweitert?
  • CON: Was ist, wenn jemand es ändern möchte?
  • CON: Was ist, wenn jemand in CSS-Dateien danach sucht?
  • CON: Was ist, wenn jemand es automatisch minimieren möchte?

Deshalb in die Warteschlange stellen. (Vorzugsweise nur bedingt, wenn das Plugin es benötigt.) Gleiches gilt für JavaScript . (Das sollte aber wenn möglich in der Fußzeile stehen.)

Derk-Jan
quelle
Ist es in Ordnung, Inline-Stile im Backend zu verwenden?
Shea
@bungeshea Wenn jemand Ihr Plugin ändern möchte, kann es sein, dass er das Backend auch nach rechts ändern möchte;) Stellen Sie nur sicher, dass Sie das Skript nur im Backend in die Warteschlange stellen. Zum Beispiel: function _your_enqueue( $hook )kann $ hook testen, um zu sehen, ob Sie auf Ihrer Optionsseite sind. Alternativ können Sie current_screen()für einfachere Eigenschaften verwenden. Das ist zwar erlaubt, aber die allgemeine Verwendung ist, dass ein Plugin aus einer .php-Datei für serverseitigen Code besteht und möglicherweise Images, .js- und .css-Dateien enthält oder nicht.
Derk-
1
Sie stellen fest, dass die zusätzliche http-Anforderung überwunden werden kann - können Sie dies klären?
Dustin
2
Sie können nicht, aber der Benutzer des Plugins kann. Es gibt mehrere Plugins und Funktionen, in die geschrieben wird, kurz bevor die Seite ausgegeben wird, um ALLE in die Warteschlange eingereihten Stile abzurufen und sie einer verkleinerten, kombinierten Datei hinzuzufügen. Unabhängig davon, wie viele CSS-Dateien Sie hinzufügen, wird dem Betrachter nur eine angezeigt. Gleiches gilt für Javascript. Dies ist jedoch in Ihrem Fall nicht Ihr "Problem". Es ist eine Optimierung, die nicht benötigt wird, und imho, die zusätzliche HTTP-Anfrage ist nicht ausreichend für alle PROs.
Derk-
1
Zum letzten Satz - AFAIK-Stile sollten in der Kopfzeile und nicht in der Fußzeile ausgegeben werden
Mark Kaplun
2

Dies ist schwer zu beantworten und ich bin mir nicht sicher, ob es eine offizielle Antwort gibt.

Ich verstehe das Gefühl, eine Anfrage zu speichern, aber der Inline-Stil gewinnt so ziemlich immer. Ein Thema oder Endbenutzer wird es schwer haben, Ihr CSS zu ändern.

In diesem Sinne würde ich das wohl in einem öffentlich veröffentlichten Plugin tun ...

  1. ob das CSS für die Funktionsweise des Plugins absolut kritisch ist , wie dies beispielsweise bei Diashows der Fall ist.

  2. Oder wenn ich auch einen Filter in das Plugin aufgenommen habe, mit dem das Inline-CSS geändert oder entfernt werden kann.

s_ha_dum
quelle