Bagaimana cara mengganti tema admin dengan tema saya sendiri?

9

Saya membuat tema Drupal 8 saya sendiri:

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 }

Saya menggunakan "Tujuh" sebagai tema admin.

Ketika saya mengedit halaman (/ node / x / edit) Tujuh tema digunakan.

Sekarang saya harus menambahkan beberapa CSS formulir edit. Bagaimana saya bisa melakukan ini? style.css hanya dimuat di halaman ujung depan. Edit halaman menggunakan tujuh tema dan CSS tema saya diabaikan.

Bagaimana saya bisa menambahkan beberapa CSS ke halaman admin atau mengedit formulir di Drupal 8?

drupalfan
sumber

Jawaban:

17

Anda dapat menambahkan admin CSS dari pengait modul. Ganti XXX dengan nama modul.

1 Masukkan CSS Anda di css / extra.admin.css

2 Nyatakan perpustakaan dengan membuat XXX.libraries.yml

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

3 Buat pengait untuk memuat perpustakaan.

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

Anda tidak dapat mengontrol satu tema dari dalam tema lain. Dan bahkan jika beberapa pengembang pintar dapat menemukan cara hack untuk melakukannya: tolong jangan. Percayalah, Anda tidak menginginkannya. Konsep pemisahan masalah penting dalam pemrograman. Pada dasarnya itu berarti bahwa bagian-bagian bergerak yang berbeda (yaitu tema Anda) dari sistem Anda harus mengurus tugas mereka sendiri, tanpa mengganggu tugas-tugas bagian lain (yaitu tema admin Anda).

Untuk mencapai tujuan Anda, cara terbersih adalah membuat tema baru, menjadikannya subtema Tujuh (sehingga mewarisi semua yang Anda sukai tentang Tujuh) dan menambahkan CSS khusus ke dalam campuran. Sekarang Anda dapat memilih tema itu sebagai tema admin Anda alih-alih Tujuh.

marcvangend
sumber
Maaf, saya tidak percaya bahwa tidak ada cara untuk menyelesaikan ini. Saya hanya perlu menambahkan beberapa CSS seperti img {max-width: 100%; tinggi: otomatis}. Pasti ada jalan.
drupalfan
4
Tidak, tidak boleh ada. Tema tidak dimaksudkan untuk bercampur. Hanya ada satu tema aktif. Jika Anda perlu melakukannya, buat modul, yang bisa mengimplementasikan perubahan bentuk dan menambahkan perpustakaan lain.
Berdir
3
@drupalfan, saya tidak mengerti mengapa Anda menyimpulkan tidak ada cara untuk menyelesaikan ini. Ada beberapa cara (metode Tujuh-subtema yang saya jelaskan, dan metode Berdir) dan tidak sulit untuk dilakukan. Jenis solusi yang Anda sarankan, seperti meminta penata rambut untuk mengubah warna sepatu Anda. Jangan lakukan itu.
marcvangend
2
I do not want to mix themes, I only want to add one simple CSS!yang dianggap pencampuran di Drupal. Satu-satunya pilihan yang Anda miliki adalah membuat subtitle dari Seven atau "meretas" tujuh tema yang ada di /core/themes/dalamnya, tetapi Anda akan kehilangan perubahan setiap kali Anda memutakhirkan drupal 8. Jadi, Anda harus ingat untuk mengunggah file .css yang diganti setiap kali Anda meningkatkan D8. Oleh karena itu, Anda lebih baik membuat sub tema Tujuh dan menggunakannya sebagai tema admin Anda, karena subtema akan terletak di /themesfolder dan tidak di dalam /core/themes.
Tidak ada Sssweat
1
@ Joum Apa yang Anda jelaskan, sangat berbeda. OP bertanya tentang membiarkan satu tema mempengaruhi tema lain. Itu adalah memadukan tanggung jawab, terutama karena dua tema tidak pernah bisa aktif di halaman yang sama. Mengirimkan beberapa CSS dengan modul adalah IMO yang sangat normal - tetap saja ringan, tidak dapat ditanggulangi, dan sangat fokus pada apa pun yang dilakukan modul Anda.
marcvangend
5

Modul yang Anda cari sekarang disebut Asset Injector . Dengan itu Anda akan dapat menambahkan CSS melalui UI seperti yang disebutkan @Whatwatt.

chrisshattuck
sumber
4

Jika Anda membuat subtitle untuk Seven, dan menggunakannya sebagai tema admin Anda, Anda bisa menambahkan override css Anda sendiri di file seven_subtheme.info.yml, tanpa mengacaukan tema inti, atau membingungkan tanggung jawab tema. Subtema hanya perlu memiliki file info.yml dan css, dan akan mewarisi yang lainnya.

Dari bunyi-bunyinya, Anda terutama khawatir dengan mengubah css yang digunakan oleh editor wysiwyg (ckeditor), jadi Anda mungkin ingin melihat menambahkan ckeditor_stylesheetske file info.yml Anda. Perhatikan bahwa, seperti dijelaskan dalam masalah ini , ckeditor css memang dapat ditambahkan dari tema Anda , karena editor wysiwyg harus menggunakan tema css non-admin secara default (ingat untuk menghapus cache setelah menambahkan ini).

autopoietic
sumber
Jawaban yang tepat. Inilah cara untuk melakukannya.
Kevin
3

Instal modul CSS Injector (saat ini hanya ada versi pengembangan yang berfungsi untuk Drupal 8).

Kemudian pergi ke halaman administrasi CSS Injector ( / admin / config / development / css-injector ). Buat aturan CSS baru. Misalnya, untuk mengubah warna latar belakang bidang:

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

Pilih untuk menerapkan aturan ini pada Tujuh tema (atau tema admin apa pun yang digunakan).

Simpan dan nikmatilah!

Whatwatt
sumber
>> Bagaimana saya bisa menambahkan beberapa CSS ke halaman admin atau mengedit formulir di Drupal 8?
drupalfan
Saya memperbarui jawaban saya, maaf atas kesalahan saya (saya menjawab topik lain!)
Whatwatt
1

Untuk bekerja dengan tema admin apa pun saya menggunakan jawaban AdamS dan mengubah kail ke.

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

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

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

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

}
Sean
sumber
1

Mengapa tidak membuat blok yang memanggil css dan memasukkannya ke header halaman admin Anda?

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

Molesworth
sumber
1

Anda dapat menambahkan admin CSS dari pengait modul. Ganti XXX dengan nama modul.

1 Masukkan CSS Anda di css / extra.admin.css

2 Nyatakan perpustakaan dengan membuat XXX.libraries.yml

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

3 Buat pengait untuk memuat perpustakaan.

/ **
* Menerapkan 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';
    }
 }
dev
sumber
0

saya akan membuat tema anak terpisah untuk kantor depan dan belakang

Matoeil
sumber
Tapi ini agak membingungkan: skyriter.com/2018/04/07/...
eye-wonder
tuto ini berumur 2 tahun. tema admin chid bekerja secara smootlhly. Tambahkan perpustakaan untuk itu untuk css atau js Anda dan ini dia
Matoeil