Экспорт сайта БЕСПЛАТНО с Webflow

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

В этой статье я расскажу о том, как экспортировать код с Webflow на бесплатном тарифе. Ниже скриншот моего аккаунта, как видите тарифный план 0 $/mo

Тарифы Webflow
Тарифы Webflow

Первое что мы делаем это публикуем наш сайт.

Шаг 1
Шаг 1

Скачиваем и загружаем программу visual studio code.

Шаг 2
Шаг 2

Открываем сайт в браузере, нажимаем правой кнопкой мыши и выбираем просмотр код страницы.

Шаг 3
Шаг 3

Выделяем весь код (Ctrl+A) и копируем.

Шаг 4
Шаг 4

Шаг 5 (1)
Шаг 5 (1)

Находим ссылку на стиль (Ctrl + F) в поиске пишем «.CSS» (1), копируем и вставляем в браузер (2), теперь выделяем всё (Ctrl + A) и копируем стили (3).

Шаг 13 (1)
Шаг 6 (1)

Возвращаемся в программу, создаём файл styles.css (1), вставляем код. в файле index.html вместо ссылки на стиль прописываем путь к файлу стилей «./styles.css». (2)

Шаг 7 (1)
Шаг 7 (1)
Шаг 7 (2)
Шаг 7 (2)

Теперь находим ссылку на JavaScript (Ctrl + F) в поиске пишем «.js» копируем её (1) и вставляем в браузер (2). Копируем скрипт (3), создаём новый файл script.js (4) и вставляем в него скопированный код (5). В файле index.html вместо ссылки на javascript прописываем путь к файлу скрипта (6).

Шаг 8 (1)
Шаг 8 (1)
Шаг 8 (2)
Шаг 8 (2)
Шаг 8 (3)
Шаг 8 (3)
Шаг 8 (4)
Шаг 8 (4)
Шаг 8 (5)
Шаг 8 (5)
Шаг 8 (6)
Шаг 8 (6)

Открываем расширения, находим и устанавливаем Live Server (1), внутри html кода нажимаем правой кнопкой мыши и выбираем «Open with Live Server» (2), и вот мы видим, что экспортированный сайт открывается (3).

Шаг 10 (1)
Шаг 10 (1)
Шаг 10 (2)
Шаг 10 (2)
Шаг 10 (3)
Шаг 10 (3)

Шаг 11 (1)
Шаг 11 (1)
Шаг 11 (2)
Шаг 11 (2)
Шаг 11 (3)
Шаг 11 (3)

Также, как и с первой страницей меняем ссылки на стиль и скрипт.

Шаг 12
Шаг 12
Шаг 12
Шаг 12

В файле index.html находим ссылку-путь contact (1) и добавляем в конце .html (2), теперь наша ссылка корректна.

Шаг 13 (1)
Шаг 13 (1)
Шаг 13 (2)
Шаг 13 (2)

Открываем экспортированный сайт, и видим, что всё работает, теперь эту папку архивируйте и загружает на ваш хостинг, распаковывайте её на хостинге, на этом всё ваш сайт в интернете.

Страницы и ссылки работаю
Страницы и ссылки работаю

Если у вас всё получилось ставьте лайки, а если вам ещё и понравилось тогда подписывайтесь на мой ТГ канал: tipadigital.

Источник: https://habr.com/ru/articles/835106/


Интересные статьи

Интересные статьи

Министерство торговли США отозвало лицензии, позволяющие Huawei покупать полупроводники у Qualcomm и Intel. Такой шаг объяснили необходимостью предотвратить разработку Китаем передового искусственного...
Составили документ по которому можно выбрать подрядчика на разработку сайта или мобильной приложения. Для удобства работы, мы разделили чек-лист на несколько блоков: требования к подрядчику, требовани...
12 новых проектов для совместной работы на онлайн-досках, мониторинга цен конкурентов на маркетплейсах, управления документами, покупки билетов на автобус и многого другого. Битва за «Продукт недели» ...
В статье описана инструкция по установке Windows внутри MacOS.
Привет! Меня зовут Андрей Якобчук, я ведущий фронтенд-разработчик в Muse Group. Мы постоянно работаем над ускорением клиентской части наших сайтов. К тому же Гугл с его метриками Core Web Vitals с каж...