Разное

Создание лендинга на вордпресс: Как сделать лендинг на WordPress: разбираемся пошагово

13.08.1984

Содержание

доступная цена разработки Лендинга на Вордпресс под ключ в Украине

Заказать Landing Page (Лендинг) на WordPress: доступная цена разработки Лендинга на Вордпресс под ключ в Украине

У нас Вы можете заказать создание Landing Page именно на CMS WordPress. Мы фанаты WordPress, знаем все его сильные и слабые стороны, ежедневно узнаем и применяем новые «фишки». Поэтому доверив нам создание Лендинга на Вордпресс Вы получите партнера, который знает свое дело.

Разработка Лендинга на WordPress не занимает много времени. Однако, Вы должны это знать — мы не используем шаблонов в своей работе. Создаем индивидуальные темы специально для Вашей задачи.

В дальнейшем, разработанный нами Лендинг Вы сможете легко редактировать самостоятельно. Это проще простого!

❤️ Нас рекомендуют

Обсуждение проекта

👌 Отлично, мы получили вашу заявку. В ближайшие 20 минут мы вам ответим.

Индивидуальный расчет стоимости разработки

Оставьте заявку и мы посчитаем точную стоимость всех работ по созданию вашего сайта.

Узнать цену

Чем мы отличаемся?

Почему вам стоит обратиться именно к нам

Фанаты WordPress

В нашей компании работают настоящие фанаты WordPress, которые с радостью сделают для Вас современный, адаптивный, легкий Landing Page на Вордпрессе.

Выгодная цена

Стоимость разработки Landing Page на WordPress у нас приблизительно такая же, как и у других. Но мы предлагаем значительно БОЛЬШЕ за теже деньги.

Высокая конверсия

Лендинги разработанные в нашей компании имеют высокий показатель конверсий. Наш маркетинговый отдел включается в работу еще на этапе дизайна Лендинга.

Портфолио

Примеры работ

Новые проекты, которые выполнила наша команда

Создание сайтов SEO-продвижение

S-CAST

Сайт компании, которая занимается производством значков, медалей, брелков на заказ.

Создание сайтов SEO-продвижение

Відпочивай

Туристический портал. Каталог предложений по аренде жилья в курортных городах.

Стоимость услуги

Стоимость Landing Page на WordPress

Цена считается индивидуально. Стоимость разработки зависит от вашей задачи.

От 5000 грн.

Оставить заявку

Что входит в эту сумму?

  • Уникальный дизайн
  • Высокая скорость загрузки сайта
  • Покупка и настройка хостинга и домена
  • Покупка и настройка SSL-сертификата
  • Индивидуально настроенная админ панель
  • Базовая оптимизация

Несколько слов про услугу

Cms WordPress — самая популярная платформа для создания сайтов во всем мире. Почти треть всех сайтов планеты созданы именно на WordPress. Эта платформа позволяет быстро и качественно собрать лендинг и запустить его в работу для получения быстрых конверсий.

Удобство лендингов на WordPress заключается в качественной технической оптимизации, высокой скорости загрузки и гибкости реализации всех идей. Функционал WordPress ограничивается только вашей фантазией.

Кроме того, внутри вы увидите удобную и понятную административную панель для дальнейшего модерирования лендинга.

В услугу создания лендинга на WordPress входят:

  • изучение ниши и конкуренции;
  • проработка макета и концепт дизайна;
  • подбор качественных картинок и фото;
  • создание продающих текстов;
  • настройка отправки заполненных форм заказов на почту, telegram, Google Sheets и другое;
  • добавление анимации;
  • адаптивность на всех устройствах и браузерах;
  • базовая SEO-оптимизация.

Ответы на вопросы

Сколько стоит сделать Лендинг на WordPress

Разработка Landing Page на CMS WordPress в нашей студии стоит от 5000 гривен. Цена может меняться, в зависимости от сложности задачи.

Что входит в стоимость разработки Landing Page?

Уникальный дизайн, адаптивная верстка (Ваш сайт будет отлично выглядеть на любых устройствах и мгновенно загружаться), настройка хостинга и домена, подключение SSL-сертификата (Ваш сайт будет доступен по https), контактные формы, настройка админки и многое другое.

Сколько по времени занимает разработка Landing Page?

Обычно на создание Лендинга у нас уходит до 20 дней. Это без учета обсуждения проекта. Иногда разработка может занять меньше времени, иногда больше — все индивидуально и зависит от Вашего технического задания.

Оставить заявку

✖️

Заполните пару полей ниже и мы примем вашу заявку 👇

👌 Отлично, мы получили вашу заявку. В ближайшие 20 минут мы вам ответим.

Коммерческое предложение

✖️

Оставьте свои контактные данные и кратко опишите свой запрос 👇

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

Расчет стоимости работ

✖️

Заполните форму ниже, чтобы мы смогли понять вашу задачу и связаться с вами 👇

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

Где Вам удобно общаться?

✖️

Telegram

Viber

☎️ Возможно по телефону?

➡️ +380-99-771-3997

👍

Спасибо, мы получили ваше сообщение. В течении 20 минут мы выйдем с вами на связь.

Создание лендинга на WordPress (ВордПресс)

Алгоритм разработки Landing Page на ВордПресс

Многие разработчики сайтов считают, что одностраничник применяется с целью рекламы, а не как полноценный сайт. Одностраничник отлично справляется с поставленной задачей: активно рекламировать необходимый товар или продукт, заинтересовать потенциальных клиентов, рассказав о нем детально, и существенно увеличить объемы его продаж. Создание landing page не такая простая задача, как думают многие начинающие разработчики, которые могут пока только работать с самыми простыми «движками».

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

Вкратце о терминах. Landing page (целевая страница, одностраничный сайт) представляет собой промо-сайт, целью которого является реклама одного товара (или максимум двух), а также убеждение заинтересованного пользователя в совершении покупки непосредственно на лендинге. Кроме того, одностраничник может использоваться для продажи информационных материалов или различных услуг.

Разработка Landing Page на CMS WP

Чтобы выполнить поставленную задачу, необходим веб-ресурс, созданный на WordPress. Как разрабатывать подобный сайты мы уже рассказывали в наших материалах. Поэтому, если вам интересно, вы можете полистать на блог. Требуемый веб-ресурс может и не иметь контента, а также иметь стандартный шаблон. Но это неважно сейчас.

Важно найти раздел «Плагины». Он находится в админ. панели. Отыскав его, следует кликать на «Добавить новый». В поисковой строке следует написать «Free Landing Pages Builder by Wishpond». Когда найдете указанный плагин, его следует установить, а после провести его активацию. Название говорит само за себя, но если кто-то не изучал английский, то плагин является бесплатным.

Стоит заметить, что названный плагин не является единственным, имеющим необходимый набор функций. Существуют еще и другие, например, «KingComposer» или «Elementor». Эти плагины имеют схожий набор функций, однако, они менее удобны в работе.

Хотите развивать свой бизнес в Интернете и иметь больше заказов?

