Drupal и Программирование: истории из жизни, советы, новости, юмор — Горячее, страница 2

0

DELETED

3 года назад

Экспорт контента в Drupal 8⁠⁠

Экспортировать контент будем через представление в CSV файл.

Устанавливаем модуль Views data export:

composer require drupal/views_data_export ; drush en views_data_export -y

Создаем представление для экспорта:

/admin/structure/views/add

Пишем название, машинное имя и выбираем что экспортировать:

Содержимое или Термины таксономии.

Пропускаем создание страницы/блока и жмем кнопку Сохранить и редактировать.

Нажимаем кнопку добавить и выбираем «Экспорт данных»

Экспорт контента в Drupal 8 Разработка, Программирование, IT, Программист, Drupal, Backend, Экспорт, Контент, Софт, Views, Web, Web-программирование, Data

Теперь необходимо:

- В настройках формата указать расширение файла — советую использовать CSV;

- Добавить поля — одно поле соответствует одному столбцу. Где метка поля — заголовок столбца;

- Настроить критерии фильтрации/сортировки — тип материала, словарь таксономии и так далее;

- Указать путь — URL по которому будет скачиваться файл;

- Доступ — поменять «Право доступа» на «Роль → Администратор» чтобы только вы могли выгружать данные;

- Поменять количество элементов для отображения на «Отображать все элементы»;

- Поменять машинное имя блока представления.

Для экспорта поля с изображением используйте средство форматирования «URL к изображению». После, скачайте изображения вручную через FTP.

Мой пример: Экспорт статей блога.

Вот и все. Остается только перейти по указанному вами пути и скачать файл.

В моем примере я в адресной строке введу следующее:

mysite.com/export_articles

Показать полностью 2

[моё] Разработка Программирование IT Программист Drupal Backend Экспорт Контент Софт Views Web Web-программирование Data

2

DELETED

3 года назад

Ручная обрезка картинок в Drupal 8⁠⁠

Зачем?

- Вам необходимо загрузить фотографию на сайт;

- Эта фотография должна быть квадратной, либо иметь другие четко заданные соотношения сторон;

- Стиль изображения обрезает фотографии в неподходящих местах.

Ручная обрезка картинок в Drupal 8 Разработка, Программирование, IT, Программист, Images, Drupal, Обучение, Crop, Обрезка, Урок, Backend, Web, Web-программирование, Учеба, Образование, Софт, Free Software, Длиннопост

Масштабирование и обрезка (300x300)

Установка Image Widget Crop

Ставим модуль через композер:

composer require drupal/image_widget_crop

Включаем через drush:

drush en image_widget_crop -y

Настройка Crop

Заходим на страницу списка типов обрезки:

/admin/config/media/crop

И добавляем новый тип:

Страница добавления нового crop type

- Aspect Ratio — в каких пропорциях пользователь будет обрезать изображение.

- Мягкий предел — если пользователь обрежет изображение меньше указанной ширины/высоты — сайт выдаст предупреждение.

- Жесткий предел — не позволяет пользователю обрезать изображение меньше указанной ширины/высоты.

Настройка стиля изображения

Добавляем в стиль изображения наш Crop type:

Manual crop должен быть первым. И только потом масштабирование и обрезка.

Настройка управления отображения формы

Заходим в настройки управления отображения формы сущности, которая выводит изображение. У меня это тип материала «Статья».

Для того чтобы появились эти настройки — поменяйте виджет с «Изображение» на «ImageWidget crop»

И в настройках поля выбираем Crop Type.

Не забудьте указать этот стиль изображения в управлении отображением.

Тестирование

Заходим в редактирование ноды/блока/термина таксономии:

Дальше все просто.

И указываем область обрезки изображения самостоятельно.

Результат

Если изображение плохого качества — проверьте «Жесткий лимит» в настройках Crop Type.

Показать полностью 5

[моё] Разработка Программирование IT Программист Images Drupal Обучение Crop Обрезка Урок Backend Web Web-программирование Учеба Образование Софт Free Software Длиннопост

1

DELETED

3 года назад

Удобство заполнения материалов в Drupal 8⁠⁠

