Как создать лендинг на wordpress
Перейти к содержимому

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

  • автор:

Лендинг пейдж на WordPress — Elementor, Beaver builder и другие

Что такое лендинг пейдж лендинг пейдж становится понятно из перевода оригинала «Landing Page», это «страница приземления» она же посадочная страница, она же страница входа или опорная страница.

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

Статическая страница WordPress

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

Активация статической страницы находится на вкладке Настройки>>>Чтение>>>На главной странице отображать.

Активация статической страницы для лендинг пейдж на WordPress Активация статической страницы

Важно! Данная настройка сработает только тогда, когда на сайте создана и опубликованная хотя бы одна страница.

По умолчанию, на системе стоит демонстрационная страница «Привет мир!». Если вы её удалили, то настройка активации статической страницы показываться не будет.

Создать страницу сайта WordPres можно на вкладке консоли Страницы>>>Создать новую. Напомню, что страницы WordPress не объединяются в рубрики и не участвуют в таксономии сайта.

Общая идея создания лендинг пейдж на WordPress

Идея создания лендинг пейдж на WordPress проста. Для создания опорной страницы, страницы входа нужно создать красивую страницу (page) сайта и активировать настройку «статическая страница WordPress», выбрав созданную страницу, как главную.

Идея проста, но … простыми инструментами создать красивую страницу, будет сложно. Что делать?

Я нашел выход в плагине «Beaver builder lite version». С припиской «lite version» этот плагин бесплатный. Плагин постоянно обновляется, имеет боле 300-х тысяч скачиваний и идеально подходит для создания уникальной лендинг пейдж на WordPress.

Примечание: Конечно это не единственный подобный плагин, аналоги списком в конце статьи. Этим плагином я хочу продемонстрировать саму возможность создания лендинг страниц на WordPress.

Elementor — конструктор веб-сайтов

Плагин Elementor это отличное решение для тех, кто хочет создать свой сайт “вживую”. С помощью сотни виджетов и технологии Drag and Drop вы можете в режиме реального времени построить свою тему и принципиально создать новый сайт WordPress. Elementor это конструктор без ограничений возможностей. Доступен в бесплатной версии пригодной не только для ознакомления. Для профессиональных решений лучше купить Elementor Pro, например, на сайте https://sergeev.studio/elementor-pro/. Плагин обеих версий отлично переведен, прост в освоении. Рекомендую попробовать и самостоятельно оценить все уникальные возможности этого плагина.

Elementor для лендинг пейдж на WordPress

Лендинг пейдж на WordPress плагином Beaver builder

Страница плагина в официальном архиве: ru.wordpress.org/plugins/beaver-builder-lite-version .

Если вы забыли, как установить плагин, читаем статью тут. Считаем, что плагин установлен и активирован.

Плагин отлично переведен, что отличает его от других аналогичных расширений.

После активации плагина, в редакторе страниц (вкладка Страницы>>Создать) появляется вкладка «Конструктор». Именно она нам нужна.

Конструктор Beaver builder работает по технологии drag-and-drop – перетаскивание нужных модулей в рабочее поле страницы. Для примера я создам несложную страницу с фото.

Конструктор Beaver builder для лендинг пейдж на WordPress

Шаг 1. Создаем страницу

Идем на вкладку Страницы>>Добавить новую. В редакторе видим новую кнопку «Конструктор». Открываем «Конструктор».

Создаем страницу

Конструктор открыт

Шаг 2

Конструктор работает по технологии drag-and-drop, интуитивно понятен. Просто собираете свою страницу из предлагаемых модулей: HTML, Фото, Аудио, Видео, Текстовой редактор.

Конструктор работает по технологии drag-and-drop

Шаг 3

После сборки страницы жмём «Готово»;

страница лендинг пейдж на WordPress готова

Далее сохраняем страницу как черновик или сразу публикуем.

сохраняем страницу

Шаг 4

Идем в консоль на вкладку «Страницы». Видим в списке страниц созданную страницу в конструкторе.

страница создана

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

Страницу нужно опубликовать.

