Làm cách nào để tải (các) kiểu chủ đề trong CKEditor?

9

Trong Drupal 8, làm cách nào để CKEditor tải các biểu định kiểu bổ sung khi sử dụng định dạng bộ lọc được định cấu hình? Trong Drupal 7, bạn có thể cung cấp các đường dẫn mô-đun WYSIWYG cho các trang CSS để tải, điều này làm cho văn bản soạn thảo phản ánh chủ đề nhiều nhất có thể. Tôi không thấy tùy chọn này.

8 wysiwyg

— Kevin
nguồn

10

Đây là một cách để làm điều đó ... không chắc chắn nếu có người khác (dựa trên quản trị viên):

/**
 * Implements hook_ckeditor_css_alter().
 *
 * Injects our CSS sheets anytime CKEditor has loaded.
 *
 * @param array $css
 * @param Drupal\editor\Entity\Editor $editor
 */
function mymodule_ckeditor_css_alter(array &$css, Editor $editor) {
  if (!$editor->hasAssociatedFilterFormat()) {
    return;
  }

  $known_formats = [
    'basic_html',
    'full_html'
  ];

  if (in_array($editor->getFilterFormat()->id(), $known_formats)) {
    $css[] = drupal_get_path('theme', 'mytheme') . '/build/css/style.css';
  }
}

— Kevin
nguồn

3

trước chức năng, sử dụng Drupal \ Editor \ Entity \ Editor; là cần thiết.

— user780

9

Trừ khi bạn muốn tải các kiểu cho các định dạng cụ thể, bạn có thể dễ dàng thêm CSS trong MODULE.info.ymltệp của mình , như vậy:

ckeditor_stylesheets:
  - css/application.css
  - css/ckeditor.css

Sử dụng các @importcâu lệnh bên trong một trong các bảng định kiểu để lấy các bảng định kiểu bên ngoài không có trong chủ đề của bạn:

/* in css/ckeditor.css */
@import url('//mycdn.com/myfonts.css');
@import url('/path/to/drupal/module/styles.css');

— Steven
nguồn

2

Tôi đã phát hiện ra một cách giải quyết để bao gồm các bảng định kiểu bên ngoài bằng cách sử dụng một @importcâu lệnh.

— JamesWilson

1

Có, bạn có thể sử dụng nhập CSS tiêu chuẩn@import url("http://example.com/file.css");

— Steven

2

Đây là một giải pháp đơn giản cho việc này trong Drupal 8, khi bạn đang sử dụng một chủ đề tùy chỉnh hoặc chủ đề quản trị viên tùy chỉnh.

Mở tệp thông tin chủ đề tùy chỉnh của bạn * .info.yml và thêm dòng ở trên librarieshoặc bên dưới base_theme.
```
ckeditor_stylesheets:
  - css/ckeditor.css
```
Tạo một tập tin ckeditor.css trong css/thư mục.
Viết CSS của bạn trong tệp đó và các kiểu sẽ được áp dụng cho CKEditor.

— Someshver Thakur
nguồn