З Lovable у WordPress: застосунок html2wp, крок за кроком
Цей посібник показує, як перенести проєкт Lovable у WordPress у застосунку html2wp. Термінал і програмування не потрібні. Ви додаєте проєкт як ZIP, вибираєте Flash або Full, а наприкінці завантажуєте готову тему WordPress, яка виглядає як ваш дизайн.
Що потрібно, щоб перенести Lovable у WordPress у застосунку
- Mac з Apple silicon (M1 або новіший) і macOS 12 або новіша.
- Обліковий запис ChatGPT. Конвертацію виконує AI з вашої власної підписки, тож за кредити чи токени ви нам не платите.
- Проєкт Lovable як ZIP або папка з вихідним кодом. Як його отримати, описано нижче.
- Місце на диску. Кожна запущена конвертація займає кілька ГБ.
Встановлювати Docker Desktop заздалегідь не треба, бо застосунок сам завантажить і встановить його за потреби. Безкоштовна версія конвертує три сайти до п’яти сторінок кожен, і цього вистачає, щоб перенести невеликий сайт із Lovable у WordPress. Для роботи на клієнтів, більших сайтів і магазину на WooCommerce потрібна ліцензія Pro зі сторінки з цінами.
Встановлення застосунку html2wp
Завантажте застосунок для Mac, відкрийте файл DMG і перетягніть html2wp у папку «Програми». У цьому посібнику назви кнопок написано точно так, як вони виглядають на екрані.
Підготовка середовища
У налаштуваннях застосунку (Settings) натисніть Prepare environment (підготувати середовище). Застосунок за потреби завантажить і запустить Docker, а потім завантажить середовище конвертації та образи WordPress і бази даних. Першого разу це триває кілька хвилин. Mac може попросити ваш пароль, а Docker покаже свої ліцензійні умови.
Коли все готово, застосунок пише «Ready to work», а кнопка змінюється на Repair environment (відновити середовище). Вона знадобиться, лише якщо середовище згодом зламається.
Вхід через ChatGPT
Натисніть Connect with ChatGPT. Застосунок покаже вам код, а кнопка «Open sign-in page» відкриє сторінку OpenAI. Увійдіть там своїм обліковим записом ChatGPT і введіть код із застосунку. Пароль ви вводите лише на сторінці OpenAI, тож застосунок його ніколи не бачить.
Після входу виберіть «Conversion model» (модель конвертації) і «Reasoning effort» (рівень міркування) або залиште значення за замовчуванням. Якщо у вас є ліцензія Pro, введіть ключ у налаштуваннях і натисніть Save & check. Безкоштовній версії ключ не потрібен.
Ваш проєкт Lovable у застосунку
Застосунку потрібні вихідні файли проєкту, а не адреса живого сайту. Lovable синхронізує проєкт із репозиторієм на GitHub. Відкрийте його на GitHub і завантажте через Code → Download ZIP. Збирати проєкт чи запускати npm install не треба, бо застосунок робить це сам.
У застосунку натисніть New project (⌘N). У розділі «Output» залиште HTML WordPress theme і виберіть Import a ZIP або «Choose a folder», якщо ви розпакували проєкт. Застосунок працює з копією, тож ваші оригінальні файли лишаються незмінними.
Flash чи Full для перенесення з Lovable у WordPress
На екрані проєкту ви вибираєте, наскільки ретельно застосунок має перенести сайт із Lovable у WordPress. Flash стоїть за замовчуванням: кожен крок виконується один раз, і це триває близько пів години. Full запускає кожну перевірку й намагається виправити знайдені помилки, тож триває близько години. Точний час залежить від кількості сторінок і швидкості вашого Mac.
Якщо WordPress вам не потрібен, перемкніть тип на Astro 5. Тоді застосунок збере статичний сайт, і ви зможете розгорнути його на Cloudflare Pages просто із застосунку.
Як іде конвертація
Під час конвертації вкладка «Overview» (огляд) показує кроки, над якими працює плагін конвертації, і виправлення, які він зробив сам. Здебільшого все йде без вашої участі. Незалежно від того, чи проєкт Lovable є старішим застосунком на React, чи новішим проєктом на TanStack Start, застосунок спершу збирає його, відкриває в браузері й зберігає кожну сторінку як готовий HTML. Лише потім він перетворює цей HTML на тему.
Щоб поставити на паузу, натисніть Stop conversion, а потім продовжте кнопкою «Continue». Якщо плагін сам зупиниться на якомусь кроці, Repair and continue дасть йому виправити помилку й продовжити.
Перевірка: сайт із Lovable поруч із версією WordPress
Вкладка Compare показує кожну сторінку оригіналу поруч із версією WordPress, на ширині комп’ютера (Desktop · 1440) і телефона (Mobile · 390), з різницею у відсотках. Перегляньте кожну сторінку самі. Автоматичні перевірки ловлять більшість відмінностей, але не всі: в одній конвертації бракувало цілого розділу, а різниця становила лише 0,4%.
На вкладці Preview кнопка «Open website» відкриває локальний сайт WordPress, а «WordPress admin» його консоль. Якщо хочете щось змінити, напишіть це в чат праворуч. Зміна з’явиться просто в попередньому перегляді за кілька секунд. Потім натисніть Make release, і застосунок запакує тему точно такою, як ви бачите її в попередньому перегляді.
Експорт теми після перенесення з Lovable у WordPress
Коли перенесення з Lovable у WordPress завершено, готові файли лежать на вкладці Exports. Поруч із темою WordPress натисніть «Save» і збережіть ZIP. Там також є звіт про конвертацію в PDF, ZIP оригінального проєкту і, після конвертації Flash, проєкт Astro 5.
У WordPress перейдіть у Зовнішній вигляд → Теми → Додати нову → Завантажити тему, виберіть ZIP і активуйте тему. Сторінки, блог, форми, меню, SEO і перенаправлення є частиною теми й працюють без плагіна.
Якщо хочете, щоб клієнт редагував текст і зображення кліком просто на сторінці, додайте редактор Visual Edit. Якщо вам зручніше працювати з агентом у терміналі, ту саму конвертацію описує посібник із плагіном для Claude Code і Codex.