Шаг 5

Идем в настройки сайта на вкладку «Чтение» и выбираем созданную страницу, как главную.

назначаем страницу как главную

Шаг 6

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

Смотрим результат лендинг пейдж на WordPress

Другие плагины для лендинг пейдж на WordPress

Лендинг пейдж на WordPress можно сделать другими плагинами:

Landing Page Cat

Этот плагин WordPress Landing Page позволяет создавать красивые, простые и высокопроизводительные целевые страницы. Очень прост в управлении.

Landing Page Builder

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

Конструктор страниц: Live Composer

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

WordPress Landing Pages

Был отличный конструктор, но перестал обновляться после версии 4.8.6.

Общий вывод

Как видите конструкторов лендинг пейдж на WordPress не мало, выбор за вами. Остается вспомнить, что заказ платной посадочной страницы обойдется вам 25000-75000 рублей, есть повод самостоятельно поработать с WordPress. Используя WordPress, и конструктор страниц не обязательно создавать сайты, можно ограничиться одной целевой страницей.

Еще статьи

  • Модуль дополнительных боковых виджетов Jetpack в новом интерфейсе
  • Анонс, цитата, автоматическая цитата в статьях WordPress
  • Как создать дочернюю тему WordPress: самостоятельно и при помощи плагинов
  • Как изменить адрес сайта WordPress: техническая задача без SEO
  • 27 лучших плагина WordPress, которые вы должны использовать в этом году
  • Почтовая служба WordPress.com, бесплатная рассылка на любом WordPress сайте
  • Лендинг пейдж на WordPress — Elementor, Beaver builder и другие

Похожие посты:

  • 27 лучших плагина WordPress, которые вы должны использовать в этом году
  • Плагин Elementor для WordPress
  • Как сделать лендинг пейдж на WordPress собственными руками
  • Первые плагины сайта WordPress
  • Закрыть WordPress на техническое обслуживание
  • Лендинг страница на WordPress — плюсы и минусы
  • Плагины WP для установки favicon (иконок) на сайт WordPress
  • Как добавить постраничную навигацию на сайт WordPress
  • 3+ Плагины кнопки наверх WordPress

Как​ ​сделать​ ​лендинг​ на​ ​WordPress

Как​ ​сделать​ ​лендинг​ на​ ​WordPress

Если перед вами стоит такой вопрос, то, вероятнее всего, лендинг вам все-таки нужен. Хотя для начала нужно определиться – что такое лендинг.

Лендинг (лендинг пейдж, лэндинг, целевая страница, посадочная страница, одностраничник, лендос) – это сайт, который содержит в себе информацию о какой-то услуге, товаре или компании (человеке). Говоря о лендинге, чаще всего имеют в виду автономный сайт, состоящий из одной страницы, на которой перечислена вся основная информация.

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

Плюсы и минусы лендинга

Но если вы все еще сомневаетесь, то более подробно остановлюсь на плюсах и минусах лендинга.

Начну с минусов лендинга.

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

