Ну всё, я вебфловер


Гео и язык канала: не указан, не указан
Категория: не указана


Перехожу с Readymag на Webflow и делюсь впечатлениями.
Разделяй и властвуй
https://t.me/design_without_cats — пишу про веб и графический дизайн
https://t.me/gorka_studio — пытаюсь открыть мастерскую мебели
@bolonev

Связанные каналы

Гео и язык канала
не указан, не указан
Категория
не указана
Статистика
Фильтр публикаций


Simulate how your site looks for visually impaired people with the new Vision preview tool in the canvas settings.




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


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


Теперь можно переименовывать класс прямо в Style Manager. А ещё смотреть где используется и быстро переходить к элементу. Удобно наводить порядок. Или я раньше не замечал этого?)




Поправка к прошлому сообщению. Я переоценил возможности фичи. Теги всё ещё костылём нужно реализовывать. Обнова помогает разве что выводить ленту сразу с несколькими значениями/тегами.




Если нужно поставить всплывашку про cookie без всяких заморочек
cookieconsent.insites.com/download


Код обновил. Спасибо Maga 🙏


Давайте уже год в подвале начнём менять автоматически 🙂
Это очень просто. Вот код, который вставляем в настройках сайта перед


const currentYearField = document.getElementById('current-year');
currentYearField.innerText = new Date().getFullYear();

А нужный текстовый блок с годом оставляем пустым и задаём ему айдишник current-year


Репост из: Webflow Samples
Видео недоступно для предпросмотра
Смотреть в Telegram
#sample 15
Drag and Drop. Добавляем новый триггер на вебфлоу.

Туториал: 1 час 38 минут.


Слава Федосенко ведёт канал, где публикует разные трюки на вебфлоу с подробными видео-разборами.


А вот код для поп-апа, когда кнопки открытия и закрытия разные. С классами, думаю, всё понятно.


Webflow.push(function() {
$('.YOUR-CLASS-OPEN').click(function(e) {
e.preventDefault();
$('body').css('overflow', 'hidden');
});
$('.YOUR-CLASS-CLOSE').click(function(e) {
e.preventDefault();
$('body').css('overflow', 'auto');
});
});


Не люблю, когда при открытом поп-апе или менюшке скролл не блокируется. Получается, что мы смотрим на одно, а едет другое. И удивительно, как многие забивают на эту деталь.

Вот очень простой код для блокировки скролла при открытом меню, когда оно открывается и закрывается на одну и ту же кнопку. Где YOUR-CLASS — это класс вашей кнопки, например, бургера. Код просто вставляем перед body в настройках сайта или отдельной страницы, в зависимости как вам нужно.


$('.YOUR-CLASS').on('click', function(e){
if ($(this).hasClass('active')) {
$(this).removeClass('active');
$('body').css('overflow', 'auto');
} else {
$(this).addClass('active');
$('body').css('overflow', 'hidden');
}
});


Пишу сюда редко, потому что работаю в вебфлоу пару раз в месяц по 3-4 дня. Сейчас начал собирать проект, который буду переносить из вебфлоу на систему управления сайтами. Клиент сам сможет править тексты и менять картинки. И платить не надо абонентку. Хорошо подходит для статичных сайтов. Результатами, конечно, поделюсь.


Вебфлоу тестирует новый вид панели Style. Изменений больше, чем видно на первый взгляд. Местами стало логичнее и аккуратнее.




Перекидываем форму Webflow

Рассмотрим два варианта: подключение к мейлчимп и подключение к почте.

1. Мейлчимп
Лучше меня расскажет урок на Webflow.

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

2. Почта
Об этом способе @13ar.bass/отправка-формы-через-php-скрипт-на-сайте-webflow-a80703c2f130' rel='nofollow'>написал мой коллега Артем. Там потребуется работа с php, но на примере всё просто.

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


Перекидываем сайт с Webflow на хостинг Fornex

1. В Fornex выбираем хостинг. Далее добавляем нужный сайт — Управление/Сайты/Домены/Добавить домен.

2. В регистраторе (где регистрировали домен) идем в настройки DNS и там меняем или добавляем 4 NS сервера:
ns1.fornex.com
ns2.fornex.com
ns3.fornex.com
ns4.fornex.com
Здесь же добавляем две А записи с хостами @ и www с значением ip адреса, на котором вам выдали хостинг. Адрес смотрим в настойках хостинга на Fornex.

3. Экспортируем код с вебфлоу. Разархивируем.

4. Качаем ftp клиент, например Cyberduck. Нажимаем Новое подключение. С настроек в Fornex Доступы/FTP-доступ копируем нужные названия сервера, логин и пароль.

5. Заходим в папку public_html и видим наш сайт. Открываем папку и перекидываем туда разархивированный сайт с Webflow. Всё.

Теперь нужно немного подождать, пока настройки в регистраторе вступят в силу. Далее возникнет проблема с SSL сертификатом. Fornex сперва выдает временный, на который браузеры ругаются и через какое-то время (может занять сутки) автоматически добавляет годный сертификат с Let’s Encrypt. Можно ускорить этот процесс, если вручную сделать, но я пока не пробовал, если столкнусь, то напишу подробности.

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

Показано 20 последних публикаций.

189

подписчиков
Статистика канала