У цій статті показано, як підключити Claude до Onepage через Model Context Protocol (MCP).
MCP — це інтерфейс між Onepage та зовнішніми ШІ-асистентами, який дає змогу керувати сторінками, вмістом і структурами вебсайтів безпосередньо через ці інструменти. Детальне пояснення щодо MCP ви знайдете в цій статті.
📌 Примітки:
Для використання функції MCP потрібна активна підписка на Onepage AI у фоновому режимі.
Під час створення вебсайту Onepage через MCP кредити Onepage AI не витрачаються. Натомість ви використовуєте токени відповідного ШІ-інструмента (наприклад, ChatGPT, Claude або Cursor), підключеного до Onepage.
Підключення Onepage до Claude (покрокова інструкція)
Крок 1
Відкрийте Claude.
Крок 2
Натисніть унизу ліворуч на свій профіль і перейдіть до Settings (Налаштування) → Connectors (Конектори).
Крок 3
Натисніть на значок «плюс» і виберіть Add custom connector (Додати власний конектор).
Потім введіть такі дані:
Name (Назва):
OnepageRemote MCP Server URL (URL віддаленого сервера MCP):
https://mcp.onepage.io/Advanced settings (Розширені налаштування): нічого не вводьте, будь ласка, залиште поле порожнім.
Крок 4
Тепер Onepage з'явиться у вашому списку конекторів. Натисніть Connect (Підключити) та увійдіть за допомогою свого облікового запису Onepage.
Після цього вас буде автоматично перенаправлено до Claude, де з'явиться таке повідомлення: «Claude wants to access your account.» (Claude хоче отримати доступ до вашого облікового запису.)
Тепер натисніть Allow (Дозволити).
Крок 5
Натисніть Always allow (Завжди дозволяти) та надайте дозвіл для всіх опцій.
Завдяки цьому Claude зможе працювати з Onepage та самостійно створювати, редагувати вебсайти й керувати ними.
Відеоінструкція: підключення Onepage MCP до Claude
Перегляньте, будь ласка, наведене нижче відео з усім процесом. Ви можете натиснути на значок повноекранного режиму (4 стрілки внизу праворуч) або безпосередньо на назву відео, щоб воно відкрилося в повноекранному режимі.
🎉 Тепер усе налаштовано! 🎉
Тепер ви можете розпочати чат у Claude та ввести промпт, щоб почати створення.
💡 Порада для ідеальних результатів: як сформулювати свої команди ще точніше, щоб отримати максимум від ШІ, ви дізнаєтесь у нашому гайді «Vibe-Coding: Як писати ефективні промпти для кращих результатів».
Приклад промпту 1: Сучасний ШІ-стартап
«Створи новий проєкт в Onepage і розроби домашню сторінку в темному режимі з 8 секціями для преміум-агенції growth-маркетингу, яка пропонує курси. Стиль має бути ультрасучасним з електрично-синіми акцентами, включно з інтерактивними hover-анімаціями та плавними scroll-fade-in ефектами. Потрібні: hero-секція з жирним заголовком і двома CTA, панель логотипів для довіри, 3-колонковий макет із больовими точками (pain points) та велика, помітна сітка статистики. Після цього додай динамічні картки розкладу курсів, огляд цільової аудиторії, masonry-сітку з відгуками, а в самому низу — контрастну CTA-форму реєстрації.»
Сторінка, створена за наведеним вище промптом:
https://growthforge-academy.onepage.me/
Приклад промпту 2: Елітна нерухомість преміум-класу
«Створи новий проєкт Onepage для футуристичної люкс-агенції нерухомості під назвою „Nova Living". Створи сучасну преміум лендинг сторінку з 10–11 секціями, зокрема: hero-секція, нерухомість, переваги, про нас, відгуки, команда, статистика, процес, FAQ, контактна форма та футер. Використовуй сучасні макети, плавні анімації, елементи glassmorphism, градієнти, hover-ефекти й адаптивний дизайн. Стиль має бути елегантним, футуристичним та оптимізованим під конверсію. За потреби додай тексти-заповнювачі та зображення й зроби вебсайт візуально вражаючим і високопрофесійним.»
Сторінка, створена за наведеним вище промптом:
https://nova-living-gg6.onepage.me/
Приклад промпту 3: Сучасна послуга у сфері сонячної енергетики
«Створи новий проєкт Onepage для преміум-компанії зі встановлення сонячних електростанцій під назвою „VoltSolar". Розроби сучасну, орієнтовану на конверсію лендингову сторінку з 8–9 секціями: яскрава hero-секція з двома CTA, панель логотипів партнерів, сітка функцій із демонстрацією переваг (економія, екологічність), слоти для якісної презентації проєктів, деталі інтеграції з додатками розумного будинку, чітка таблиця цін/пакетів із трьома варіантами, відгуки клієнтів, FAQ та фінальний контактний CTA. Використовуй чистий макет із насиченими смарагдово-зеленими й темно-сірими акцентами, плавні scroll-анімації та повністю адаптивний дизайн.»
Сторінка, створена за наведеним вище промптом:
https://solarpanels.onepage.me
⚠️ Важливо: якщо ви генеруєте сторінку через MCP-процес із Claude, у період бета-тестування редактор доступний виключно за адресою beta.onepage.io. Звичайне посилання app.onepage.io у цьому випадку не працює та може призвести до нескінченного екрана завантаження. Тому завжди користуйтеся бета-посиланням, щоб відкривати або редагувати згенерований вміст.
Як отримати доступ до бета-версії
Наразі MCP доступний лише для користувачів нашої бета-групи, які мають активну підписку на Onepage AI. Усе, що ви створите за допомогою MCP, автоматично з’явиться у вашому бета-просторі: https://beta.onepage.io/
Бажаєте запросити колегу чи клієнта до бета-версії? Просто зверніться до нашої служби підтримки, щоб отримати посилання-запрошення.
Примітка щодо захисту даних
Після поєднання Claude та Onepage через MCP дані обробляються відповідно до наших правил захисту даних. Усі подробиці ви знайдете в нашій Декларації про конфіденційність.
💡Бажаєте залишити відгук до цієї статті? Будь ласка, напишіть у наш чат або за адресою support@onepage.io, і ми зможемо її покращити. Дякуємо! 🙂