Достоинства by Wishpond

  1. Это дополнение схоже с конструктором, поэтому одностраничник на WordPress придется собирать, используя мышку. Установка блоков, их удаление или перемещение происходит буквально за несколько секунд. Также имеется качественная панель инструментов.
  2. Лендинг должен иметь необходимые функции, но он также должен быть и привлекательным. Плагин позволяет все это сделать. Имеющаяся панель инструментов предоставляет огромные возможности по подгонке не только самого дизайна страницы, но и каждого модуля или блока в отдельности.
  3. Существует и возможность получения статистических данных: количество посетителей, количество лидов за разные временные промежутки, число просмотров страницы и др.
  4. Бесплатных шаблонов именно для лендингов имеется более ста штук. Изменять в них можно все, что необходимо, но нужно будет поколупаться в коде. Здесь можно порекомендовать тем, кто не имеет желания разбираться в коде, использовать специальные плагины, которые позволяют визуально редактировать код.
  5. Управлять одностраничниками удобно. И это особенно важно для тех веб-программистов, которые разрабатывают несколько landing page.
  6. Можно дополнить лендинг всплывающими окнами, если есть в этом необходимость. Плагин позволяет это осуществить. Кроме того, здесь же есть возможность создания и своих форм.

Минусы by Wishpond

  1. Русскоязычная версия отсутствует. Для тех, кому интерфейс не кажется интуитивно понятным и простым, на помощь придут словари или онлайн-переводчики. В принципе, это не должно стать большим препятствием в работе.
  2. Плагин, конечно, имеет и платную версию, которая имеет более богатый функционал. Соблазн ее купить будет увеличиваться пропорционально времени использования плагина. Если постоянно работаешь с дополнением, то начинаешь понимать, что отдельных функций все же не хватает, а чтобы их активировать, необходимо дополнение купить. Если быть точным, то данный плагин дает возможность собирать не больше двух сотен лидов. Можно и обойти данное ограничение, оформив сторонние подписки.
  3. Внизу сайта остается копирайт. Казалось бы мелочь, однако, если проект довольно серьезный, то чужой текст выглядит, как минимум, странно.
  4. Плагины дают серьезную нагрузку на сервера. Это значит, что лендинг может грузиться около десяти секунд. Стоит заметить и тот факт, что, если разместить на лендинге еще и другие формы, то страница будет загружаться еще медленней. А это все грозит потерей целевых посетителей.

Как создать лендинг на WP

Чтобы начать создавать одностраничник на WordPress, необходимо зарегистрироваться. Если же речь будет идти о других дополнениях, то их можно просто активировать, после чего начинать настраивать.

  1. Чтобы зарегистрироваться, следует нажать на «Sign Up». (Вы же помните, что русский язык отсутствует?).
  2. Теперь можно выбрать «Star Trial Free».
  3. Далее следует указать e-mail и ввести придуманный пароль. К слову, его лучше где-то записать, чтобы не забыть, поскольку возни с его восстановлением предостаточно
  4. В окне имеется только одна кнопка, по ней и следует кликнуть.
  5. Вам будет представлено множество полей, которые на данный момент не нужны. Чтобы начать создавать одностраничник, следует нажать на кнопку «New Landing Page».

Останавливаться на всем имеющемся функционале не будем. Рассмотрим только самые необходимые позиции для разработки лендинга на этом «движке».

  1. Кнопка «Landing Page». Нажмите ее.

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

  1. Если с темой полностью определились, то можно нажимать «Choose Templat» и двигаться далее.
  2. Тут тема, которую вы выбрали, должна открыться. В данном окне можно вносить коррективы в нужной области. Слева находиться панель с инструментами. Справа будут отображаться все внесенные изменения. Если нужно переместить блоки, о совершать эти операции нужно здесь же. Все изменения сохраните. Помните, что акцент необходимо делать на верхней части страницы.
  3. Функция «Setting» позволяет провести настройку meta-тег. Данную операцию следует провести для того, чтобы дальнейшая СЕО-оптимизация была более качественной. Не поленитесь указать теги (ключи, которые будут вводить потенциальные клиенты, в попытке найти предлагаемый вами товар). Эта функция также позволяет корректировать шрифты, устанавливать необходимые дополнения, скачивать плагины и д.т.
  4. «Preview» позволяет проверить адаптивность веб-ресурса. после всех внесенных изменений и настроек, следует посмотреть, как именно будет видеть ваш одностраничник пользователь, который зашел на сайт с ПК, а как сайт будет отобраться мобильным пользователям. Помните, что сайт должен корректно отображаться для всех посетителей, не зависимо от того, с какого устройства они зашли на лендинг.
  5. «Save and draft» стоит нажать, когда нужно сохранить все внесенные коррективы. Можно, конечно и пропустить это действие, но тогда вся ваша работа пропадет и придется начинать все с начала.
  6. Когда все необходимая информация уже размещена на сайте, все блоки установлены на свои места, а формы для подписки не дают сбоев, можно публиковать одностраничник. Кнопка «Publish» поможет это сделать.
  7. Следует указать название лендинга прежде, чем он опубликуется. Именно поэтому и упоминалось ранее, что потребуется подготовка пустого веб-ресурса на этом «движке».

Одностраничник должен сразу начать свою работу по адресу, который вы указали. Можно начинать раскручивать сайт, используя контекстную рекламу, поисковое продвижение и другие маркетинговые инструменты, при условии, что веб-ресурс успешно функционирует.

Можно и больше говорить об этих и других нюансах создания лендинга на данном «движке». НО перечисленных моментов достаточно, чтобы разработать адекватный сайт.

Ответы на вопросы, которые задают чаще всего

  1. Является ли этот способ разработки одностраничника самым простым?

Нет. Этим способом могут воспользоваться те, кто уже работал с «движками» и неплохо знает WordPress. Воспользуйтесь другими конструкторами, если у вас нет опыта, но есть необходимость быстро разработать одностраничник, не колупаясь в коде или в плагинах.

  1. Можно ли найти уроки в формате видео по разработке лендинга на WP бесплатно и с использованием указанного плагина?

Таких материалов для данного плагина нет. Но есть для других дополнений, о которых упоминалось выше.

  1. Каким образом можно активировать стороннюю форму подписки?

Чтобы добавить сторонние формы, необходимо применить HTML-элемент, в который следует вписать код. Форму следует разместить в нужной области.

  1. Работать с указанным плагином не получается. Выскакивает сообщение об ошибке.

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

  • У вас получается конфликт дополнений. Следует удалить плагины, которые вам не нужны;
  • Тема, которая у вас установлена, является нестандартной. Поэтому следует изменить шаблон. Обязательно проверьте, не вносились ли какие-то изменения в него;
  • Проблемы с провайдером. При работе сайта на локальном сервере, плагин работать не будет. Необходимо, чтобы PHP поддерживался провайдером. Кроме того, лучше создавать одностраничники на последних версиях указанного языка программирования. Тогда плагин точно будет работать.
  1. Возможно ли применить эффект приближения элемента при наведении на него курсора, или «оживить» кнопки, чтобы придать современности лендингу?

Такого эффекта достичь удастся, используя опцию «Анимация». Кроме того, в ней имеется достаточно большое количество различных настроек.

  1. Работа со встроенными элементами возможна только до достижения двухсот лидов?

Нет. Это ограничение относиться лишь к форме подписки. Под понятием форма имеется в виду несколько полей, которые пользователь должен заполнить. После эти сведения будут получены администратором в панели управлении.

  1. Поисковики видят lending page?

Здесь проблем нет. Системы поиска видят целевую страницу не как лендинг, а как веб-ресурс, созданный на WP. Ускорить индексацию лендинга можно размещением на нем уникального и качественного контента. Совершить эту операцию можно через панель администрирования самого «движка» или через плагин.

  1. Лендинг «плывет» на мобильных гаджетах, а изменение настроек не решает проблему. Как быть?

