---
tags:
  - сайт
  - страница
  - контакты
  - p0
url: /contacts
approach: CMS-страница + новый API endpoint для формы
effort: ~3ч (CMS) + ~4ч (форма с backend)
created: 2026-02-17
---

# 📞 Контакти

> [!tip] Роль страницы
> Trust-сигнал E-E-A-T. Множественные каналы связи. Telegram + телефон + карта — никакого email.

> [!warning] Реализация
> **CMS-страница** — создать через `/admin/pages`.
> Дополнительно нужен бэкенд: `POST /api/contact-form` (имя + телефон + сообщение).
> Форма — новый React-компонент `components/forms/contact-form.tsx`.

---

## Мета-данные

| Поле | Значение |
|---|---|
| **H1** | `Зв'яжіться з нами` |
| **Title** | `Контакти GoodBrick — Telegram, телефон, адреса виробництва` |
| **Description** | `Зв'яжіться з GoodBrick: Telegram, телефон, Viber. Замовте безкоштовний зразок або отримайте консультацію. Виробництво в Одесі.` |
| **Schema** | `ContactPage` + `Organization` |
| **isIndexable** | true |

---

## Блоки страницы (через CMS админку)

### 1. TextBlock — интро

```
Ми завжди раді відповісти на питання про продукцію, ціни та доставку.
Відповідаємо у Telegram протягом години в робочий час.
```

---

### 2. ContactsBlock — основные контакты

```json
{
  "phone": "+380 XX XXX XX XX",
  "telegram": "https://t.me/goodbrick_ua",
  "viber": "viber://chat?number=+380XXXXXXXXX",
  "workingHours": "Пн–Пт: 9:00–18:00, Сб: 10:00–15:00",
  "address": "Одеса, вул. ...",
  "mapEmbedUrl": "https://www.google.com/maps/embed?pb=..."
}
```

> [!important] Email не показывать — никто не пользуется

---

### 3. Форма обратной связи

**Поля:** только имя + телефон + необязательное сообщение (3 поля максимум)

```
Ім'я: [________________]
Телефон: [______________]
Повідомлення: [________] (необов'язково)
[Надіслати заявку]
```

> [!warning] Реализация формы
> Нужен новый API endpoint `POST /api/contact-form`.
> Entity `ContactForm`: `Name`, `Phone`, `Message`, `SubmittedAt`.
> Компонент `ContactForm` — react-hook-form + zod (телефон — обязательный).
> После отправки: «Дякуємо! Зателефонуємо вам найближчим часом.»

---

### 4. TextBlock — Де нас знайти

```html
<h2>Де нас знайти</h2>
<p>Виробництво та офіс: Одеса, вул. ... (по запросу)</p>
<p>Дилери: <a href="/dealers">Одеса, Хмельницький, Київ</a></p>
```

---

### 5. TextBlock — Реквізити

```html
<h2>Реквізити</h2>
<p>ТОВ «GoodBrick»<br>
ЄДРПОУ: XXXXXXXX<br>
Юридична адреса: Одеса, ...</p>
```

---

## Конверсионные элементы

- [x] Telegram как главный канал — ссылка prominent
- [x] Телефон кликабельный (`tel:`)
- [x] Viber как второй мессенджер
- [x] Форма — минимум полей (имя + телефон)
- [x] Рабочие часы — убирает тревогу «а вдруг не ответят»
- [x] CTA «Замовити зразок» → ссылка в шапке (уже есть в SiteHeader)

---

## Scope cuts

| Убрано | Причина |
|---|---|
| Email | Никто не пользуется |
| Несколько отделов (продажи/тех.поддержка/дилеры) | Пока один контакт для всего |
| Чат-виджет (Tidio/Crisp) | Добавить позже если нужен |

---

## Связанные страницы

- [[00 — Обзор и приоритеты]]
- [[07 — Де купити]]