Если вы думаете, что Yii2 — это только для серьёзных корпоративных порталов, то спешу вас обрадовать: на нём можно быстро и удобно делать лендинги. Причём не хуже, чем на «специализированных» конструкторах. В этой статье я покажу, как создать лендинг на Yii2 с нуля: от установки до деплоя. Без воды, только практика.

Digital-студия WNDER

Почему Yii2, а не «просто HTML»?

Лендинг — это обычно одна страница, но с кучей элементов: формы, кнопки, слайдеры, анимации. Если делать на чистом HTML, то придётся вручную обрабатывать формы, подключать JS-библиотеки и думать, как всё это поддерживать. А Yii2 даёт готовый каркас:

  • роутинг — красивые URL без настройки;
  • работа с формами и валидация из коробки;
  • шаблонизатор — выносите повторяющиеся части (шапка, подвал) в отдельные файлы;
  • миграции — база данных легко обновляется;
  • безопасность — защита от SQL-инъекций и XSS уже встроена.

Короче, вы получаете надёжный фундамент, на котором можно строить что угодно. И не нужно изобретать велосипед.

Установка и структура проекта

Устанавливаем Yii2 через Composer. Если не знакомы — это менеджер пакетов для PHP, он скачивает все нужные библиотеки. Команда для установки шаблона basic (он как раз подходит для лендингов):

composer create-project --prefer-dist yiisoft/yii2-app-basic my-landing

После установки у вас появится папка my-landing со стандартной структурой. Основные папки:

ПапкаЗачем нужна
controllers/Контроллеры — обрабатывают запросы и передают данные в представления
views/Представления — HTML-шаблоны с PHP-вставками
models/Модели — работа с данными и бизнес-логикой
web/Корневая папка веб-сервера, сюда кладём CSS, JS, картинки

Для лендинга нам понадобятся только контроллер и пара представлений. Всё остальное — по желанию.

Создаём главную страницу лендинга

По умолчанию в Yii2 уже есть контроллер SiteController с действием actionIndex. Это и есть главная страница. Откройте файл controllers/SiteController.php и упростите его до минимума:

namespace app\controllers;

use Yii;
use yii\web\Controller;

class SiteController extends Controller
{
    public function actionIndex()
    {
        return $this->render('index');
    }
}

Теперь создадим представление views/site/index.php. Это и будет HTML нашего лендинга. Вставим простую структуру:

<?php
/* @var $this yii\web\View */
$this->title = 'Мой лендинг';
?>

<div class="landing">
    <h1>Заголовок первого экрана</h1>
    <p>Краткое описание продукта или услуги.</p>
    <button class="btn btn-primary">Заказать</button>
</div>

Если вы запустите сайт (например, через php yii serve), то увидите эту страницу. Но это ещё не лендинг — это просто заглушка. Добавим стили и скрипты.

Подключаем стили и скрипты

В Yii2 есть специальный способ подключать CSS и JS — через так называемые ассеты (asset bundles). Это такие классы, которые описывают, какие файлы нужны. Создадим свой ассет для лендинга. Например, файл assets/LandingAsset.php:

namespace app\assets;

use yii\web\AssetBundle;

class LandingAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'css/landing.css',
    ];
    public $js = [
        'js/landing.js',
    ];
}

Теперь в представлении подключаем этот ассет:

use app\assets\LandingAsset;
LandingAsset::register($this);

Вставьте эту строку в начало index.php. И не забудьте создать сами файлы web/css/landing.css и web/js/landing.js. Теперь можно писать стили и скрипты как обычно.

Обработка формы заявки — без магии

На лендинге обычно есть форма «Оставьте заявку». В Yii2 это делается просто. Создадим модель models/LeadForm.php:

namespace app\models;

use yii\base\Model;

class LeadForm extends Model
{
    public $name;
    public $phone;

    public function rules()
    {
        return [
            [['name', 'phone'], 'required'],
            ['phone', 'match', 'pattern' => '/^\+?[0-9]{10,15}$/'],
        ];
    }
}

В контроллере добавим действие для обработки формы:

public function actionLead()
{
    $model = new LeadForm();
    if ($model->load(Yii::$app->request->post()) && $model->validate()) {
        // Здесь можно сохранить в базу или отправить на почту
        Yii::$app->session->setFlash('success', 'Спасибо! Мы скоро свяжемся с вами.');
        return $this->redirect(['index']);
    }
    return $this->renderAjax('_lead_form', ['model' => $model]);
}

Представление _lead_form.php — это просто HTML-форма с полями. Вставим её в основной лендинг. Обратите внимание: валидация происходит на сервере, это надёжно.

Лайфхак: для отправки формы без перезагрузки используйте AJAX. В Yii2 есть готовый метод $.pjax или можно просто написать свой JS-код. Это ускорит взаимодействие с пользователем.

Деплой и оптимизация

Когда лендинг готов, нужно выложить его на хостинг. Основные шаги:

  • Загрузите все файлы на сервер, кроме папки runtime/ и web/assets/.
  • Настройте веб-сервер так, чтобы корневой папкой была web/.
  • Включите режим прод (production) в web/index.php, чтобы скрыть отладочную информацию.
  • Настройте кэширование и сжатие CSS/JS — это ускорит загрузку.
Правило золотого часа: после выкладки всегда проверяйте, что формы работают, а страница открывается без ошибок. Лучше потратить 10 минут на тест, чем потерять клиента из-за битой кнопки.

Что в итоге

Мы прошли полный путь: от установки Yii2 до работающего лендинга с формой заявки. Вы получили не просто статичную страницу, а полноценное приложение, которое легко развивать: добавлять новые блоки, подключать аналитику, интегрировать с CRM. Yii2 не такой страшный, как кажется, а для лендингов он подходит даже лучше, чем «голый» HTML.

Если вы хотите сэкономить время и получить качественный результат, обратитесь в студию WNDER — мы сделаем лендинг под ключ с учётом всех ваших пожеланий.

Студия WNDER