Есть два варианта решения этой проблемы. Первый – сменить шаблон на адаптивный (возможно, тот который вы выбрали, не является адаптивным). Второй – обратиться за помощью к специалисту с просьбой сверстать мобильную версию сайта.

  1. Можно ли установить таймер на лендинг?

Увы, но разработчики плагин для таймера не сделали. Однако это не повод расстраиваться. В разделе «Плагины», который находится в админ. панели, имеются необходимые дополнения, позволяющие добавить таймер. Их установка не отразится на работе плагина для разработки одностраничника.

  1. Надо внести изменения в цветовую гамму и шрифты, но через плагин воплотить задуманное не получается.

Причин неудачи может быть множество. Быстрее и легче поставить «SiteOrigin CSS», который поможет внести нужные коррективы. Все необходимые действия следует совершать через WYSIWYG.

Вывод

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

Метки: Дизайн сайта Кейсы SEO SMM PPC Маркетинг Instagram Сайт визитка Landing Page Создание магазина Разработка сайтов Программирование

Создать лендинг на wordpress за 3 дня. Видеокурс. / Блог фрилансера wordpress

курс по созданию эффективных посадочных страниц

Что вы получите :

Экономию

Стоимость создания лендинга варьируется от 6-7 тыс. р. и больше

Собственный Landing Page

В ходе обучения вы создадите свою посадочную страницу, отвечающую целям вашего бизнеса

Увеличение продаж

Включите могучую силу интернета для увеличения клиентов в вашем бизнесе

Как создавать эффективные продающие лендинги

Краткое описание курса

Кто проводит курс

Александр Шульгинов — фрилансер-вебмастер.

Дипломированный программист (ННГУ им. Лобачевского).

Более 3-х лет профессиональной работы с сайтами.

Специализация – создание сайтов-визиток, блогов и небольших интернет-магазинов с дальнейшей техподдержкой. Консультации и обучение созданию сайтов.

Более 300 выполненных проектов.

Какие результаты вы можете получить:

Максимальные затраты на лендинг –  около 1000 руб в год.
Краткий срок создания – от 3-х дней.
Освоите актуальный навык.

При этом вам:

  • Не надо заморачиваться с техническими моментами по созданию сайтов.
  • Не надо ориентироваться в коде.
  • Вы научитесь подключать сервисы статистики и приёма заказов.
  • Научитесь подключать почту для домена.

Заказывать лендинг в студиях – дорого. Бывает, что студии не могут угадать, что заказчику конкретно нужно. А вы сами  свой бизнес знаете досконально и сможете его преподнести более понятно покупателю. Заказать сайт в студии – это цена от 6000р минимум, у фрилансера  –  чуть меньше. Научитесь делать посадочные страницы самостоятельно – приобретите бесценный навык и заработайте  на  создании лендингов для других людей.

Что будет, если вы оставите все как есть?

  1. Если у вас нет сайта, то и продаж через интернет, скорее всего, у вас тоже нет.
  2. Если сайт есть, приносит заявки, которые дают какую-то прибыль, но при этом вы понимаете, что используете мизерную часть от потенциала, который возможен. В таких условиях стоимость привлечения каждого клиента будет неоправданно подниматься и впустую сливать больше половины вашего бюджета.
  3. Вы хотите донести до клиентов интересное предложение, но 90% посетителей из-за неправильного проектирования страницы никогда о нем не узнают. Они были бы рады приобрести ваш продукт или услугу, но вы остаетесь в неведении, потому что не смогли грамотно оформить свое выгодное предложение.
  4. Потребность в изучении интернет-маркетинга растет с каждым днем. Его уже осваивают тысячи пользователей – ваших будущих конкурентов.
    Начните действовать уже сейчас, пока поезд еще не ушел.

Что вы получите применив знания полученные на курсе?

Деньги с новых клиентов.

Навык создания Landing Page на всю жизнь.

Полностью настроенный лендинг под вашу нишу

У вас получится хороший лендинг, даже если вы:

Ничего не знаете об интернет-маркетинге и дизайне

Считаете свои тексты корявыми

Занимаетесь слишком специфичной нишей

Почитайте отзывы тех, у кого это получилось:

Хочется сказать спасибо за уроки по созданию сайта. буквально за пару вечеров сделали лендинг. Александр все понятно объяснил, поражаюсь как у него хватило терпения все подробно разжевать по сайту

Антон Табунов

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

Роман Новиков

Прошел обучение у Александра и что хочу сказать. Научился создавать лендинг в очень короткие сроки. Курс по созданию лендингов очень понравился, все моменты были рассмотрены. По окончанию создал пару лендингов, смог сэкономить деньги, которые мог бы отдать программистам. Александр дает очень много советов, делая это в очень развернутом виде. Рекомендую курс к прохождению, все замечательно!!!

Иван Кубрак

Курс идеально подойдет

  • Начинающему предпринимателю
  • Владельцам бизнеса
  • Интернет-маркетологам
  • Начинающим фрилансерам
  • Владельцам авторских проектов
  • Бизнес-тренерам

Почему  именно  лендинг?

Мало кто понимает, что одностраничный сайт  —  сильнейший маркетинговый  инструмент.  И у вас есть  шанс опередить конкурентов.

Самые мощные преимущества:

  1. Создается в разы быстрее, чем сайт.
  2. Бюджет на его создание минимален.
  3. Результат — в разы больше.
  4. Можно очень быстро протестировать нишу с его помощью.

Вы сомневаетесь?

Допустим, что вы оставите все, как есть.  Постоянно растущая в интернете конкуренция увеличивает стоимость привлечения новых клиентов. В отдельных нишах она растет изо дня в день. А значит, постепенно будет уменьшаться маржа до тех пор, пока окончательно не поставит ваш бизнес на колени.

Ключевой показатель интернет-продаж  — конверсия сайта. Только увеличение ее  может быстро и действенно увеличить прибыль. При этом средства вы вкладываете всего один раз – в лендинг.

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

курс по созданию эффективных посадочных страниц

Создание landing page на WordPress

Категория: WordPress, Сайтостроение, Опубликовано: 2016-11-11
Автор:

Приветствую вас на сайте Impuls-Web!

Продолжаем рассматривать способы создания Landing Page и в данной статья я покажу вам как можно самостоятельно создать Landing Page на базе CMS WordPress.

В качестве примера я буду использовать CMS WordPress, но для создания Landing Page можно также использовать и другие движки.

Навигация по статье:

  • Выбор и настройка шаблона для Landing Page
  • Редактирование меню
  • Создание структуры Landing Page
  • Добавление карты на Landing Page
  • Доработка шаблона WordPress
  • Видеоинструкция

Выбор и настройка шаблона для Landing Page

Для создания Landing Page на WordPress большое значение имеет шаблон оформления сайта. Для лендинга было бы не плохо подобрать такой шаблон, у которого есть возможность выводить определенные виджеты в шапке сайта. Это понадобится для вывода контактных данных, а так же кнопки для заказа звонка или ей подобной.

Из бесплатных шаблонов WordPress для создния Landing Page я могу вам посоветовать тему Vantage.

Преимущества данного шаблона WordPress:

  • Позволяет выводить виджеты в правом верхнем углу шапки.
  • Имеет много различных настроек.
  • Есть два типа шапки.
  • Позволяет переключаться между двумя типами макета страницы (широкоформатная страница или с фиксированной шириной).
  • Адаптивный.
  • Можно изменять количество колонок в футере.
  • Бесплатный.

