402 подписчика

Как сделать лендинг самому: пошаговая инструкция

Лендинг — это одностраничный сайт, полностью заточенный под то, чтобы посетитель выполнил целевое действие, например: оставил заявку, зарегистрировался, оставил контактные данные. Landing page может понадобиться экспертам для привлечения новых клиентов, для анонса мероприятия, предзаписи на курс и так далее.

В нашей статье мы простыми словами расскажем, как бесплатно создать лендинг самому без навыков программирования. Давайте начнем!
Пример одностраничного сайта (landing page).
Пример одностраничного сайта (landing page).

Инструкция, как создать лендинг (landing page) самому с нуля

Нет времени читать? Посмотрите инструкцию в формате видео (она длится всего 8 минут):

№1. Хостинг и домен

Для начала вам потребуется зарегистрировать домен и купить хостинг для сайта. Сделать это можно в компании «Евробайт».

Для заказа домена в панели управления переходим в «Домены» и придумываем адрес для будущего лендинга.

Проверка доменов.
Проверка доменов.

Заполняем контактные данные, они необходимы для регистрации домена.

Контактные данные.
Контактные данные.

Чтобы NS-серверы подгрузились автоматически, нажимаем на eurobyte.

NS-серверы.
NS-серверы.

При необходимости выбираем функцию автопродления домена и добавляем заказ в корзину.

Добавление в корзину.
Добавление в корзину.

Переходим во вкладку «Все услуги» > «Виртуальный хостинг». Выбираем нужный тариф: для лендинга будет достаточно базового тарифного плана. Обратите внимание, на выбор представлены дата-центры в Европе и в России. Выберите подходящий вам в зависимости от целевой аудитории, на которую вы будете ориентироваться.

Выбор хостинга.
Выбор хостинга.

Заполняем доменное имя, выбираем период оплаты и нажимаем кнопку «В корзину». Оформляем заказ и оплачиваем любым удобным способом.

Оформление заказа.
Оформление заказа.
Обратите внимание, домен может активироваться некоторое время.

№2. Установка CMS

Теперь нужно установить CMS WordPress на наш сайт. WordPress — это бесплатная система управления контентом, которая поможет нам самостоятельно сделать лендинг без знания программирования.

Переходим в панель ISPmanager после активации услуг.

Как перейти в панель управления.
Как перейти в панель управления.

Переходим по вкладку WWW > Каталог веб-скриптов и выбираем CMS WordPress. Проходим простую процедуры установки (она проходит автоматически).

Установка WP.
Установка WP.
Если у вас возникли трудности с установкой, рекомендуем посмотреть инструкцию:

№3. Наполнение лендинга контентом

Далее необходимо зайти в панель администратора WordPress (логин и пароль вы сами зададите во время установки).

Для удобства редактирования контента на сайте установим плагин Elementor. Переходим в раздел «Плагины» и нажимаем «Добавить новый». Находим Elementor и активируем его.

Установка Elementor.
Установка Elementor.

Чтобы настроить внешний вид сайта, переходим во вкладку «Внешний вид» и нажимаем «Настроить».

Внешний вид.
Внешний вид.

Мы создадим лендинг для продвижения услуг фотографа. В свойствах сайта указываем название, краткое описание. По желанию можно загрузить логотип.

Свойства сайта.
Свойства сайта.
Раздел с настройками внешнего вида очень обширный: в нем вы сможете изменить область виджетов, меню, шапку сайта, загрузить фавикон и многое другое. Чтобы изменить дизайн сайта, просто выберите другую тему (раздел Внешний вид > Темы).

Переходим на созданную автоматически страницу: ее мы будем использовать для создания лендинга.

Изменение страницы.
Изменение страницы.

Нажимаем «Редактировать» и в макете выбираем «Без области виджетов».

Убираем область виджетов.
Убираем область виджетов.

Далее будем редактировать страницу в Elementor. Удаляем ненужные блоки и с помощью готовых шаблонов создаем наш уникальный лендинг.

Начало создания лендинга.
Начало создания лендинга.

Наполняем его контентом: фотографиями, текстом, ссылками, кнопками и другим содержимым в зависимости от вашей цели.

Наполнение контентом.
Наполнение контентом.
По умолчанию в WordPress главная страница — динамическая, она отображает последние записи. Для лендинга это не нужно. Сделаем так, чтобы при переходе на наш сайт отображалась страница, которую мы только что редактировали.

Нажимаем «Настроить» и переходим в настройки главной страницы.

Настройка внешнего вида.
Настройка внешнего вида.

Выбираем отображение статической страницы и в качестве домашней используем нашу.

Выбор главной страницы.
Выбор главной страницы.

Теперь в качестве главной страницы будет использоваться та, которую мы отредактировали.

Заключение

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

Евробайт — надежный и быстрый веб-хостинг для сайтов от 144 руб/мес! Попробуйте 30 дней бесплатно. 🎁