Теперь перейдем к плюсам лендинга.

  1. Быстрая и недорогая разработка . И так понятно, что одну страницу сделать проще, чем десять, а редактировать информацию на них чаще всего не нужно (а значит, и необходимости в админке нет). А даже если что-то и придется менять, сделать это на одной странице существенно легче, чем на множестве. Во многом именно поэтому одностраничники и стали так популярны.
  2. Адаптивный дизайн . У большинства лендингов дизайн именно такой, поэтому можно не волноваться о том, нормально ли будет смотреться ваш сайт на мобильных устройствах. Таким образом, вы сразу привлекаете большую часть аудитории, которая сидит в интернете со смартофонов или планшетов.
  3. Простая навигация . Успех сайта зависит не только от красочной обертки и наполнения, но и от того, насколько потенциальным клиентам удобно им пользоваться. Посетителей раздражает, когда они не могут понять, куда нужно нажать, где находится нужная им информация, как с одной страницы перейти на другую и так далее. Будут ли такие проблемы на одностраничнике? При грамотной разработке – нет.
  4. Концентрация информации . Информации на лендинге поместится не так много – но стоит ли это рассматривать как минус? На одностраничнике намного проще концентрировать внимание посетителей на чем-то определенном. Вы можете сразу предоставить всю необходимую информацию, а не бояться, что пользователь не найдет номер телефона. Еще один вытекающий отсюда плюс – высокая концентрация информации на странице. Можно сделать десять страниц, и на каждой из них разместить скудное и скучное описание. А можно все уместить на одной странице, и даже если, в общем-то, информации не так много, посетителям будет казаться, что ее хватает с лихвой.
  5. Фокусирование на товарах/услугах . Исследования в области психологии и рекламы говорят о том, что покупателям намного проще определиться с выбором, если им представлен небольшой ряд товаров, чем в тех случаях, когда перед ними не заканчивающееся множество вещей. Если ваша цель – успешный бизнес какого-то конкретного товара (или нескольких), то делайте лендинг. Внимание потенциального покупателя будет максимально сфокусировано на том, что вы хотите ему продать.
  6. Красочность . Лендинги отличаются богатством изображений и красочностью. Уже доказано, что визуальная информация воспринимается лучше и быстрее текстовой – люди больше любят смотреть картинки, чем читать объемный текст. Изображения и помогут сделать ваш лендинг, во-первых, уникальным, во-вторых, привлекательным. В моду вошло и использование видео – тоже интересный вариант удержания внимания аудитории.

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

Комьюнити теперь в Телеграм
Подпишитесь и будьте в курсе последних IT-новостей

Создаем лендинг на WordPress

С чего начать? Начнем с выбора CMS!

WordPress – известная CMS, которую горячо любят многие пользователи. Она широко распространена, легка в освоении, гибка… поэтому и лендинг я решил сделать именно на этой платформе.

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

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

Выбрали, придумали? Значит, идем дальше. Не буду останавливаться на технической части (покупка домена, устанока WordPress и т.п.), а сразу перейду к разработке!

Переходим к разработке

WordPress – инструмент многогранный, в основном благодаря наличию моря плагинов. Поэтому и лендинг мы будем делать тоже при помощи плагина – а именно Free Landing Pages Builder by Wishpond. Пользоваться этим плагином совсем не сложно, вы разберетесь в нем буквально за пару минут!

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

Вам нужно зайти в панель администратора WP, скачать и активировать этот плагин. В вашем списке появится еще одна строчка – Landing pages – и, перейдя в этот пункт, вы можете начать создавать свой лендинг.

Free Landing Pages Builder by Wishpond

Наведите на картинку любого шаблона курсор: «Choose Template» – выбрать шаблон; «Preview» – превью (предварительный просмотр в окне справа). Советую сначала посмотреть превью шаблона и лишь потом брать его в работу. Кстати, в превью можно посмотреть шаблон и на мобильном устройстве. Удобно!

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

Определились c шаблоном? Нажимайте «Choose Template» и переходите к следующей части. Высветится окошко «Give Your Landing Page A Name» – дайте название своему лендингу.

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

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

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

Лендинг на WordPress

После настройки лендинга не забудьте прошерстить настройки (Settings) – там можно, в частности, настроить SEO (задать название страницы и описание). «Share settings» – название, описание и картинка, которые будут показываться, если кто-то поделиться ссылкой на ваш сайт в соцсетях. Тут же вы сможете еще, к примеру, добавить шрифты (Add/Edit Fonts), если представленных по умолчанию вам покажется мало.

Публикация лендинга

Оформили лендинг? Проверили адаптивность отображения на других устройствах? Тогда переходим к публикации вашего проекта в сети.

Нажимайте яркую оранжевую кнопку «Publish» в горизонтальной панели!

Публикация готового лендинга

В появившемся окошке выбирайте «Custom Domain» и вводите адрес сайта, на котором вы хотите разметить получившуюся страницу. Но я советую разместить сайт на поддомене (например, 1.example.ru), и далее поясню почему.

Внесение изменений на хостинге