Основной недостаток шаблона:

  • Не даёт возможность настраивать цвета сайта из админки.

Установить данный бесплатный шаблон можно из репозитория WordPress.

Для этого в административной части сайта переходим в раздел «Внешний вид» => «Темы».
Далее нажимаем кнопку «Добавить новую», вводим название шаблона в поисковую строку, а затем устанавливаем и активируем данную тему.

Для настройки данного шаблона нужно сделать следующее:

  1. 1.Переходим в раздел «Внешний вид» => «Настроить».
  2. 2.Далее, переходим в раздел «Theme Settings», и здесь нажимаем на ссылку Logo, после чего, на ссылку «Выбрать файл» и загружаем изображение.
  3. 3.Так же, вы можете вместо надписи «Phone number» ввести свои контактные данные. Но я не советую вам это делать именно таким способом. Мы это лучше сделаем при помощи виджета.
  4. 4.Возвращаемся в предыдущее меню, нажимая на стрелочку в верхнем левом углу и переходим в раздел «Layout». Здесь мы можем выбрать один из видов макета страницы:

    «Boxed» – макет страницы с фиксированной шириной.

    «Full Width» – макет на всю ширину страницы.

  5. 5.В разделе Masthead Layout можно выбрать макет шапки для Landing Page
    «Default Masthead» — меню выводится под шапкой и справа можно вывести виджеты
    «Logo in menu» — меню располагается в один ряд с логотипом (виджеты в шапке в этом случае не выводтся)
  6. 6.Далее, возвращаемся в предыдущее меню. Переходим в раздел «Navigation», и здесь мы, прежде всего, ставим галочку «Mobile menu», что бы у нас на мобильных устройствах появлялось мобильное меню.
  7. 7.Далее, при желании, можно убрать эффект прилипающего меню. Для этого достаточно снять галочку «Sticky Menu».
  8. 8.Так же убираем галочку «Search in Menu», что бы убрать иконку поиска. Потому как нам на Landing Page поиск, в принципе, не нужен.
  9. 9.И в самом конце ставим галочку «Mobile Navigation».
  10. 10.Теперь нажимаем на кнопку «Сохранить и опубликовать». Нажимаем на крестик в левом верхнем углу и переходим в раздел «Внешний вид» => «Виджеты».
  11. 11.Здесь у нас есть область виджетов, которая называется «Header», в неё мы можем добавить свои контактные данные, либо кнопку для всплывающей формы. Для этого воспользуемся виджетом «Текст».
  12. 12.Если вам нужно указать просто один номер телефона, то вы можете ввести его в заголовке. Если же вам нужно будет вставлять какой-то фрагмент кода, или фрагмент текста, то вы вставляете его в поле «Содержимое».

    Здесь можно вывести всплывающую форму «Заказать звонок». Если вы не знаете, как на WordPress можно создать такую форму, то вот ссылка на статью с пошаговой инструкцией и видео.

  13. 13.Фрагмент кода из статьи про всплывающие формы нужно вставить в поле «Содержимое» в виджете «Текст». В данном коде нужно будет удалить или заменить надпись «Текст», заменить шорткод формы обратной связи на свой, а также изменить текст надписи на кнопке. Из этой же статьи можно взять CSS код для стилизации ссылки.
  14. 14.После этого нажимаем на кнопку «Сохранить».

Редактирование меню

Далее, переходим к редактированию меню Landing Page. Для этого:

  1. 1.Заходим в раздел «Внешний вид» => «Меню» и добавляем сюда нужные пункты как произвольные ссылки. Сейчас я здесь буду в качестве ссылки ставить решетку, а затем, когда у меня будет сформирована структура страницы, я буду здесь проставлять якоря, при помощи которых можно будет переходить в различные части страницы.
  2. 2.После того, как все пункты добавлены, смотрим, что бы у нас была выбрана область темы и нажимаем на кнопку «Сохранить меню».

Создание структуры Landing Page

Для облегчения работы по созданию структуры страницы воспользуюсь бесплатным плагином Page Builder By Site Origin.

На самом деле таких плагинов на сегодняшний день просто огромное количество. Я обычно использую именно этот из-за следующих преимуществ:

  • Данный плагин не даёт большой нагрузки на сайт.
  • Имеет визуальный редактор и набор дополнительных виджетов.
  • Помимо своих виджетов он позволяет так же задействовать стандартные виджеты WordPress, а так же виджеты других плагинов.
  • Позволяет создавать адаптивные страницы.
  • Работает практически со всеми шаблонами и плагинами WordPress.
  • Бесплатный.

Устанавливается он так же как и все остальные плагины.

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

  1. 1.Для этого создадим новую страницу. Заходим в раздел «Страницы» => «Добавить новую», назовем ее «Главная».
  2. 2.Здесь, сразу же в правой части окна, в поле шаблон, нам нужно выбрать «Full Width Page No Title». Это позволяет нам сделать данную Landing Page на всю ширину без использования сайдбаров и без вывода заголовка страницы.
  3. 3.Теперь мы видим, что у нас, помимо обычных вкладок «Визуально» и «Текст», появилась вкладка «Page Builder». Переходим на нее и здесь мы видим панель инструментов данного плагина. Для формирования структуры Landing Page мы будем использовать две основные кнопки, это «Добавить строку» и «Добавить виджет».
  4. 4.При добавлении строки мы можем задавать, сколько колонок будет расположено в этой строке. При этом можно регулировать ширину каждой из колонок путем перетаскивания границы. В моем случае сейчас понадобится одна колонка. После выбора параметров нажимаем на кнопку «Вставить».
  5. 5.Далее, мне нужно добавить в эту строку какой-то виджет. Для этого я кликаю по ней и затем нажимаю на кнопку «Добавить виджет».
  6. 6.Для того, что бы вывести в строке текст, форму или изображение можно использовать виджет «Site Origin Редактор». Единственное, для того, что бы этот редактор работал, нужно будет доустановить еще один плагин. Он называется «Набо виджетов Site Origin».
  7. 7.После вставки данного виджета наводим на него курсор и нажимаем на ссылку «Редактировать», после чего переходим по предложенной ссылке «набор виджетов Site Origin» для установки плагина, а затем активируем его.
  8. 8.Теперь вернемся к редактируемой странице, закроем данный виджет и нажмем на кнопку «Опубликовать» для того, что бы страница обновилась и WordPress увидел установленный плагин.
  9. 9.Теперь, если мы нажмем на ссылку «Редактировать» на добавленном виджете, то у нас откроется визуальный редактор, в котором мы можно добавить свой текст, изображение или шорткод. После внесения изменений нажимаем на ссылку «Выполнено».
  10. 10.Для задания фона для строки Landing Page наводим курсор на ключик в верхней правой части строки и выбираем здесь пункт редактировать строку.
  11. 11.У меня открывается панель с правой стороны, которой есть три вкладки: «Атрибуты», «Макет» и «Дизайн».

    На вкладке «Атрибуты» можно дописать для этой строки дополнительный идентификатор, дополнительный класс строки, дополнительный класс для ячеек, которые будут размещаться внутри данной строки, а так же можно здесь прописать css-свойства.

    На вкладке «Макет» можно задать нижний отступ для данной строки, межстолбцовый промежуток, в том случае если в одной строке будет несколько столбцов, а так же внутренний отступ с верху, справа, снизу и слева.

  12. 12.Для того, что бы строка была на всю ширину страницы, нужно изменить здесь макет строки. По умолчанию он будет как бы обрезанный, то есть, с фиксированной шириной. Чтобы сделать его на всю ширину, выбираем пункт «Во всю ширину».
  13. При этом, фон будет распространяться на всю ширину, а контент будет идти с фиксированной шириной. Для того чтобы контент был на всю ширину окна, нужно выбрать «Во всю ширину (растянуто)».

  14. 13.Теперь переходим к вкладке «Дизайн». Здесь мы можем задать цвет фона, нажив на кнопку выбрать цвет. Открывается палитра, в которой можно задавать тот цвет, который вам больше нравится.
  15. 14.Так же, вы можете здесь выбрать какое-то фоновое изображение для данной строки . Для этого нажимаем на кнопку выбрать изображение и загружаем его с компьютера.
  16. 15.На этой же вкладке можно задать позицию фонового изображения и применить к нему паралакс-эффект. После внесеия изменений нажимаем на кнопку «Выполнено» в нижнем правом углу.
  17. 16.Для того чтобы увеличить высоту определённой строки можно задать для неё верхний и нижний отступ. Для этого на панели редактирования строки переходим на вкладку «Макет».

