내 테마에서 관리자 테마를 어떻게 재정의합니까?

내 Drupal 8 테마를 만들었습니다.

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 }

"Seven"을 관리자 테마로 사용하고 있습니다.

페이지 (/ node / x / edit)를 편집 할 때 Seven 테마가 사용됩니다.

이제 CSS에 편집 양식을 추가해야합니다. 어떻게해야합니까? style.css는 프런트 엔드 페이지에만로드됩니다. 편집 페이지는 7 개의 테마를 사용하며 내 테마 CSS는 무시됩니다.

Drupal 8에서 CSS를 관리자 페이지에 추가하거나 양식을 편집하려면 어떻게해야합니까?

모듈 후크에서 관리자 CSS를 추가 할 수 있습니다. XXX를 모듈 이름으로 바꾸십시오.

1 CSS를 css / extra.admin.css에 넣으십시오

2 XXX.libraries.yml을 만들어 라이브러리를 선언하십시오.

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

3 라이브러리를로드하기위한 후크를 만듭니다.

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

한 테마를 다른 테마 내에서 제어 할 수 없습니다. 그리고 어떤 똑똑한 개발자가 그것을 해킹 할 수있는 방법을 찾을 수 있더라도 그렇게하지 마십시오. 날 믿어, 넌 원하지 않아 관심사 분리 개념은 프로그래밍에서 중요합니다. 기본적으로 시스템의 다른 움직이는 부분 (예 : 테마)은 다른 부분 (예 : 관리자 테마)의 작업을 방해하지 않고 자체 작업을 처리해야 함을 의미합니다.

목표를 달성하기 위해 가장 깨끗한 방법은 새로운 테마를 만들고 7의 하위 테마로 만들고 (7과 관련하여 원하는 모든 것을 상속 함) 사용자 정의 CSS를 믹스에 추가하는 것입니다. 이제 해당 테마를 Seven 대신 관리자 테마로 선택할 수 있습니다.

찾고있는 모듈은 이제 Asset Injector 라고 합니다. 이를 통해 @Whatwatt가 언급 한 것처럼 UI를 통해 CSS를 추가 할 수 있습니다.

Seven에 대한 하위 테마를 작성하고이를 관리자 테마로 사용하는 경우 핵심 테마를 혼란 시키거나 테마 책임을 혼동하지 않고 seven_subtheme.info.yml 파일에 자신의 CSS 대체를 추가 할 수 있습니다. 하위 테마에는 info.yml 파일과 CSS 만 있으면되며 다른 모든 항목을 상속합니다.

• 하위 테마 만들기
• 테마 기본 사항 (예 : 테마에 CSS 추가)

그러나 그 소리에서 주로 wysiwyg 편집기 (ckeditor)가 사용하는 CSS를 변경하는 데 관심이 있으므로 ckeditor_stylesheetsinfo.yml 파일 에 추가하는 것이 좋습니다. 에 설명 된대로 참고 이 문제 는 ckeditor의 CSS는 사실에서 추가 할 수 있습니다 귀하의 기본적으로 관리자가 아닌 테마 CSS를 사용한다 WYSIWYG 편집기로, 주제 (이를 추가 한 후 캐시 지우기로 기억).

• D8 사용 방법-사용자 정의 ckeditor 스타일

CSS Injector 모듈을 설치하십시오 (현재 Drupal 8의 개발 버전 만 있습니다).

그런 다음 CSS Injector ( / admin / config / development / css-injector ) 의 관리 페이지로 이동하십시오 . 새로운 CSS 규칙을 만듭니다. 예를 들어 필드 배경색을 변경하려면

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

이 규칙을 7 가지 테마 (또는 사용중인 모든 관리자 테마)에 적용하도록 선택하십시오 .

저장하고 즐기십시오!

모든 관리자 테마로 작업하기 위해 AdamS answer를 사용하고 후크를 변경했습니다.

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

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

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

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

}

CSS를 호출하는 블록을 작성하여 관리자 페이지의 헤더에 삽입하십시오.

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

모듈 후크에서 관리자 CSS를 추가 할 수 있습니다. XXX를 모듈 이름으로 바꾸십시오.

1 CSS를 css / extra.admin.css에 넣으십시오

2 XXX.libraries.yml을 만들어 라이브러리를 선언하십시오.

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

3 라이브러리를로드하기위한 후크를 만듭니다.

/ **
* 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';
    }
 }

프론트 오피스와 백 오피스에 대해 별도의 하위 테마를 작성합니다.