Wie überschreibe ich das Admin-Thema in meinem eigenen Thema?

Ich habe mein eigenes Drupal 8-Thema erstellt:

mytheme.info.yml:

name: My Theme
description: 'Drupal 8 Theme'
type: theme
base theme: bartik
core: '8.x'

mytheme.libraries.yml

global-styling:
  version: 1.x
  css:
    theme:
      css/layout.css: {}
      css/style.css: {}
      css/colors.css: {}
      css/print.css: { media: print }

Ich benutze "Seven" als Admin-Thema.

Wenn ich eine Seite bearbeite (/ node / x / edit), werden sieben Themen verwendet.

Jetzt muss ich etwas CSS zum Bearbeitungsformular hinzufügen. Wie kann ich das machen? style.css wird nur auf Front-End-Seiten geladen. Seiten bearbeiten verwenden sieben Themen und mein Thema CSS wird ignoriert.

Wie kann ich Administrationsseiten CSS hinzufügen oder Formulare in Drupal 8 bearbeiten?

Sie können Admin-CSS über einen Modul-Hook hinzufügen. Ersetzen Sie XXX durch den Modulnamen.

1 Fügen Sie Ihr CSS in css / extra.admin.css ein

2 Deklarieren Sie eine Bibliothek, indem Sie XXX.libraries.yml erstellen

extra.admin:
  css:
    theme:
      css/extra.admin.css: {}

3 Erstellen Sie einen Hook zum Laden der Bibliothek.

/**
 * Implements hook_page_attachments().
 */
function XXX_page_attachments(array &$attachments) {
  $theme = \Drupal::theme()->getActiveTheme()->getName();
  if ($theme == 'seven') {
    $attachments['#attached']['library'][] = 'XXX/extra.admin';
  }
}

Sie können ein Thema nicht von einem anderen Thema aus steuern. Und selbst wenn ein kluger Entwickler einen hackigen Weg finden könnte, dies zu tun: Bitte nicht. Vertrau mir, du willst es nicht. Das Konzept der Trennung von Bedenken ist bei der Programmierung wichtig. Grundsätzlich bedeutet dies, dass die verschiedenen beweglichen Teile (dh Ihr Thema) Ihres Systems sich um ihre eigene Aufgabe kümmern sollten, ohne die Aufgaben anderer Teile (dh Ihres Administratorthemas) zu beeinträchtigen.

Um Ihr Ziel zu erreichen, ist es am saubersten, ein neues Thema zu erstellen, es zu einem Unterthema von Seven zu machen (damit es alles erbt, was Sie an Seven mögen) und Ihr benutzerdefiniertes CSS in die Mischung aufzunehmen. Jetzt können Sie dieses Thema anstelle von Sieben als Administrator-Thema auswählen.

Das Modul, das Sie suchen, heißt jetzt Asset Injector . Damit können Sie CSS über die Benutzeroberfläche hinzufügen, wie @Whatwatt erwähnt.

Wenn Sie ein Unterthema für Seven erstellen und dieses als Administratorthema verwenden, können Sie in der Datei Seven_subtheme.info.yml eigene CSS-Überschreibungen hinzufügen, ohne das Kernthema zu beeinträchtigen oder die Verantwortlichkeiten des Themas zu verwirren. Das Unterthema muss nur die Datei info.yml und das CSS enthalten und erbt alles andere.

• Unterthema erstellen
• Themengrundlagen (z. B. Hinzufügen von CSS zu Ihrem Thema)

Nach alledem geht es Ihnen jedoch hauptsächlich darum, das vom wysiwyg-Editor (ckeditor) verwendete CSS ckeditor_stylesheetszu ändern. Vielleicht möchten Sie stattdessen das Hinzufügen zu Ihrer info.yml-Datei in Betracht ziehen. Beachten Sie, dass, wie in dieser Ausgabe erläutert , die ckeditor-CSS tatsächlich aus Ihrem Thema hinzugefügt werden kann , da der wysiwyg-Editor standardmäßig die Nicht-Administrator-Themen-CSS verwenden sollte (denken Sie daran, die Caches nach dem Hinzufügen zu löschen).

• D8 How-to - Benutzerdefinierte Ckeditor-Stile

Installieren Sie das CSS Injector- Modul (derzeit gibt es nur eine funktionierende Entwicklungsversion für Drupal 8).

Gehen Sie dann zur Administrationsseite von CSS Injector ( / admin / config / development / css-injor ). Erstellen Sie eine neue CSS-Regel. So ändern Sie beispielsweise eine Feldhintergrundfarbe:

.node-form .field--name-title input {
    background-color: red;
}

Wählen Sie diese Regel auf das Seven- Thema (oder ein beliebiges verwendetes Admin-Thema) aus.

Speichern und genießen!

Um mit jedem Admin-Thema zu arbeiten, habe ich AdamS answer verwendet und den Hook in geändert.

$config = \Drupal::config('system.theme');

$theme = \Drupal::theme()->getActiveTheme()->getName();

if ($theme == $config->get('admin')) {

  $attachments['#attached']['library'][] = 'XXXX/extra.admin';

}

Warum nicht einen Block erstellen, der das CSS aufruft, und ihn in den Header Ihrer Administrationsseiten einfügen?

@import url ("/ theme / XYZ / css / admin_overrides.css")

Sie können Admin-CSS über einen Modul-Hook hinzufügen. Ersetzen Sie XXX durch den Modulnamen.

1 Fügen Sie Ihr CSS in css / extra.admin.css ein

2 Deklarieren Sie eine Bibliothek, indem Sie XXX.libraries.yml erstellen

extra.admin:
  css:
  theme:
  css/extra.admin.css: {}

3 Erstellen Sie einen Hook zum Laden der Bibliothek.

/ **
* Implementiert hook_page_attachments ().
* /

function XXX_page_attachments(array &$attachments) {
  $config = \Drupal::config('system.theme');
  $theme = \Drupal::theme()->getActiveTheme()->getName();
    if ($theme == $config->get('admin')) {
       $attachments['#attached']['library'][] = 'XXXX/extra.admin';
    }
 }

Ich würde ein separates untergeordnetes Thema für Front- und Backoffice erstellen