Теперь аналогичным образом добавим еще одну строку с несколькими блоками.

Нажимаем на ссылку «Добавить строку», задаем здесь четыре колонки и нажимаем «Вставить». Теперь добавляем в одну из колонок тот же виджет «Site Origin Редактор».

Для данного виджета можно, точно так же как и для строки, задать различные параметры. Нажимаем на ссылку «Редактировать» точно так же справа, видим три вкладки: «Атрибуты», «Макет» и «Дизайн». Содержимое этих вкладок немного отличается от тех, которые были для строки.

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

Что бы каждый раз не добавлять один и тот же виджет по новой, мы можем его просто копировать. Для этого наводим на него курсор и нажимаем на ссылку «Копировать», а потом просто зажимаем левую кнопку мишки и перетаскиваем этот виджет в другие блоки.

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

Для удаления строки, точно так же, наводим указатель на ключик и нажимаем на ссылку удалить строку, а затем нажимаем на ссылку «Вы уверены».

Вот таким образом вы можете добавлять другие строки и блоки на вашу Landing Page и заполнять их текстом и изображениями.

Добавление карты на Landing Page

В Landing Page часто используются карты Яндекс или Google. Для того, что бы добавить такую карту, вам нужно:

  1. 1. Cгенерировать скрипт на специальном сервисе Яндекса или Google. Более подробно о том, как это сделать вы можете узнать из следующих статей:

    Как вставить карту яндекс на сайт WordPress
    Как добавить гугл карту на сайт

  2. 2.Добавляем новую строку. Делаем для нее ширину 100%, после чего, в разделе макет нам нужно задать «Во всю ширину (растянуто)», и сделать нижнее поле 0 px. Нажимаем на кнопку «Выполнено» и добавляем в эту строку виджет текст.
  3. 3.Теперь в данный виджет нам нужно вставить скрипт, который мы получили в сервисе Яндекс.Карты.
  4. 4.Далее, нажимаем на кнопку «Выполнено» и нажимаем на кнопку «Обновить» чтобы изменения применились.

Доработка шаблона WordPress

В данном шаблоне у нас еще присутствует отступ снизу и отступ сверху. К сожалению, в настройках шаблона они не убираются, поэтому их можно убрать путем внесения правок в файл стилей данного шаблона WordPress.

Более подробно о внесении изменений в тему WordPress, вычислении классов, идентификаторов и дописании им дополнительных свойств вы можете узнать из этой статьи:

Изменение темы WordPress. Определение Class и ID

Если вы будете использовать данный шаблон для создания своей Landing Page, то вам нужно будет в конце файла style.css для блока с идентификатором main задать следующие свойства:

#main{ padding:0px!important; }

#main{

padding:0px!important;

}

После чего нажать на кнопку «Обновить файл».

Видеоинструкция

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

Если статья была для вас полезной – не забудьте нажать на одну из кнопок соцсетей ниже.
А также подписывайтесь на рассылку чтобы не пропустить ничего нового.
Хорошего вам дня! Жду вас в следующей статье 🙂

С уважением Юлия Гусарь

Как сделать лендинг на вордпрессе | Centum

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

Популярные плагины WordPress для создания лендингов

Лендинги на WordPress создаются при помощи специальных инструментов — плагинов. Существует огромное количество как бесплатных, так и платных решений. Лучшими бесплатными плагинами считаются WPLead, Free Landing Pages Builder by Wishpond, Long Form Storybuilder, Ultimate Landing Pages. Из платных конструкторов доверия заслуживают Optimize Press, wPPage, Visual Composer, Divi Builder, Thrive Landing Pages.

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

Алгоритм создания лендинга на WordPress

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

Для создания страницы приземления на WordPress необходимо выполнить следующий порядок действий:

  1. Установить и активировать плагин. Для этого нужно скачать нужный инструмент из репозитория WordPress.
  2. Создать новую страницу. При этом желательно выбрать из числа предлагаемых тем ту, которая позволяет вывести в шапке лендинга контактную информацию и форму обратной связи. Предпочтительнее, чтобы используемый в теме шрифт был без засечек.
  3. Выбрать шаблон. После предпросмотра из библиотеки готовых шаблонов нужно выбрать и установить понравившийся шаблон. Предпочтение лучше отдавать шаблонам с минималистичным дизайном, чтобы основное предложение выделялось на его фоне.
  4. Оформить лендинг. Наступает очередь для редактирования и наполнения информацией каждого из модулей будущего лендинга. На этом этапе задействуются такие возможности плагина, как очистка содержимого страницы, добавление/удаление строк, замена цвета кнопки СТА, вставка заголовков в каждый из блоков, загрузка изображений и т.д. В результате экспериментов с настройками появляется целевая страница, спроектированная согласно вашим критериям.

За созданием качественного лендинга на платформе WordPress обращайтесь к специалистам компании «CENTUM-D». С нашей помощью вы получите лендинг с правильно расставленными акцентами, что обеспечит ему высокую конверсию.

Как сделать лендинг WordPress: 5 интересных плагинов

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

  • полностью внедряемые в состав Вордпресс в качестве традиционного расширения;
  • внешние дополнения, которые интегрируются с сайтом.

В обзоре расширений указывается, что представляет собой конкретный инструмент – к какой категории он относится.

Обратите внимание! Плагины постоянно обновляются, улучшаются. Появляются новые. Поэтому, возможно, когда вы будете читать эту статью, уже разработают другие дополнения, более эффективные, рациональные, удобные.

1. OptimizePress

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

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

Обратите внимание! Если нет желания начинать конструирование целевой страницы с нуля, плагин имеет несколько десятков полностью бесплатных шаблонов. Дополнительно предусмотрены платные шаблоны – их более 100.

Однако у OptimizePress предусмотрены прочие функции, которые не требуются для посадочных страниц. Это негативно отражается на его стоимости. На момент написания статьи за плагин нужно было «отвалить» 97 долларов – в цену включено использование до трех сайтов. Если вам нужны дополнительные функции, можете смело покупать расширение.

2. Thrive Landing Pages

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

Среди основных преимуществ Thrive Landing Pages стоит выделить возможность формировать страницы с нуля. То есть, за границами темы WordPress. Для этого у плагина предусмотрены все необходимые элементы.

