Експорт із Claude Design: тема WordPress у застосунку html2wp
Дизайн із Claude Design можна перетворити на тему WordPress у застосунку html2wp, без термінала. Для експорту з Claude Design ви зберігаєте дизайн як HTML. Потім додаєте його в застосунок, вибираєте Flash або Full, а наприкінці завантажуєте тему WordPress, яка виглядає як ваш дизайн.
Що потрібно, щоб перетворити експорт із Claude Design на WordPress
- Mac з Apple silicon (M1 або новіший) і macOS 12 або новіша.
- Обліковий запис ChatGPT. Конвертацію виконує AI з вашої власної підписки, тож за кредити ви нам не платите.
- Ваш експорт із Claude Design: дизайн, збережений як HTML-файл. Якщо у вас кілька сторінок, збережіть кожну як окремий файл.
HTML із Claude є найкоротшим шляхом до теми, бо застосунку не треба спершу збирати його чи відкривати в браузері. Безкоштовна версія конвертує три сайти до п’яти сторінок кожен. Для роботи на клієнтів потрібна ліцензія Pro зі сторінки з цінами.
Встановлення, середовище і вхід
Завантажте застосунок для Mac і перемістіть його в папку «Програми». У налаштуваннях натисніть Prepare environment (підготувати середовище), і застосунок завантажить Docker та середовище конвертації. Потім увійдіть через Connect with ChatGPT. Посібник із Lovable для застосунку докладно описує кожен із цих кроків зі скриншотами, і для Claude вони такі самі.
Експорт із Claude Design у застосунок
Для експорту з Claude Design завантажте артефакт у Claude як файл .html. Створіть папку й збережіть у ній файл як index.html. Якщо дизайн посилається на зображення, яких немає у файлі, покладіть їх у ту саму папку, туди, де їх очікує код. Інші сторінки, як-от «Про нас» чи «Контакти», кладіть поруч як about.html і contact.html. Застосунок за назвою файлу визначає, яка сторінка є якою.
У застосунку натисніть New project (⌘N), залиште на виході «HTML WordPress theme» і виберіть «Choose a folder». Якщо ви запакували папку в ZIP, скористайтеся натомість «Import a ZIP».
Flash чи Full для теми WordPress
Flash стоїть за замовчуванням: кожен крок виконується один раз, і це триває близько пів години. Full запускає кожну перевірку й намагається виправити помилки, тож триває близько години. Односторінковий дизайн зазвичай ближчий до коротшого краю, але перевірки однаково виконуються повністю.
Під час конвертації вкладка «Overview» (огляд) показує, що робить застосунок. Щоб поставити її на паузу, натисніть Stop conversion, а потім продовжте кнопкою «Continue».
Перевірка дизайну в застосунку
Вкладка Compare показує оригінал і версію WordPress поруч, на ширині комп’ютера й телефона. Перегляньте кожну сторінку, бо автоматичні перевірки ловлять більшість відмінностей, хоч і не всі. Якщо щось не збігається, напишіть це в чат. Зміна відбудеться в попередньому перегляді, а потім «Make release» запакує нову версію теми.
Експорт теми: дизайн із Claude Design у WordPress
На вкладці Exports натисніть «Save» поруч із темою WordPress і збережіть ZIP. У WordPress ви завантажуєте його через Зовнішній вигляд → Теми → Додати нову → Завантажити тему. Тема самостійна: сторінки, форми, меню й SEO працюють без плагіна.
Редактор Visual Edit дає вашому клієнту редагування кліком. Якщо ви працюєте в терміналі, ту саму конвертацію описує посібник із плагіном для Claude Code і Codex.