Теперь вам нужно внести одно, но крайне важное изменение на хостинге – поменять запись CNAME используемого домена на wishpond.com. Так как на хостинге Timeweb можно поменять CNAME только для поддомена, я рекомендую использовать поддомен.

Для того чтобы внести изменения, войдите в свою панель управления хостингом, выберите пункт «Домены и поддомены», рядом с поддоменом нажмите на зеленую шестеренку («Настройки поддомена»), выберите вкладку CNAME, пропишите там «wishpond.com» и сохраните измнения.

CNAME

Готово! Проверяйте работоспособность сайта и вносите изменения, если что-то не нравится!

Как на Tilda: создаем лендинг на WordPress

Лендинг на WordPress, да еще и своими руками – это совсем несложно. В этой статье я расскажу о преимуществах и возможностях WordPress как открытой системы. Разберем по шагам, как сделать лендинг на WordPress с минимальными знаниями HTML и CSS. Наконец, в финале будет живой пример созданного одностраничного сайта, чтобы посмотреть его и примерить для своего проекта.

Зачем WordPress, если есть онлайн-конструкторы?

Создать свой сайт сегодня несложно. Есть много сервисов, которые предлагают услуги онлайн-конструкторов сайтов. Среди них как русскоязычные (Wix, Tilda, uKit), так и англоязычные сайты (Squarespace, Weebly ). Разница между ними, что называется, на вкус и цвет. Отличия в тарифах, интерфейсе, возможностях тонкой настройки и прочих деталях. При этом с помощью каждого вы сможете создать сайт онлайн, в визуальном режиме, когда вам видна разметка будущего сайта и его страниц. Там нет (или совсем минимум) требований по знанию html-кода и других для многих непонятных и по сути ненужных слов.

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

А вот зачем

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

Я сравню возможности WordPress и Tilda как одной из самых популярных платформ среди НКО. Выделю несколько неудобств, с которыми НКО могут столкнуться в своей работе.

  • Понадобилось подключить на сайте прием пожертвований. А наиболее удобный и популярный плагин для этих целей «Онлайн-Лейка» работает как плагин для WordPress. И установить его напрямую в сайт, созданный на Tilda, не получится. Единственный вариант, к которому приходят в таких случаях, – это создание WordPress сайта на поддомене и установка туда «Лейки». И вот изначально вроде простая схема уже начинает усложняться.
  • Сначала организации хватало возможностей бесплатного тарифа. Затем понадобилось подключить контактную форму и форму записи на вебинар. А такие формы подключаются уже на платном тарифе, который стоит 6000 руб. в год (при оплате за год). Для небольшой организации это весьма заметная сумма в бюджете.
  • Наконец, недавний случай по блокировке сайта rostovcase.ru , когда некоторое время сайт был недоступен. Конечно, сама по себе ситуация, когда сайт не работает, нисколько не редкость. Многие хостинги время от времени испытывают на себе различного рода DDOS-атаки, бывают технические неполадки или даже захваты дата-центра. Но от подобных случаев можно хоть как-то подстраховаться, имея у себя на компьютере резервную копию сайта. Тогда хоть есть возможность поднять сайт на другом хостинге и сохранить всю информацию. В случае же с Tilda экспорт исходного кода сайта можно сделать только на тарифе Business стоимостью 12000 руб. в год (при оплате за год). На бесплатном тарифе забрать себе код сайта не получится.

Вот и получается, что для сайтов НКО выгоднее и с технической, и с финансовой стороны создавать сайты на открытых платформах. И WordPress здесь вне конкуренции.

Преимущества WordPress как открытой системы управления контентом

  • Собственный домен второго уровня (mysite.ru).
  • Полный контроль над сайтом (возможность в любой момент вносить изменения в код сайта, делать резервные копии, переносить сайт на другой хостинг).
  • Доступ к огромному каталогу плагинов, расширяющих функционал сайта (55’000 плагинов – это вам не шутки).
  • Экономия в деньгах. Здесь чуть подробнее и на примере хостинга Timeweb. Регистрация домена в зоне .ru стоит 179 р. (на один год), сам хостинг (для размещения одного сайта) стоит 1’548 р. (при оплате за год). Итого получаем 1’727 р. в год. Сравните с 6’000 р. у Tilda.