Если нет желания заниматься конструированием с нуля, можете использовать существующие шаблоны. Их более 150 – есть из чего выбрать.

Обратите внимание! На создание эффективной воронки продаж с приличным видом не потребуется много времени.

Хотя у шаблонов есть ряд минусов. Они точно не понравятся людям с творческим мышлением. В целом, они едва ли не идеально оптимизированы, но подходят далеко не для всех проектов.

3. SeedProd

Оптимальный вариант для еще не запущенных сайтов. Посредством плагина легко создавать страницы для сбора подписчиков. То есть, вам не нужно ждать, пока основной проект будет готов к работе – заниматься формированием базы можете сразу же.

Обратите внимание! Расширение выпускается в двух «форматах». Платная и бесплатная версия. Стоимость Pro – от 29 долларов за один проект. А еще тут есть много шаблонов и дополнительных функций.

Бесплатная версия также довольно функциональна, однако платная более удобная. Во-первых, за счет того, что она легко совмещается с разными сервисами рекламной почтовой рассылки. Например, такими известными, как MailChimp и AWeber. Не имея возможности такой интеграции (как в случае с бесплатным расширением), собрать базу подписчиков будет нереально.

Так что если основная задача создания landing page состоит в привлечении подписчиков перед запуском основного проекта, SeedProd подходит для этого наилучшим образом.

4. Leadpages

Хорошее расширение. Но имеет один существенный недостаток – дороговизна. Стоимость использования – от 25 долларов за месячное использование. Наименьший тариф возможен только при покупке доступа сразу на 12 месяцев.

Однако в целом плагин характеризуется удобством, простотой работы и быстротой создания посадочных страниц. Среди его основных преимуществ стоит выделить:

  • почти 400 готовых и оптимизированных шаблонов, у которых имеются различные стили, хотя только около 70 шаблонов полностью бесплатные;
  • каждый шаблон можно менять под себя и личные требования к посадочной странице – делается это в редакторе плагина;
  • расширение позволяет загружать в себя фактически все. Поэтому, если вам необходимо подгрузить PDF или файлы в другом форматом, не стоит беспокоиться по этому поводу;
  • когда страница будет готова, достаточно кликнуть по одной кнопке, чтобы целевая страница оказалась на Вордпресс.

5. WordPress Landing Pages

Разработка – классный «конструктор» для строительства целевых посадочных страниц. В нем предусмотрено множество дополнений премиум-класса. У расширения имеются, как положительные, так и негативные моменты.

Начнем с плюсов конструктора:

  • возможность разработки страницы «с нуля»;
  • создание лендинга на основе шаблона;
  • наличие бесплатной версии.

К сведению! Разработка позволяет выполнить А/В тестирование посадочной страницы. Выявлен проигрышный вариант? Не нужно беспокоиться – он автоматически будет остановлен.

Хотя есть и у этого «проекта» и негативные моменты:

  • существующие шаблоны не слишком привлекательны – все-таки придется выполнять разработку с нуля;
  • главные функции, необходимые для нормальной работы лендинга, отсутствуют в бесплатной версии.

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

Промежуточный итог: какое расширение из перечисленных выбрать

В зависимости от ваших финансовых возможностей. Нет ограничения бюджета? Рекомендуем Leadpages. Он весьма удобен в работе, функционален. Хотя разобраться в нем смогут не все.

Если учитывать такие факторы, как финансовая доступность, простота использования и функциональность, рекомендуем обратить внимание на Thrive Landing Pages. У разработки практически нет недостатков. Разве что, кроме одного – шаблоны выглядят несовременными. Однако проблема – надуманная. Поскольку предусмотрена возможность настройки под свои требования и пожелания.

Шаблон для посадочной страницы: каким он должен быть

Вы уже знаете, что такое посадочная страница, как она работает и как ее сделать самостоятельно, посредством специальных плагинов. Теперь расскажем о том, как подобрать шаблон для landing page, дабы можно было не только поместить на нем требуемые элементы, но и сделать проект максимально эффективным.

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

Три кита, на которых базируется удобный и эффективный шаблон для посадочной страницы:

  • адаптивная верстка и дизайн;
  • валидность;
  • быстрая скорость загрузки.

В настоящее время пользователи имеют возможность выбирать разные шаблоны, среди которых:

  • со встроенными формами для обратной связи;
  • формами подписки;
  • встроенными таймерами различного типа;
  • с эффектом параллакс;
  • с полноэкранными картинками и видео;
  • и многие другие.

Однако нужно понимать, что оформление целевой страницы – это не только внешняя привлекательность. Оно способствует эффективной конвертации даже случайных посетителей в реальных клиентов. Посредством качественного и продуманного дизайна удается привлечь внимание пользователей к определенным местам, точкам, элементам. Благодаря таким акцентам вся представленная на сайте информация будет восприниматься адекватно.

Мы подготовили основные требования, которые нужно учитывать, подбирая шаблон для своего лендинга.

6 моментов, учитываемых при выборе шаблона

  1. Высота первого экрана посадочной страницы не должна быть более 700 пикселей. Исключения возможны, но в крайних случаях.
  2. Главный заголовок страницы (Н1) следует помещать либо по центру, либо в левой части экрана. Не забывайте о читабельности заголовка. Возможно, под словами нужно поставить полупрозрачную подложку.
  3. Не рекомендуется выбирать шаблоны, в которых используется более двух шрифтов. Или шрифты с засечками.
  4. Отдавайте предпочтение шаблонам с большим объемом свободного места. Темы, в которых все слишком нагромождено, зажато, выглядят не слишком привлекательно. Минималистическое оформление привлекает внимание к основным элементам, позволяет правильно расставить акценты и выделить кнопки целевого действия.
  5. Сама кнопка должна контрастировать с фоном. Это касается, как ее цвета, так и формы.
  6. Форма для заполнения должна иметь минимально возможное количество полей.

Обратите внимание! Если есть огромное желание, можно попробовать своими руками внести изменения в файлы шаблона и стилей. Или, например, добавить какой-то другой шрифт, изменить существующий. В таком случае удается добиться наиболее точного соответствия оформления и уникального торгового предложения.

Как сделать landing на WordPress: в завершение

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

Хотя далеко не всегда у человека имеются необходимые знания, как технические, так и в сфере маркетинга, позволяющие создавать эффективные, конверсионные посадочные страницы.

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

как сделать лендинг с помощью плагинов

Интернет-маркетинг и Landing Page практически стали синонимами. И совершенно обоснованно – при грамотном использовании можно превратить лендинг в мощное рекламное оружие массового поражения. Если вы нуждаетесь в срочном создании посадочной страницы для своего бизнеса, найти специалиста не составит труда. А можно попробовать сделать лендинг на WordPress самостоятельно. Рассмотрим основы и тонкости создания посадочных страниц на одном из самых популярных в мире движков. А также расскажем о самых эффективных плагинах и оптимальных темах, которые однозначно пригодятся вам в процессе работы.

Landing Page: Общая информация

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

В переводе с английского Landing Page означает «страница посадки». Так называется веб-страница, направленная на повышение конверсии бизнес-проекта в интернете. Пользователь переходит на лендинг по ссылке – например, кликая на контекстную рекламу. Основная задача Landing page – подтолкнуть посетителя к выполнению определенного действия: регистрация, подписка, покупка товара.

Простыми словами, принцип действия Landing Page основан на лозунге «Купи или умри».

