Попытка понять, как отображать изображения с пользовательской темой Drupal

Я пытаюсь понять, как создать пользовательскую тему Drupal 8. У меня есть несколько вопросов по этому поводу, и я не могу найти реальный ответ в документации или где-то еще. Может кто-нибудь помочь мне, пожалуйста?

Я создал library.yml и theme_info.yml с этими данными:

name: Cosplay Academy
type: theme
description: 'A cuddly theme that offers extra fluffiness.'
core: 8.x
libraries:
- cosplayacademy/global-styling-and-scripts
regions:
  header: Header
  primary_menu: 'Primary menu'
  secondary_menu: 'Secondary menu'
  page_top: 'Page top'
  page_bottom: 'Page bottom'
  highlighted: Highlighted
  featured_top: 'Featured top'
  breadcrumb: Breadcrumb
  content: Content
  sidebar_first: 'Sidebar first'
  sidebar_second: 'Sidebar second'
  featured_bottom_first: 'Featured bottom first'
  featured_bottom_second: 'Featured bottom second'
  featured_bottom_third: 'Featured bottom third'
  footer_first: 'Footer first'
  footer_second: 'Footer second'
  footer_third: 'Footer third'
  footer_fourth: 'Footer fourth'
  footer_fifth: 'Footer fifth'
global-styling-and-scripts:
  version: VERSION
  css:
    theme:
      css/plugins/bootstrap.min.css: {}
      css/style.css: {}
      css/skin-modes.css: {}
      css/icons.css: {}
      css/plugins/horizontal-menu.css: {}
      css/colors/color6.css: {}

Я вижу свои css-файлы в своей html-разметке, но перед ними много css-файлов. Почему ? Могу ли я удалить их?

Кроме того, я пытаюсь отобразить изображение в data-image-src, и оно не отображается:/ Когда я смотрю на свою html-разметку и когда я копирую URL-адрес изображения, это работает, я это вижу, но я не вижу его на своей странице... я совсем потерялся :/

Как вы можете видеть ниже, мои файлы css загружаются в конце, и мое изображение не появляется...

Нет изображения на моей странице

Файлы CSS Drupal


person Christophe    schedule 29.11.2019    source источник


Ответы (2)


Дополнительные css-файлы
Дополнительные css-файлы, которые вы видите, добавляются ядром drupal и различными включенными модулями. Я вижу, какие файлы css включены, что вы вошли в систему при просмотре этой страницы, что, например, сделало панель инструментов css включенной на страницу. Большинство этих файлов css не будут включены при просмотре страницы в качестве анонимного пользователя.
Вам не следует беспокоиться об этом, при запуске сайта вы должны установить агрегацию css и javascript в настройках «производительности», быть объединены в несколько файлов и включать только то, что необходимо.

data-img-src:
я не уверен, чего вы ожидаете от добавления 'data-img-src' ??
Чтобы установить путь к изображению в теге img, вы просто используете атрибут 'src'.
Любой атрибут, начинающийся с 'data-', предназначен только для хранилища данных, которое, например, вы можете использовать с каким-нибудь javascript.

Дополнительная информация об атрибутах данных:
https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes
https://www.sitepoint.com/use-html5-data-attributes/
https://www.w3schools.com/tags/att_global_data.asp

person 2pha    schedule 29.11.2019

Что касается удаления таблиц стилей Drupal в вашей пользовательской теме... вы можете добавить что-то подобное в свой .info.yml

stylesheets-remove:
  - core/assets/vendor/normalize-css/normalize.css
  - core/modules/system/css/system.module.css
  - core/modules/system/css/system.theme.css
  - core/modules/views/css/views.module.css

чтобы их удалили.

person c1u31355    schedule 04.06.2020