Недостатки WordPress

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

“- Тоже мне, бином Ньютона!”. Скриншот из фильма “Мастер и Маргарита”

Регистрация домена и хостинга

Выбрать домен, оплатить его и подключить к вновь созданному сайту несложно. В любом случае, если у вас на этом моменте возникают вопросы – создайте задачу на it-волонтере, и все будет решено. Сегодня на многих хостингах установка WordPress – дело пары кликов: выбор CMS и указание, в какую папку сайта эту систему установить. И вот мы подошли к главной части повествования – сейчас будем настраивать сайт и творить.

Выбор темы оформления

Итак, наша задача – создать одностраничный сайт со вполне типичными блоками: заглавное изображение, описание продукта, его преимуществ. Добавим видео с YouTube и небольшую фотогалерею. По максимуму будем использовать уже существующий функционал WordPress и минимум подключений сторонних плагинов (тему возьмем тоже бесплатную).

С темы и начнем. Каталог WordPress предлагает на выбор огромное количество тем, почти 4000. Среди них платные и бесплатные, новые и старые, красивые и так себе. Выбор есть, главное – сделать его правильно.

Темы оформления сайтов. Скриншот каталога тем WordPress

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

Страница темы “Астра”. Скриншот сайта каталога тем WordPress

Установка и настройка темы

Заходим в консоль сайта (она же панель управления, она же панель администрирования, она же админка), затем раздел Внешний вид – Темы – Добавить новую. В поиске пишем Astra, устанавливаем и активируем тему. Сразу после этого нас ждет хорошая новость – Astra предлагает установить плагин, с помощью которого можно импортировать уже готовые шаблоны сайтов. Это нам еще более упрощает задачу, ведь там есть из чего выбрать!

Как установить готовые шаблоны для темы Astra. Скриншот страницы тем в консоли WordPress

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

Страница выбор стартовых шаблонов для темы Astra. Скриншот сайта Astra

Варианты стартовых тем посмотрели, возвращаемся на наш сайт в раздел темы, где висит уведомление от Astra про этот плагин готовых шаблонов. Нажимаем «Начать», плагин сам установится и активируется. Дальше в окне Select Page Builder выбираем Gutenberg, и перед нами во всей красе открывается окно с 20 готовыми шаблонами для вашего сайта. Двадцать! Готовых! Шаблонов! Все уже сделано, настроено, осталось только заменить контент на ваш и все.

Примеры готовых шаблонов для редактора Gutenberg. Скриншот страницы консоли WordPress

Кликнув на выбранный шаблон, откроете новую страницу, где можно посмотреть детали этой темы – как выглядят главная и внутренние страницы. Там же можно выбрать страницы, которые нужно импортировать на ваш сайт. Можно взять себе только одну страницу (нас интересует главная, в первую очередь), а можно забрать себе весь шаблон, включая внутренние страницы.

Берем за образец шаблон Outdoor Adventure. Кликаем на него и нажимаем Import Complete Site. Поскольку в этих шаблонах есть связанные между собой модули, которые раскиданы по нескольким страницам, то лучше импортировать их все. Потом удалим ненужные. На скриншоте ниже внимательнее – некоторые темы имеют свои внутренние настройки импорта. Можно импортировать демо-контент (это хорошо, будет видно, как выглядит сайт и где можно заменить фото/тексты). Также может понадобиться установка плагинов. Здесь просто нажимаем Import, все будет сделано автоматически.

Выбор элементов для импорта шаблона. Скриншот консоли WordPress

После успешного импорта немного настроим сайт. Идем в раздел Настройки – Чтение. Вверху в строке «На главной странице отображать» выбираем статическую страницу и для главной страницы задаем Home. Здесь пока все, внизу нажимаем «Сохранить изменения». Теперь, открыв сайт, мы увидим именно ту главную страницу шаблона, которая была в предпросмотре несколькими шагами ранее.