Никаких альтернативных действий не предусмотрено – только одно целевое. Как правило, все лендинги имеют приятный дизайн, информативное содержание.

10 принципов создания качественной посадочной страницы

Используя WordPress для создания Landing Page, важно придерживаться ключевых принципов работы и не отходить от них ни на шаг. О каких принципах идет речь?

  1. Размещение логотипа. Элемент крайне желателен – он повышает доверие к вам как к надежному поставщику товаров или услуг.
  2. Дескрипшен. Ни одна посадочная страничка не обходится без короткого текста, в котором вы описываете основной род деятельности своей компании.
  3. Контактные данные. Для потенциального клиента связь с вами должна быть максимально простой и удобной. Для этих целей можно использовать номер мобильного, почту, кнопку заказа (Заказать звонок) и пр.
  4. Заголовок. Под что создается классический лендинг? Правильно – под УТП. Ваше уникальное торговое предложение должно находиться в заголовке. Желательно, чтобы он состоял из продающей части (ярко-выраженной и лаконичной), а также подзаголовка, обозначающего выгоды.
  5. Слайд-шоу, картинка или видео, демонстрирующие вашу услугу/товар. Они усиливают эмоциональное воздействие, демонстрируют выгоды при взаимодействии с продуктом.
  6. На движке ВордПресс лендинг пейдж никогда не обходится без кнопки СТА, призывающей потенциального клиента к совершению определенного действия.
  7. Форма обратной связи. Также может размещаться в верхней части страницы.
  8. Далее идет оффер – самая объемная часть лендинга. В данном блоке будет уместна конкретика, более подробно расписывающая привлекательность вашего предложения.
  9. Описав реальные преимущества, не лишним будет сделать блок доказательства авторитетности бренда, окончательно подталкивающего потенциального клиента к принятию решения.
  10. Завершающая часть. Здесь может находиться форма связи, СТА, дополнительные контактные данные и пр.

ТОП-15 тем для создания Landing Page на WordPress

Перечислим 15 привлекательных и абсолютно бесплатных тем для лендинга – каждый шаблон WordPress тщательно проверен и опробован.

  1. Llorix One. Одностраничник с минималистичным и в то же время привлекательным дизайном, параллакс скроллингом. Оптимальное решение для стартапа и компании, представляющей малый бизнес.
  2. Zerif Lite. Тема, которая отличается от других высокой функциональностью и большим набором приятных опций. Интерфейс яркий и ненавязчивый, реализован parallax effect и анимация. Кстати, Zerif Lite – полностью кроссбраузерная тема, с точки зрения кода она написана очень качественно.
  3. Alhena Lite. Далеко не все бесплатные landing page шаблоны для WordPress из ТОПа могут похвастаться интеграцией с плагином WooCommerce. А Alhena Lite может. Подходит и для лендинга, и для настройки интернет-магазина.
  4. AccessPress Basic. Практически идеальный инструмент для презентации бизнес-продукта. Состоит из множества интересных дополнений, упрощающих настройку и дальнейшее управление лендинг-структурой.
  5. FotoGraphy. Лендинг для тех, кто занимается дизайном и фотографией.
  6. Креативным личностям, предпринимателям и владельцам бизнеса можно посоветовать шаблон WordPress лендинга под названием Integral Theme. Тема одностраничная, есть parallax, настройка занимает несколько минут.
  7. Enliven. Несмотря на бесплатность, это действительно премиальная тема, сочетающая великолепное качество и привлекательный внешний вид в одном флаконе. Поддерживает большинство популярных плагинов, настройка не вызовет сложностей даже у новичка.
  8. The Monday. Фрилансеры и начинающие бизнесмены обязательно обратят внимание на тему The Monday. Лучшего решения для презентации своих услуг в интернете просто не найти!
  9. Hestia. Креативный Landing шаблон, который выполнен в виде сайта-одностраничника. Характеризуется плавным скроллингом, адаптивным дизайном. Уже оптимизирован для SEO, для смены футера можно использовать виджеты.
  10. Sydney. Элегантное решение для предприятий, имеющее полноэкранный слайдер, подвал с поддержкой виджетов. Много шрифтов Google, социальные ссылки тоже есть.
  11. Ember. Зачем покупать дорогую тему landing page для WordPress, когда есть шаблон Ember? Прекрасно подходит для агентств, малых предприятий, имеет красочный интерфейс, поддержку параллакса. Иконки симпатичные, дизайн многоцелевой.
  12. Gaga Lite. Интерактивный шаблон, который подойдет для любых бизнес-задач. Характеризуется SEO-оптимизацией, богатым выбором макетов и виджетов, наличием таблицы цен и прочими плюшками.
  13. На HTML5/CSS3 создана одностраничная тема OneTone. Ее характерной особенностью является полноэкранный слайдер, возможность интеграции презентационного ролика с YouTube, адаптивный, ненавязчивый дизайн.
  14. Как насчет параллакс темы с поддержкой более 600 Google шрифтов и 60 анимационных эффектов? Попробуйте One Engine – красочный шаблон ВордПресс для лендинга.
  15. Minimable завершает наш рейтинг лучших тем для landing page. Меню навигации выглядит просто великолепно, цвета спокойные, навигация удобная. Тема адаптирована для Retina, создавалась на базе Bootstrap.

 Подборка лучших плагинов ВордПресс для разработки Landing Page

В завершение рассмотрим еще один вопрос: как сделать landing page на wordpress с использованием разнообразных плагинов? Советуем воспользоваться такими дополнениями:

  1. Landing Pages. В основе модуля – удобный конструктор лендинг пейдж. Можно отслеживать посещаемость, привлекать новых подписчиков.
  2. Ultimate Landing Page. Как создать посадочную страничку и при этом не написать ни одной страницы кода? Правильно – воспользоваться плагином Ultimate landing Page. Мощная база шаблонов!
  3. Beaver Builder. Плагин с поддержкой опции drag and drop, делающих создание эффективных сайтов удобным и понятным для каждого веб-мастера.
  4. Landing Pages Builder. Еще один конструктор, с которым дружат поисковики.
  5. Maintenance Page. Модуль с возможностью добавить на лендинг лого и фоновый рисунок, а также социальные кнопки.

Выводы

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

Поделитесь со своими друзьями

Как создать целевую страницу в WordPress

В этом руководстве мы рассмотрим, как создать и спроектировать целевую страницу в WordPress с помощью Elementor. Мы рассмотрим основные шаги и рекомендации, которым необходимо следовать, чтобы создать эффективный дизайн.

Существует множество способов создания успешных целевых страниц.

«Почему следует следовать именно этому руководству, а не другим?»  вы можете спросить.

Это пошаговое руководство имеет несколько ключевых преимуществ:

  1. Бесплатный конструктор целевых страниц . Вы создадите целевую страницу с помощью нашего ведущего бесплатного конструктора целевых страниц WordPress без дополнительных плагинов WordPress.
  2. Без кода — Вам не придется иметь дело с одной строкой кода CSS или PHP, а также с дочерними темами — или какими-либо техническими ноу-хау в этом отношении.
  3. Высокая конверсия . В этом руководстве мы уделяем особое внимание созданию целевой страницы, которая не только выглядит красиво, но и создана для повышения конверсии.

Во-первых, давайте начнем с краткого объяснения того, что такое целевая страница и чем она отличается от домашней страницы. Затем мы покажем вам, как создать собственную целевую страницу.