Когда в типе материала очень много полей, редактору сложно ориентироваться:

Что нужно сделать?

- Скрыть ненужные поля:

- Сгруппировать нужные поля;

- Настроить режим отображения поля параграфа: свернут/несвернут, добавляются через кнопки или селект.

Убрать лишнее

Все то, что не понадобится в процессе заполнения страницы следует убрать: Language, Автор, Помещено на главную страницу, Закреплять вверху списков.

Группировка полей

- Устанавливаем и включаем модуль Field Group;

- Переходим в «Управление отображением формы»;

- Жмем кнопку «Добавить группу».

- Выбираем и добавляем «Tabs» — это будет контейнер для всех вкладок;

- Аналогично добавляем несколько «Tab» — это уже сами вкладки.

Что куда помещать — решайте сами. Лично я либо пытаюсь примерно скопировать ту структуру, которую видят все пользователи, либо просто объединить схожие элементы.

Результат

Показать полностью 2

[моё] Разработка Программирование IT Программист Drupal Поле Group Tabs Backend Web-программирование Web Веб-разработка Разработчики Обучение Урок Гайд Удобство Ui Develop Длиннопост

4

DELETED

3 года назад

Настройка мобильного меню в Drupal 8 / Responsive and off-canvas menu⁠⁠

Рассмотрим один из самых простых способов создать мобильное меню в Drupal 8. Для этого используем модуль Responsive and off-canvas menu.

Устанавливаем через Composer:

composer require drupal/responsive_menu ; drush en responsive_menu -y

Скачиваем библиотеку mmenu.

cd ~/site_root/libraries/ ; git clone https://github.com/FrDH/jQuery.mmenu.git && mv jQuery.mmenu mmenu

Правильней было бы ставить библиотеку через композер, но мы сэкономим время и просто клонируем библиотеку в папку libraries.

Переходим на страницу настроек модуля «Responsive Menu»:

/admin/config/user-interface/responsive-menu

В разделе OFF CANVAS указываем машинное имя меню.

Настройка мобильного меню в Drupal 8 / Responsive and off-canvas menu Разработка, Программирование, IT, Программист, Обучение, Урок, Drupal, Backend, Меню, Мобильное, Hamburger, Web, Web-программирование, Frontend, Jquery, Модуль

Если нужна «Основная навигация» — оставляйте main.

Остальные настройки можно оставить по умолчанию.

Переходим на страницу «Схема блоков»:

/admin/structure/block

Располагаем в нужном регионе гамбургер:

Название блока с гамбургером — Responsive menu mobile icon

Переходим на главную страницу и нажимаем на гамбургер.

На ширине 320px мобильное меню будет выглядеть так

Показать полностью 2

[моё] Разработка Программирование IT Программист Обучение Урок Drupal Backend Меню Мобильное Hamburger Web Web-программирование Frontend Jquery Модуль

3

DELETED

3 года назад

Базовая настройка Sublime Text 3⁠⁠

Я использую саблайм только если нужно очень быстро отредактировать какой-нибудь файл, либо что-то поправить на удаленном сервере. Во всех остальных случаях, советую пользоваться PHPStorm.

Устанавливаем Package Control

Tools → Install Package Control…

Базовая настройка Sublime Text 3 Программирование, Разработка, IT, Drupal, Sublime text 3, Editor, Программист, Софт, Free Software, Обучение, Гайд, Урок, Backend, Frontend, Редактор, Текстовый редактор, Ftp, Extension

Устанавливаем плагины

В меню: Preferences → Package Control

И выбираем Install Package

Устанавливаем следующие расширения:

- Emmet — позволит не писать код вручную;

- SCSS — если используете этот препроцессор;

- SFTP — для того чтобы иметь возможность подключаться к удаленным серверам.

В принципе все. Оказалось куда короче, чем я ожидал.

Если вы используете Sublime для разработки на друпал или верстки — пишите: какие еще полезные вещи можно внедрить.

Показать полностью 1

[моё] Программирование Разработка IT Drupal Sublime text 3 Editor Программист Софт Free Software Обучение Гайд Урок Backend Frontend Редактор Текстовый редактор Ftp Extension

