Дайджест Craftum ✨Релиз 30.03

Ловите топ-10 новинок и улучшений в конструкторе:

✅ Реализовали сохранение блоков в избранное. Это поможет держать нужные блоки в быстром доступе, а также легко копировать их с одной страницы и размещать на других.

Используйте иконку в виде звездочки, чтобы добавить блок в избранное. Найти его можно будет в списке всех блоков, в категории «Избранное».

✅ Отличная новость для тех, кто умеет в HTML и CSS 🪄
Добавили возможность задавать CSS-класс для любых блоков, а также для элементов в дизайн-блоке. Например, таким образом можно сделать эффект блика на кнопке или градиентный текст. Магия, не иначе!

Подробнее →

✅ На экранах шириной от 1200 px изображения могли пережиматься и мылиться. Сейчас на таких устройствах отображаем картинки в исходном качестве.

✅ Устранили «моргание» при переходе по якорным ссылкам.

✅ В письмах, отправляемых с форм, кириллические домены теперь отображаются понятно, а не в Punycode.

✅ Если разместить корзину в верхнем правом углу, она больше не будет прятаться за шапкой сайта.

✅ Вернули потерянные настройки для блоков из категории «Сервисы»: можно добавлять и удалять поля, а также менять галочку на крестик и наоборот.

✅ Добавили возможность размещать только один флажок в форме.

✅ В блоках «Подвал» исправили проблему со сменой текстового логотипа на изображение.

Продолжение следует ❤️

Дайджест Craftum ✨ Релиз 12.04

Дизайн-блок решил подкачаться к лету и оброс новой функциональностью:

✅ Группировка. Можно объединять несколько элементов в один и управлять им: передвигать, менять размер и так далее. Для этого выделите нужные элементы, затем в настройках блока нажмите «Сгруппировать».

✅ Горизонтальный скролл — как в Figma. Можно перемещаться по рабочей области, зажимая пробел, и выносить объекты за её пределы.

✅ Выделение объектов одной клавишей. Ну, почти. На Windows — это Ctrl+A, на macOS — Cmd+A.

✅ При перемещении объекта внутри сетки корректно вычисляются координаты и отображаются магнитные линии.

✅ Если выделить объект «Код», в сайдбаре ничего не сломается. Можно удобно переключаться между слоями и настройками.

✅ Отключили автовоспроизведение видео при работе в редакторе, а также поправили поведение слайдеров при включении зацикливания.

✅ Исправили ситуацию, когда не удавалось двигать объекты, размещенные вне рабочей области.

✅ При поиске картинки в галерее и удалении введенного запроса мог удалиться объект «Фотография» — поправили.

И ещё несколько улучшений:

⚙️ Починили: изменение высоты блоков, загрузку обложек для видео, добавление и удаление иконок на кнопках.

⚙️ Исправили ситуацию, когда в подвале не сохранялись ссылки на соцсети.

⚙️ При удалении главного изображения в блоках goods 9-12 оно автоматически заменяется следующей картинкой.

⚙️ Устранили ошибку, из-за которой создавалось несколько тегов title для одной страницы.

На сегодня всё! А следующий релиз — не за горами ☀️

Подборка на случай, если ваш любимый фотосток «всё» ⛔️

В статье вы найдете сервисы для поиска качественных картинок, иллюстраций и снимков для ваших сайтов. Смотрите подборку и дополняйте список в комментариях к посту ⬇️

Здесь могла бы быть креативная подводка, но мы еще осваиваем методики из новой статьи 🧠

Кому и зачем развивать креативность, а самое главное — как? Рассказываем в блоге Craftum!

Читать →

🆕 Отключение адаптивной версии

Новая настройка придет на помощь, когда основная версия сайта готова, а для планшета или телефона пока в процессе. Если отключить адаптивность, то на всех устройствах будет отображаться десктопная версия.

Найти переключатель можно в настройках страницы. Внимание на экран 👆

P.S. Эту идею предложил наш клиент. Вы тоже можете поучаствовать в развитии конструктора! Оставляйте свои пожелания в разделе «Есть идея» и голосуйте за имеющиеся. Возможно, в следующий релиз войдет именно ваше предложение 🪄

Настройка диапазона видимости блока 🔮

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

Чтобы магия случилась, нужно перейти в настройки блока и во вкладке «Дизайн» → «Блок» установить диапазон:

📌 От 0px до 667px — блок будет виден на телефонах
📌 От 667px до 1200px — блок будет виден на планшетах
📌 От 1200px до max — блок будет виден на компьютерах