Содержание

  • Что такое целевая страница?
  • В чем разница между домашней страницей и целевой страницей?
  • Как создать целевую страницу в WordPress: пошаговое руководство
  • Дополнительные приемы: липкое меню и якорь
  • Последний трюк: скрытие навигации

Что такое целевая страница?

Целевая страница — это страница на вашем веб-сайте, созданная специально для определенной маркетинговой кампании. Целевые страницы создаются с учетом четких целей призыва к действию (CTA), и они часто обеспечивают более высокие коэффициенты конверсии, чем обычные сообщения в блогах или страницы сайта. Они также являются хорошим источником для привлечения потенциальных клиентов и создания списка адресов электронной почты в маркетинговых целях, а также для обеспечения присутствия в социальных сетях.

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

В чем разница между домашней страницей и целевой страницей?

Хотя посетитель, безусловно, может «попасть» на вашу домашнюю страницу, это не означает, что ваша домашняя страница является целевой.

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

Этот общий подход отлично подходит для знакомства людей с вашим брендом. Однако это не очень хорошо, если вы хотите, чтобы посетители выполняли одно конкретное действие.

Вот тут-то и появляются целевые страницы:

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

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

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

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

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

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

Зачем использовать Elementor вместо редактора блоков WordPress по умолчанию? Ну, есть несколько причин:

  • Визуальный дизайн с перетаскиванием — Elementor предоставляет вам доступ к гораздо более мощному визуальному редактору дизайна с перетаскиванием. Поскольку у вас больше контроля над дизайном, вы можете убедиться, что каждая часть вашей целевой страницы идеальна.
  • Шаблон пустого холста — Elementor позволяет создавать целевые страницы, используя пустой холст, который скрывает верхний и нижний колонтитулы, чего редактор блоков не предлагает по умолчанию. Как мы обсуждали выше, скрытие навигации является хорошей практикой для целевых страниц, поскольку позволяет устранить отвлекающие факторы и сфокусировать целевую страницу на подталкивании пользователей к определенному действию.
  • Управление целевой страницей — Elementor предоставляет вам специальную область управления целевой страницей. Это позволяет отделить целевые страницы от обычных страниц контента.
  • Маркетинговые элементы — Elementor включает в себя множество встроенных маркетинговых элементов, которые помогут вам оптимизировать ваши целевые страницы и избавят вас от необходимости использовать сторонние плагины. Например, вы можете добавлять формы с помощью виджета «Формы» и легко интегрировать их с вашей CRM или службой маркетинга по электронной почте.
  • Шаблоны целевых страниц — в то время как Elementor позволяет легко создавать великолепные целевые страницы с чистого листа, у вас также есть возможность импортировать один из профессионально разработанных шаблонов целевых страниц Elementor, а затем настроить его в соответствии со своими потребностями.

Вы готовы создать свою первую целевую страницу? Вот как это работает:

Первоначальная настройка

Чтобы следовать этому руководству и создать собственную целевую страницу, вам понадобятся три инструмента:

  1. Сайт WordPress (обязательно)
  2. Бесплатный плагин Elementor (обязательно)
  3. Elementor Pro (необязательный, но очень полезный для целевых страниц)

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

Когда у вас есть сайт WordPress, плагин Elementor добавляет визуальный интерфейс дизайна с перетаскиванием, который вы можете использовать для создания своих целевых страниц. Плагин Elementor бесплатен и доступен на WordPress.org — вы можете установить его, перейдя в Плагины → Добавить новый и выполнив поиск «Elementor». Перейдите сюда для получения более подробных инструкций.

Elementor Pro расширяет бесплатный плагин Elementor рядом функций и вариантов дизайна, которые могут улучшить ваши целевые страницы. Например, Elementor Pro предоставляет вам виджет «Форма», который вы можете использовать для создания всевозможных форм подписки или захвата лидов. Чтобы использовать его, вам необходимо приобрести Elementor Pro, а затем установить его на свой сайт вместе с бесплатным плагином Elementor.

Целевая страница, которую вы создадите

Вы будете создавать страницу, которая включает:

  1. Верхний раздел — Это занимает большую часть нашего экранного пространства. Он состоит из заголовка, некоторого текста и кнопки призыва к действию — это приведет пользователя к нашей форме.
  2. Раздел меню навигации — Эта область помогает посетителю сайта быстро перейти к любой части нашей целевой страницы.
  3. О разделе — Важный раздел, который расскажет нашим посетителям больше о нашем бизнесе или услугах.
  4. Раздел функций — Список функций с большим изображением слева.
  5. Раздел галереи — Для этого раздела мы создали уникальный макет галереи, используя комбинацию виджетов с некоторыми изображениями, текстом, значками социальных сетей и фоновым видео.
  6. Раздел формы — Здесь мы включили контактную форму, которая позволит нашим посетителям легко связаться с нами.

Итак, приступим!

Шаг 1. Создайте новую целевую страницу

Как мы упоминали выше, одним из преимуществ использования Elementor является то, что он предоставляет вам специальный интерфейс для управления вашими целевыми страницами вместо того, чтобы смешивать их с вашими обычными страницами контента WordPress.

Чтобы создать свою первую целевую страницу, перейдите в Шаблоны → Целевые страницы и нажмите кнопку Добавить новую целевую страницу .

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

Шаг 2. Настройка цветов, шрифтов и палитры цветов

Прежде чем приступить к фактическому дизайну целевой страницы, важно правильно настроить визуальный редактор.

Когда вы создаете новую целевую страницу, Elementor автоматически применяет макет страницы Elementor Canvas. Это дает нам «чистую» страницу без верхнего, нижнего колонтитула или боковой панели. Это хороший вариант для создания целевой страницы.

Затем мы устанавливаем глобальные цвета по умолчанию следующим образом: первичный — белый, вторичный и текст — черный. Цвета по умолчанию будут установлены автоматически, когда мы добавим новый виджет, что значительно упростит нашу работу.

Проделаем то же самое со шрифтами. Я установил свой основной и дополнительный шрифт заголовков на шрифт Adobe Typekit (восстановление), но вы можете установить свой собственный шрифт по своему усмотрению.

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

Шаг 3: Верхняя часть целевой страницы

Наша верхняя голубая секция включает в себя заголовок, текстовый редактор и виджеты кнопок.

Что здесь особенного: Режим наложения фонового изображения и перекрывающиеся заголовки.

Как мы это сделали: Устанавливаем синий цвет фона. Наложение фона дает нам возможность установить еще один слой поверх, на этот раз установить наложение изображения. Режим наложения — это новая опция в Elementor 2.1. Что он делает, так это смешивает наложение со светло-голубым фоном. Мы выбираем Multiply или Darken и проверяем, как это влияет на изображение.

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

Шаг 4: Заголовок и область навигации

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

Что здесь особенного: Навигационные ссылки, которые помогают посетителю прокрутить страницу до нужного места.

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

Шаг 5. Область сведений

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

Что здесь особенного : Значок перекрывается заголовком

Как мы это сделали : Мы уменьшили размер значка и установили нижнее минус поле.

Шаг 6: Дизайн области функций

Этот раздел включает большое изображение Vespa слева и список из 3 услуг справа.

Что здесь особенного : Для этого раздела функций мы повторяем эффект фонового значка, который мы использовали в предыдущем разделе.

Как мы это сделали : Чтобы получить этот эффект, мы установили параметр поля для виджета значка на 40 пикселей по нижнему полю и -20 по левому краю. Мы можем дублировать эту первую услугу 3 раза.