2

DELETED

3 года назад

Настройка переменной trusted_host_patterns / Drupal 8⁠⁠

На странице Отчёт о состоянии:

/admin/reports/status

Можно увидеть такую ошибку:

Настройка переменной trusted_host_patterns / Drupal 8 Программирование, IT, Разработка, Программист, Host, Drupal, Backend, Cms, Settings

Открываем файл settings.php

sites/default/settings.php

Нажимаем CTRL + F5 и ищем: trusted_host_patterns

- Копируем подходящий шаблон;

- Вставляем переменную после комментария;

- Меняем example.com на домен своего сайта.

$settings['trusted_host_patterns'] = array(
'^www\.drupal\.org$',
'^drupal\.org$',
);

Сохраняем файл. Если сайт выдает ошибку о нехватке прав — прописываем в терминале команду:

chmod 755 settings.php

Показать полностью 1

[моё] Программирование IT Разработка Программист Host Drupal Backend Cms Settings

1

DELETED

3 года назад

Создание водяного знака / Drupal 8⁠⁠

Устанавливаем модуль Image Effects:

composer require drupal/image_effects ; drush en image_effects -y

Закачиваем водяной знак. Я положу его в папку:

sites/default/files/custom/watermark/test-watermark.png

Так выглядит мой водяной знак

Создание водяного знака / Drupal 8 Разработка, Программирование, IT, Программист, Вотермарки, Обучение, Урок, Drupal, Backend, Web, Web-программирование, Учеба, Длиннопост

Создаем или редактируем стиль изображения. Добавляем новый эффект «Водяной знак».

Выстраиваем следующие настройки:

Рисунок водяного знака: Путь к файлу водяного знака;

Watermark resize: Я ставлю только ширину, высота высчитывается автоматически;

Положение: По центру по умолчанию.

Сохраняем.

Не забываем присвоить этот стиль изображения нужному изображению. В моем случае — это картинка анонса новости.

Результат:

До:

После:

Показать полностью 5

[моё] Разработка Программирование IT Программист Вотермарки Обучение Урок Drupal Backend Web Web-программирование Учеба Длиннопост

0

1

DELETED

3 года назад

Переопределение шаблона twig в Drupal 8⁠⁠

Предположим, вам нужно создать параграф, который должен выглядеть вот так:

В большинстве случаев набор полей будет таким:

Нам нужно, чтобы картинка располагалась справа. Есть множество способов этого добиться, но сейчас мы рассмотрим twig.

Для того чтобы переопределить шаблон этого параграфа — в теме, в папке templates нужно создать файл:

paragraph--машинное_имя_параграфа--режим_отображения.html.twig

В моем случае, файл будет называться:

paragraph--title_and_text_and_image--block.html.twig

Теперь можно править разметку.

<div class="titleAndTextAndImage">
<div class="titleAndTextAndImage__content">
<div class="titleAndTextAndImage__title">
{{ content.field_title[0] }}
</div>
<div class="titleAndTextAndImage__body">
{{ content.field_body[0] }}
</div>
</div>
<div class="titleAndTextAndImage__image">
{{ content.field_image[0] }}
</div>
</div>

Поле выводим так:

{{ content.машинное_имя_поля }}

А если нам нужно получить только сырое значение:

{{ content.машинное_имя_поля[0] }}

Важно помнить, что если в параграф будет добавлено новое поле, оно не будет отображаться до тех пор, пока вы не запишите его в twig.

Это был простейший пример. Аналогичным образом можно переопределять:

Типы материала:

node--машинное_имя_типа_материала--режим_отображения.html.twig

Таксономию:

taxonomy-term--машинное_имя_словаря_таксономии--режим_отображения.html.twig

Блоки:

block--машинное_имя_блока--режим_отображения.html.twig

Типы медиа:

media--машинное_имя_медиа--режим_отображения.html.twig

Примеры названий файлов twig можно увидеть при включенном twig debug.

Показать полностью 1

[моё] Программирование Разработка IT Программист Drupal Backend Template Web Web-программирование Софт HTML Html 5 Develop

1