2.8. Image - Работа с изображениями, пресеты.

Друпал умеет работать, не только с текстовыми страницами, но и с изображениями. Для этого вам нужно включить модуль Image. Модуль image позволяет прикреплять фотографии к нодам и выводить эти фотографии нужным нам размером. Причем в разных местах эти размеры могут отличаться. Так например в тизере ноды мы можем сделать маленькую фотографию, а в полной ноде уже большую.

В прошлых уроках мы создавали тип материала Сотрудник. Давайте откроем управление полями типа материала Сотрудник и добавим поле изображения.

поле сотрудник

Теперь в форме создания/редактирования сотрудника будет поле загрузки изображения:

фото сотрудника

Это изображение будет выводится на странице сотрудника, но в оригинальном размере и с лейблом поле Изображение. Чтобы настроить вывод, нужно перейти во вкладку вывод, в настройках типа материала Сотрудник.

настройка полей Drupal

Давайте переместим поле изображение наверх, уберем вывод названия поля и нажмем на шестеренку (настройки), чтобы выставить размер выводимого изображение. По умолчанию у нас уже есть размеры - пресеты: Large (480x480), Medium (220x220), Thumbnail (100x100). Давайте поставим для анонса Thumbnail, а для полной ноды Medium. Также в анонсе мы поставим, чтобы картинка была ссылкой на ноду сотрудника:

поле изображения Друпал

 Теперь в списках анонсов сотрудники будут ссылкой на полную страницу сотрудника.

Также помимо уже готовых пресетов Large, Medium, Thumbnail можно создать и свои размеры для изображений. Давайте зайдем на страницу Настройка - Виды показа изображений

/admin/config/media/image-styles

Там вы увидите уже существующие пресеты и кнопку добавить новый:

виды показа изображений друпал

Пусть он будет 150x150 пикселей и назовем его также, чтобы было проще ориентироваться. На странице редактирования пресета мы видим действия которые можно добавить:

пресеты drupal

Crop (обрезка) - просто обрезает фотографию без масштабирования.
Обесцвечивания - делает фотографию черно-белой.
Изменение размера - изменяет размер без сохранения пропорций.
Вращение - поворачивает фотографию на нужний угол.
Масштабирование - изменяет размер с сохранением пропорций.
Масштабирование и обрезка - изменяет размер с сохранением пропорций, а потом обрезает по большей стороне.

Можно выбирать несколько действий, например давайте сделаем Масштабирование 150x150, а потом сделаем фотографию черно-белой.

Масштабирование:

масштабирование изображение друпал

Должно получится вот так:

image drupal

Теперь давайте вернемся на страницу управления отображения полей и поставим для анонса сотрудника вывод поля изображения через пресет 150x150.

новый пресет drupal

 

Теперь анонс сотрудника будет выглядеть вот так:

друпал анонс

Теперь вы знаете как загружать фотографии в друпале и как их выводить нужным вам образом. В следующих уроках мы разберем как сделать фотогалерею подобным способом.

 

 

 

 

Комментарии

Добавить комментарий

Войти, используя Loginza Google Account Yandex Mail.ru Vkontakte Facebook

Plain text

  • HTML-теги не обрабатываются и показываются как обычный текст
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Строки и параграфы переносятся автоматически.

Здравствуйте!

Здравствуйте!
При загрузке изображения не происходит транслитерации названия картинки. Если у изображения название было на русском, то загружается так же с русскими буквами. Это ошибка в самом друпале или я что то не правильно настроил?

Я думаю нужен модуль

Я думаю нужен модуль transliteration, друпал из коробки не транслитерирует название файлов:
https://www.drupal.org/project/transliteration

Хотя вот здесь пишут, что эта функция уже в ядре друпала:
https://www.drupal.org/documentation/modules/transliteration 
https://www.drupal.org/node/1842748

Наверно это пофиксят в ближайшее время.

Вот этот модуль можете попробовать, возможно он поможет:
https://www.drupal.org/project/filefield_paths 

Друпал 8 из коробки

Друпал 8 из коробки транслитерирует все, кроме имен файлов.
https://www.drupal.org/project/filefield_paths - этот модуль тоже работает с ошибками.
Возможно исправят, но пока с именами изображений проблема.

А можно немного поточнее, где

А можно немного поточнее, где именно этот css. Как он называется? И еще один вопрос, это в дальнейшем будет каксаться всех материалов, или только какого то определенного? Извеняюсь что столько вопросов, 3 день только изучаю drupal, но сразу на реальном поекте.

Еще одна ошибка с

Еще одна ошибка с изображениями. При редактировании материала удаляю изображение которое было загружено ранее. Из материала удаляется, но в папке с файлами остается. И при удалении материала, изображение не удаляется из папки на сервере. Кто знает как это исправить?

пробую на чистом друпале.

пробую на чистом друпале. Загружаю картинку в материал, сохраняю. Затем открываю на редактирование, удаляю изображение, сохраняю материал. Картинка в папке с изображениями осталась.
Запускаю cron. Проверяю папку - картинка не удалилась.