Урок Адаптивность. Настраиваем вид страницы на разных устройствах.
Корректировка мобильной версии сайта на СТАНДАРТНЫХ блоках Тильды.
---
КОНСПЕКТ УРОКА
Как посмотреть отображение блока на мобильных?
Чтобы увидеть как сайт будет выглядеть на мобильных:
сверху, жмем Предпросмотр и внизу выбираем устройство.
---
Настраиваем отображение блока на разных устройствах
Наводим курсор на блок\Настройки\внизу “ДИАПАЗОН ВИДИМОСТИ НА УСТРОЙСТВАХ”
Затем нужно скопировать этот блок и настроить его внешний вид специально для мобильных (поменять фотографию, размер шрифта и т. д).
Диапазоны для ориентира:
Мобильные устройства: от 0 до 980 px.
Компьютеры (десктопные) устройства: от ≤980 px.
---
Настройка отступов для мобильных
В настройке блока, у параметра “Отступ сверху” нажать на значок компьютера и ниже появится строка “Отступ сверху\снизу” для мобильных.
---
Отключение адаптивности страницы
Если отключить адаптивность, страница будет показываться на мобильных так же, как и на компьютере.
Настройки страницы\Дополнительно\Отключить адаптивность для мобильных устройств. Переопубликовать страницу.
---
Обрезать фото можно
1. В Тильде\Контент блока\рядом с фото жмем на значок карандаша\кнопка Обрезать
2. В онлайн редакторе (аналог фотошопа): [ Ссылка ] в левой панели кнопка Обрезать
3. В программе на компьютере FastStone Image Viewer\Правой кнопкой\Изменить\Обрезка
---
ПОЛЕЗНЫЕ МАТЕРИАЛЫ
[ Ссылка ]
---
ЗАДАНИЕ
Проверьте как ваш сайт отображается на мобильном.
Сделайте разное отображение блоков для разных устройств, например, обрежьте или замените фоновое изображение обложки для мобильных и планшетов.
➖➖➖➖➖➖
Ссылка для регистрации в тильде.
➡ [ Ссылка ]
Если вы зарегистрируетесь в тильде по этой ссылке и оплатите тариф, то и вы и я получим по бесплатному месяцу.
➖➖➖➖➖➖
Группа в вк “Обучение созданию сайтов на Тильде”
[ Ссылка ]
➖➖➖➖➖➖
ДОБАВЛЯЙТЕСЬ В ДРУЗЬЯ
Я в вк ➡️ [ Ссылка ]
Я на ютубе ➡️ [ Ссылка ]
Я в яндекс.дзен ➡️ [ Ссылка ]
Моя группа в телеграм ➡️ [ Ссылка ]
Я в инстаграм ➡️ [ Ссылка ]
➖➖➖➖➖➖
Было полезно? Поддержать канал для создания новых видео:
➡️ [ Ссылка ]
➡️ [ Ссылка ]
➖➖➖➖➖➖