Рассмотрим пару кейсов:

1️⃣ Предположим, вам нравится, как обложка выглядит на компьютерах и планшетах, но на телефонах фоновая картинка некрасиво обрезается. Вы можете выставить диапазон видимости этого блока от 667px до max — он будет показываться на компьютере и планшете. Затем скопируйте этот блок или создайте новый и настройте оформление специально для телефонов. Например, можно поменять картинку и размер шрифта. Далее для нового блока задайте диапазон видимости до 667px — эта версия будет отображаться на телефонах.

2️⃣ Другой пример. Вы хотите, чтобы блок с акцией был виден только на компьютерах, чтобы повысить продажи с десктопной версии. В этом случае просто отключите показ блока на других устройствах, установив диапазон видимости от 1200px до max.

Продолжаем учиться решать задачи неочевидными способами 😎

Сегодня поговорим о том, что такое дизайн-мышление и как оно помогает создавать востребованные продукты.

Читать →

Загрузка GIF-анимации 🟡

Продолжаем рубрику «вы просили — мы сделали». На этот раз добавили возможность загружать изображения в формате GIF. Вот и всё, можно пользоваться! Единственное правило: вес файла должен быть до 15 Мбайт.

Новое вкусное меню 🍔

Новинка в библиотеке блоков — гамбургер-меню (header-06). С помощью этого блока вы можете сделать акцент на контенте сайта, спрятав пункты меню под иконку в виде двух полосок.

Дополнительные фишки «бургера»:

✅ Добавляйте ссылки на соцсети. Количество и тип иконок можно настроить во вкладке «Контент» → «Социальные сети».

✅ Размещайте логотип в шапке или внутри выпадающего меню — как больше нравится (вкладка «Дизайн» → «Логотип»).

✅ Располагайте меню поверх обложки. Во вкладке «Дизайн» → «Блок» установите переключатель «Накладывать на следующий блок». Затем в настройках фона меню установите прозрачность цвета 0%. Как это работает, показали на скринкасте 🎬

Новые типы ссылок в конструкторе

Чтобы при клике на телефон начинался звонок, а при нажатии на email открывался почтовый клиент, больше не нужно помнить заклинания tel и mailto 🪄

Просто выберите нужный тип ссылки — Номер телефона или Email. Например, можно выделить фрагмент текста и указать тип ссылки во всплывающем меню либо перейти в настройки блока и задать ссылку для кнопки.

Webhook 🎣 Принимайте данные из форм куда угодно

Теперь вы можете настроить отправку заявок с сайта на адрес своего скрипта (метод POST). Это позволяет собирать данные в собственные базы, CRM-системы, сервисы email-рассылок etc.

👩‍💻 Например, можно написать скрипт, который передает данные в CRM, и разместить его на сервере. Затем в конструкторе указать Webhook URL — адрес, где расположен ваш скрипт. Таким образом, данные из форм на сайте будут отправляться на адрес скрипта, который в свою очередь перенаправит их в CRM.

Чтобы активировать вебхук, перейдите в настройки блока с формой. Затем во вкладке «Форма» → «Отправка данных с формы» укажите адрес вашего скрипта.

Всё, что вы хотели знать о SEO, но боялись спросить 😏

Что такое семантическое ядро, кластеризация запросов, коммерческие и поведенческие факторы… и другие сеошные штучки — разбираемся в блоге Craftum!

Читать →

Ловите самую актуальную инструкцию по настройке контекстной рекламы в Яндексе! Вот только опубликовали и сразу к вам 💥

Читать →

— Ты правда дизайнер? А скажи что-нибудь на дизайнерском.
— User Experience.
— Вау!

Написали много полезного и про User Experience, и про User Interface ✨

Читать →

⚡️ 220 — ровно столько голосов набрала эта идея. Настолько долгожданная новость, что уже даже спойлеры гуляют по чату 🌝

И это… загрузка файлов в конструктор! Теперь вы можете сделать так, чтобы по клику на ссылку или кнопку открывался или скачивался файл, например, в формате PDF или DOCX. При этом использовать файлообменники не нужно — размещайте прайс-листы, договоры и другие документы, не выходя из редактора.

Чтобы добавить файл, в настройках кнопки (или текста) выберите тип ссылки «Файл», загрузите или перетащите документ и укажите действие после клика — скачать на устройство или открыть в новой вкладке. Готово!

Если вам нужно разместить несколько файлов на сайте, можно загрузить их сразу все — они сохранятся в разделе «Ваши загрузки». Затем при настройке кнопки или ссылки выбрать нужный файл из конструктора.