Доопрацювання сайту Bropack на WordPress (виправлення верстки, налаштування форм та SEO)

Опис завдання:

Шукаємо досвідченого WordPress-розробника/верстальника для оперативного завершення проекту https://bropack.com.ua/. Сайт вже сверстан і посажений на WordPress, але у зв'язку зі зривом термінів попереднім виконавцем, необхідно закрити технічну частину, налаштувати базове SEO і внести ряд точкових візуальних правок строго за макетом Figma.

Важливо: Робота вимагає жорсткого дотримання дедлайнів і уваги до деталей. Оплата проводиться тільки після перевірки всіх пунктів ТЗ. У нас на руках є повний бекап сайту (файли теми + БД) і посилання на макети в Figma.

Вартість: Передбачити у вартості робіт правки до 10% від поточного ТЗ, які на даний момент можуть бути невидимі через незакінчену верстку. Також може бути невелике зміна в дизайні деяких блоків (висота, ширина, розташування кнопок, розмір картинки).

Правки: Висилаються файлом Word замовником. Приймаються від виконавця в цьому ж файлі з коментарями навпроти кожного рядка. Без такого відповіді на правки буде зміна виконавця.

1. Архітектура теми і базова оптимізація

• Особливість зборки (Custom PHP): Сайт являє собою кастомну тему, написану на PHP/HTML/CSS/JS (без використання важких візуальних билдерів). Логіка управління контентом виведена у вбудований кастомайзер WordPress (Зовнішній вигляд -> Налаштувати). Усі ключові секції (Шапка, Hero, Колажі, Блоки переваг) редагуються саме там. Вам доведеться працювати безпосередньо з кодом (PHP-шаблонами) і цією структурою.

• URL-адреси: Налаштувати автоматичну транслитерацію URL-адрес (ЧПУ). Усі кириличні назви сторінок і записів повинні автоматично конвертуватися в латиницю (наприклад, "Про компанію" -> /pro-kompaniyu/)

• SEO-плагін: Плагін Yoast SEO встановлений, але не налаштований. Необхідно провести його базову настройку для коректного формування сниппетів, індексації і повної готовності посадкових сторінок до запуску рекламних кампаній.

• SEO для кастомних блоків: На сторінках з блоками передбачити коректну роботу/налаштування SEO.

• Атрибути зображень (Alt/Title): У поточних PHP-шаблонах (зокрема, у статтях блогу і елементах бенто-сітки) не виводяться атрибути alt і title для зображень. Необхідно доопрацювати логіку виводу картинок так, щоб ці атрибути динамічно підтягувалися з стандартної медіабібліотеки WordPress. Без цього неможлива коректна SEO-оптимізація зображень.

• Мікроразметка (Schema.org): У плагіні Yoast SEO налаштувати мікроразметку Schema.org для Google.
  - Налаштувати глобальні параметри організації (назва компанії, логотип, контактні дані).
  - Перевірити коректність генерації тегів і технічної дати зміни сторінок (dateModified), щоб пошукові роботи миттєво бачили ручне оновлення дат на сайті.
  - Переконатися, що на кастомних PHP-шаблонах сторінок виведений і коректно працює стандартний функціонал Yoast для точкового управління типами розмітки - проставити типи сторінок за рекомендацією замовника.

• Шаблон блогу (Статті): Необхідно прибрати складну верстку статті виключно через кастомні блоки/поля. Статті повинні публікуватися через стандартний текстовий редактор WordPress. Потрібно налаштувати вивід the_content() і прописати CSS-стилі так, щоб усі стандартні елементи всередині статті автоматично підхоплювали дизайн з Figma (глобальні стилі). А саме:
  1. Стандартний текст (абзаци, міжстроковий інтервал, колір).
  2. Заголовки H1, H2, H3 (розмір, вага шрифту, відступи).
  3. Зображення і вбудовані відео (адаптивна ширина, відступи, можливо округлення кутів за макетом).
  4. Списки (марковані і нумеровані).
  5. Стандартні кнопки.
  
  
  

2. Технічна частина: Форми, захист і логіка

Необхідно налагодити безпечну роботу всіх форм захоплення лідів:

• Інтеграція: Налаштувати відправку лідів через SendPulse. Укажіть до початку робіт, які доступи (API-ключі тощо) вам для цього знадобляться.

• Антиспам: Встановити надійний захист від спаму на всі форми (в пріоритеті Cloudflare Turnstile, або запропонуйте обґрунтовану альтернативу).

• Впровадити захист від флуда. Ліміт: з одного IP-адреси форму можна відправити максимум 2 рази за 5 хвилин. Усі інші спроби повинні блокуватися.

• Валідація і маска: Перевірити маску вводу для номера телефону (недостатні клітинки заповнюються цифрами). Поле "Телефон" повинно бути обов'язковим у всіх формах. Поле "Ім'я" повинно бути необов'язковим у всіх формах - перевірити.

• Поведінка після відправки: Налаштувати автоматичне очищення полів форми після успішної відправки. Сторінка при цьому не повинна перезавантажуватися або прокручуватися вгору/вниз — користувач залишається на поточному місці екрану.

3. Поточні правки по Figma

Необхідно усунути недоробки і привести верстку в 100% відповідність з макетом (детальні скріншоти будуть надані вибраному виконавцю):

Стилі:

• Скоригувати фон головного банера (зробити світліше за макетом) і підсунути кнопку (3 скріни запропонувати для затвердження) https://bropack.com.ua/ready-solutions/.

• В слайдерах і відео-блоках залишити рівно 5 кнопок (точок).

• Перевірити текст «Оновлено» (курсивом) в нижній частині сторінок.

• На МОБ у всіх слайдерах перевірити роботу свайпа, іноді буває захоплення правої або лівої межі сайту замість свайпа.

Сітка, блоки і відступи:

• Зменшити деякі відступи між блоками відповідно до Figma - 15-20 шт.

• Збільшити висоту зазначених блоків і розмір шрифту в них до значень з Figma.

• Перевірити нижні форми захоплення: збільшити їх загальну висоту, а також висоту кнопок і шрифту всередині.

• На сторінці «Про компанію»: опустити розділову лінію для вирівнювання з лівою колонкою, заголовок «Наші цінності» зсунути лівіше.

Попапи і графіка (Персонаж):

• Повернути на місце з'їхавшого вправо персонажа в модальному вікні (попапі).

• В попапі розмістити іконку закриття (хрестик) на сірому кружку за макетом.

• Виправити пропорції/відображення вертикального фото в попапі.

• Повністю прибрати порожній попап без тексту.

• Откоректувати позиціонування персонажів (героїв): в одному з блоків зменшити розмір; на сторінці «Контакти» зсунути лівіше і вище; на сторінці «Про компанію» — збільшити і зсунути правіше.