Картки як на Медузі: новий важливий блок Базіума

Ознайомтеся з можливостями і спробуйте його прямо зараз. Додати блок → Картки → MdzCr: Картки зі змістом
17.08.2020
Картки, щоб розповідати свої історії
Діліться інформацією, створюючи картки, як на Медузі
1
5 типів карток
5 типів карток
Картки можуть бути 5 типів. Перший: звичайна з текстом, фото, відео. Другий: із слайдером. Зі списком. З формою. І останній тип картки - з HTML-кодом. 

Зараз ми продемонструємо кожен з них.
2
Звичайна картка
Демонструємо всі складові. Вище ви бачите заголовок - обов'язковий елемент кожної картки. Він виводиться в зміст, який може бути зліва або справа. А цей текст- це просто текст. Звичайно, в тексті можливе форматування жирним і курсивом, підкреслення і посилання.
Зображення з підписом
Тексових полів може бути два. Ми їх зробили розділеними, щоб можна було поставити в різні місця карток. Дані картки, по суті, являються блочним конструктором в середині блочного конструктора. А в середині картки елементи також можна переміщати вверх-вниз.
Підпис до відео
В картці може бути примітка, котра виділяється кольором і шрифтом. В примітці може бути винесена якась важлива ключова інформація.
Тут ми відзначимо, що дані картки дають змогу описати послуги, робити публікації в блозі швидко, відповідно до чіткої логіки. За основу ми взяли картки Медузи, розширивши їх функціонал.
3
Це картка зі слайдером
На картках зі слайдером є сам слайдер, текст, примітка і кнопка. У слайдер можна помістити ілюстрації до карток, скріншоти відгуків з соцмереж, просто красиві фотографії.
Фотографії можна збільшувати, якщо дана опція увімкнена в налаштуваннях. Також в налаштуваннях можна задати пропорції зображень і автоматичне кадрування.
4
Картка зі списком
Списки можуть бути в рамках текстових блоків, але окремий тип карток дозволяє зробити на списку акцент, налаштувавши дизайн так, як потрібно вам.
У картці зі списком може бути зображення
Заголовок дає уявлення, про що розповідається в картці. Тема також відображається в бічному меню
Картки не повинні містити "води", а ключову і важливу інформацію для відвідувача.
Використовуйте фотографії та ілюстрації для візуалізації текстової інформації.
Примітка є і на картці зі списком. Відзначимо, що в налаштуваннях дизайну можна вибрати тип маркера.
5
Картка з HTML-кодом
Якщо у вас є якась нестандартна задача, то можете ставити в картку будь-який HTML-код. Це може бути як самописний код, так і код зовнішніх сервісів (гуглкарт, crm-систем і тп)
6
Картка з формою
В рамках одного набору карток можна використовувати одну форму.
Форму может сопровождать изображение
Товар добавлен в корзину
Оформить заказ

Смотрите также
від