Главная страница сайта после импорта шаблона

Настраиваем дальше. Сейчас приведем в порядок главное меню и уберем оттуда все лишнее. Для этого в консоли идем во Внешний вид – Меню и в «Структуре меню» удаляем все пункты. После этого сохраняем меню. И пришло время для изменения контента главной страницы. Она находится в консоли в разделе «Страницы». Там кликаем на «Home – Главная страница». И во всей красе открывается мощь редактора Gutenberg. Кликаете на любой текст, меняете на свой. То же самое с картинками и другими элементами. Обращаем внимание на правую колонку на странице – там много дополнительных настроек для блоков – цвета, размеры, позиции. Если нужен блок, которого нет в выбранном шаблоне, добавляем его через стандартную функцию редактора – слева вверху значок «плюс» (добавить блок). После всех изменений обязательно нажать «Обновить» (справа вверху). И заметьте, под мобильные устройства сайт адаптируется автоматически. Это дико удобно.

Также много настроек есть во Внешний вид – Опции Astra. Там про логотип, шрифты, цвета, настройки шапки, футера. Все это можно поменять и настроить под ваши требования. Это был первый способ, когда мы правили готовый шаблон, меняя его под свои тексты и фото.

Второй способ – это создание своего собственного макета главной страницы. Без применения готового шаблона от Astra и используя только возможности редактора Gutenberg. Для этого все так же устанавливаем тему Astra, но пропускаем пункт про установку плагина готовых шаблонов. Дальше все сводится к работе с блоками Gutenberg. Никаких знаний HTML и CSS не нужно, все делается в визуальном редакторе, где сразу видно, как будет располагаться контент.

Скриншот лендинга на WordPress

Перефразируя ведущего одной (не самой новой) передачи на MTV – «Мы прокачали ваш сайт». Все живы-здоровы, ни один программист не пострадал. Хвала современным технологиям, ведь несколько лет назад такая работа заняла бы куда больше времени и отняла бы куда больше сил, времени и нервов.

Если после прочтения остались вопросы – с удовольствием отвечу в комментариях. Пишите, делитесь своим опытом. Тема очень большая, много нюансов, но все реально, это главное.

Еще по теме

  • Привет, Амелия! Как добавить на сайт форму записи на консультацию
  • Как улучшить скорость загрузки сайта: обзор PageSpeed Insights от Google
  • 106 способов улучшить сайт НКО

Как создать Landing Page на WordPress?

Здравствуйте.
Начал верстать дизайн Landing Page на чистом WordPress. Стало понятно, что на чистом WP я это не сделаю, так как не предназначен он для этого(изначально). Посоветуйте, как вы создаёте LP на WP? Какие плагины используете?
Установил WordPress Landing Pages Plugin. Но не могу найти как сделать его домашней страницей сайта.

  • Вопрос задан более трёх лет назад
  • 39099 просмотров

Комментировать
Решения вопроса 0
Ответы на вопрос 7

Jump

Системный администратор со стажем.

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

Так вот — какой смысл делать лендинг на вордпрессе, если можно просто сделать лендинг, и выложить на хостинг.

Ответ написан более трёх лет назад
Нравится 10 1 комментарий

freepad

1. Самая популярная CMS, знакомая админка.
2. Проще заплатить сверху тысячу, чтобы натянули ЛП на WP, дабы в будущем не дёргать верстальщика, если захочется что-то подправить и/или добавить.

freepad

На чистом WP можно написать всё, что угодно. Вопрос в том, нужно ли это заказчику, когда в создании LP проще использовать готовое решение. Которое уже решит кучу проблем за вас.
Custom Field Suite — это пожалуй плагин который я использую в 90% сайтов на WP.

Если есть желание сделать всё без плагинов могу посоветовать копать в сторону функций: add_menu_page(), get_option().
Создаёте страницу «Контент». Создаёте там как-то возможность пользователям через через админку заполнить опции темы и уже в самой тебе запрашиваете их и выводите.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *