Лучший плагин для создания landing page. Создание landing page на WordPress. Создание лендинг пейдж на WordPress

» Бесплатные landing page шаблоны WordPress — ТОП 30

Бесплатные landing page шаблоны WordPress — ТОП 30

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

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

Вам так же может быть интересно

Для тех кто ищет хостинг

1.

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

2.

— это многофункциональная вордпресс тема. Она включает в себя яркий интерфейс, классический parallax effect и другие анимации, которые делают просмотр темы еще приятнее. Zerif Lite является кроссбраузерной темой, которая так же качественное написана с точки зрения кода.

3. Alhena Lite

Alhena Lite — это бесплатная корпоративная тема для WordPress, которая полностью интегрирована с WooCommerce плагином , для того, чтобы вы легко могли настроить свой интернет-магазин.

4.

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

5. Palmas

Palmas — это современная тема, выполненная в светлых тонах, которая подойдет для ведения личного или фэшн блога. Этот шаблон так же поддерживает такие плагины как Yoast SEO, GravityForms, Pirate Forms, W3 Total Cache и многие другие.

6. Brasserie

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

7. XT Corporate lite

XT Corporate lite — это простая и минималистическая тема, которая подойдет для небольшого продукта или сервиса.

8.

— это приятная тема, выполненая в светлых тонах. Включает в себя разные анимации и визуально пирятные переходы и parallax эффект. В дополнении Freesia Empire поддерживает такие плагины как Breadcrumb NavXT, WP-PageNavi, Contact Form 7, Jetpack by WordPress.com, Polylang, Newsletter, bbPress и WooCommerce.

9.

— это тема, которая подойдет для презентации малого или среднего бизнеса. Она включает в себя огромное количество функций и дополнений для полного управления лендинг структурой.

10.

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

11. FotoGraphy

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

12. Integral Theme

Integral Theme — это одностраничная тема с parallax, которая подойдет для креативных личностей, владельцев бизнеса или агентам. У вас займет всего пару минут, чтобы настроить ее.

13. Square

Square — это минималистическая тема, которая может быть использована для сайта любого типа. Она лучше всего подойдет для малого и среднего бизнеса. Square настроена под многие популярные плагины от WordPress, а так же SEO оптимизирована.

14. Enliven

Enliven — это качественное выполнения тема. Я бы ее назвал премиальной, так как она сочетает в себе качество и красоту в одном флаконе. Она так же поддерживает многие популярные плагины и легко настраивается.

15. Latte

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

16. The Monday

The Monday — это элегантная тема которая подойдет для бизнеса или фрилансера. Она имеет при себе большое количество функций и дополнений и дополнений.

17. Business World

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

18.

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

19. Onetone

Onetone — это одностраничный шаблон для WordPress который подойдет для презентации «Я» в интернете (показать свое портфолио и/или рассказать о себе).

20. Arise

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

21. Woot

Woot — это минималистический шаблон выполненный в темных тонах, который ведения интернет-магазина. Он работает c WooCommerce и многими другими популярными плагинами.

22. West

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

23. Anaglyph Lite

Anaglyph Lite — это простой и элегантный шаблон, который подойдет для блогинга и интернет-магазина. На нем уже настроен WooCommerce и другие популярные плагины.

24.

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

Quards – простой плагин для создания лендинг пейдж или сайта целиком

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

Инструмент содержит массу возможностей и функций:

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

Thrive Landing Page WordPress – не free плагин с большой обновляемой базой шаблонов

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

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

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

WP Profit Builder – еще один не free плагин для создания эффективных страниц

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

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

Главное – выбор правильного оформления, которое вы сами можете настраивать. Об остальном позаботится продающий сайт одностраничник, сделанный при помощи WP Profit Builder.

Он отлично подходит для создания лендингов для долгосрочного использования, так как позволяет регулировать настройки SEO. А значит со временем ваш сайт заметят поисковики, и одностраничник получит дополнительный приток органического трафика.

Landing Pages – free плагин с детальной статистикой конверсии сайта

WordPress Landing Pages – спаситель для малобюджетных компаний и стартапов, ведь вам не придется платить за его использование – это free модуль. Вы сможете полностью создать сайт одностраничник, а также протестировать его оформление и конверсию при помощи a/b тестирования. Огромная польза этого free инструмента в том, что каждое изменение лендинг пейдж вы сможете проверять при помощи статистики. Таким образом можно создать идеальный продающий сайт с максимально возможной конверсией.
https://www.youtube.com/watch?v=flEd0sRTFUo

InstaBuilder – мощный плагин для создания одностраничного сайта за несколько минут

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

OptimizePress – модуль с живым редактором одностраничного сайта

С OptimizePress визитка или лендинг – это не проблема. В считанные минуты вы сможете создать сайт Вордпресс, который автоматически будет настроен под поисковую выдачу. Сгенерированные страницы при помощи плагина адаптивные для всех устройств (поисковики это высоко ценят). А самое интересное, что в модуле установлен “живой” редактор сайта – вы вносите изменение, и сразу видите результат. Это сэкономит время и нервы. А если вы хотите сэкономить еще больше времени, в каталоге дополнения есть 30 уже готовых шаблонов для сайта-визитки. Их можно редактировать. В процессе управления страницами у вас есть доступ к 40 функциональным элементам.

LeadPages – еще один продвинутый плагин с “полным фаршем”

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

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

Ultimate Landing Page – бесплатный инструмент, идеальный для создания визитки

Данный плагин позволяет сделать одностраничник самостоятельно с нуля, либо выбрать один из приведенных в каталоге шаблонов. Между шаблонами можно удобно переключаться для быстрого предпросмотра. Шаблоны редактируемые и предоставляются на бесплатной основе. Уже через 5 минут вы можете создать свою лендинг пейдж. И, что самое главное, в редакторе есть возможность вставить элемент Mail Chimp – это кнопка подписки. Это позволит вам бесплатно повысить количество подписчиков для развития имейл-маркетинга компании.

Выводы

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

В случае, если приведенные free-плагины вас не устраивают, есть еще один бесплатный модуль – Parallax Gravity. Он не такой мощный, как описанные выше, тем не менее дает возможность быстро создать одностраничник со всеми ключевыми элементами.

» Создание Landing Page WordPress: 8 лучших плагинов

Создание Landing Page WordPress: 8 лучших плагинов

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

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

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

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

1.

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

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

2.

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

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

3. Contact Form 7

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

4.

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

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

5.

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

6.

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

7. Landing Pages, SEO Content

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

8. Page Builder — AIO

Удобный и легкий плагин для создания лендинг страниц на WordPress. Интуитивно понятный дизайн и приятный интерфейс делают этот плагин еще привлекательнее.

Послесловие

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

    2019-01-27T11:56:56+00:00

    Здравствуйте,

    Всегда пожалуйста.

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

    2019-01-16T11:55:58+00:00

    Спасибо за инфорвтинформативную статью

    2018-04-03T14:05:00+00:00

    Александр, большое спасибо за развернутый и емкий ответ. Я не видел вашего ответа раньше и только сейчас увидел!

    2017-12-02T02:00:00+00:00

    Здравствуйте, Руслан. Если вы не разработчик, и вам хочется самому заниматься поддержкой шаблона, то выбирайте ту тему, в которой есть Visual Composer, чтобы вы могли менять элементы посредством Drag&Drop (визуальным переносом элементом). Возможно все же потом придется немного использовать HTML, если вам нужно какие-то более сложные элементы, но это не усложнит процесс, да и не дорого выйдет для вас, если найдете разработчика для такой работенки. Вариантов шаблонов много, могу посоветовать Salient, сам лично её использовал. Она англоязычная, в ней есть все что я выше описывал, мне лишь осталось перевести некоторые часты шаблона с англ. на русский и готово. По поводу доступа к контенту: я особо много не работал с приватным контентом, но могу посоветовать https://wordpress.org/plugins/wp-private-content-plus/, вроде бы достойный вариант, много разного функционала. Единственный его минус - это если вы не говорите на английском, потому что он без поддержки русского языка.

    2017-11-21T12:34:00+00:00

    Здравствуйте! Какой плагин посоветуете для установки? Хочу на сайте сделать платный доступ к созданию собственных страниц. Имею сайт по предоставлению услуг. Хочу расшириться и привлечь дополнительных исполнителей, помогать им продвижении своих товаров и услуг. Чтобы исполнитель смог создать свою посадочную страницу (лендинг) и предлагать свои услуги.

👁17 917 просм.

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

И тут появилась идея создать посадочную страницу на WordPress.

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

Собрав всю найденную информацию, я нашел свой подход и и вот что из этого получилось: демо сайта —

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

I. Подготовка к созданию лендинга

  1. Регистрация хостинг аккаунта. Для хостинга был выбран хостинг провайдер Parkovka.ua , предоставляющий качественные услуги по хорошей цене 🙂
  2. Настройка доменного имени.
  3. Установка CMS Wordprss.

II. Установка необходимых компонентов

  1. Установка темы Refur . Эта тема WordPress была выбрана не случайно. В ней отлично реализован первый экран с фоновым изображением, кнопкой для призыва к действию и есть возможность заменить текст «Copyright» в футере на свой вариант.
  2. Создание дочерней темы. Так как в дальнейшем нам нужно будет прописывать свои стили и функции для лендинга, то нужно обеспечить их сохранность, чтоб после обновления темы они не исчезли 💡
  3. Установка плагинов: WP Translitera, — плагин для транслитерации ссылок сайта; Contact Form 7, — плагин для создания форм обратной связи; TinyMCE Advanced, — расширяет возможности текстового редактора WordPress. Easy FancyBox, — плагин для создания всплывающих окон на сайте. Page Builder от SiteOrigin, — имеет огромные возможности кастомизации страниц с достаточным количеством интуитивно понятных настроек; и самый основной плагин, при помощи которого мы будем строить информационные блоки лендинга..

III. Подготовка плагинов WordPress к работе

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

  1. TinyMCE Advanced, — нужно добавить недостающие компоненты в панель текстового редактора. Для его настройки переходим по пути: настройки → TinyMCE Advanced.

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

  2. Easy FancyBox, — нужно включить функцию «Inline content» для того чтоб форма обратной связи открывалась во всплывающем окне. Для этого переходим по пути Настройки → Медиафайлы, и проскролив немного вниз видим «FancyBox». Ставим отметку в чекбоксе напротив «Inline content» и сохраняем. Так же можно снять отметку с чекбокса напротив «Images», если необходимо присвоить настройки для ссылок изображений, чтоб открывались в отдельном окне.
  3. Contact Form 7. Мы будем использовать этот плагин для получения заказов через кнопку обратной связи. Подготовим его для дальнейшей работы. Переходим по пути: Contact Form 7 → Формы.
    Там видим уже автоматически созданную контактную форму «Контактная форма 1». Эту форму можем пока не трогать. Создаем новую, нажав в левом верхнем углу кнопу «Добавить новую». В открывшемся окне вводим любое понятное название формы. В поле «Шаблон формы» удаляем существующий код, кроме строки . Затем, нажимаем кнопку «текст», для добавления необходимого тега в форму.


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

    Повторяем эту процедуру еще раз, для поля «номер телефона». Должно получиться вот так:


    Сохраняем и переходим на вкладку «Письмо». Здесь нужно отредактировать шаблон письма, которое будет уведомлять нас, что на сайте была заполнена контактная форма. Сразу же в верхней части шаблона появилась надпись «В следующих полях Вы можете использовать эти почтовые метки: ». У вас номера меток могут отличаться. Копируем и подставляем их в поле «Тело письма» с подписями «Ваше имя» и «Телефон», соответственно. Затем очищаем поле «Дополнительные заголовки» от кода. Поскольку в нашей форме нет поля для ввода e-mail адреса, то если не очистить его не очистить, форма будет содержать ошибку. Далее можем изменить поля «От кого» и «Тема», вписав туда текст, который нем необходим. Проверяем, чтоб в поле «Кому» был вписан e-mail, на который нужно получать уведомления с сайта. И сохраняем форму.
    Вот как было:


    И вот что получилось:


    Эта настройка будет нам необходима для красивого оформления всплывающего окна обратной связи.

IV. Настройка стартовой страницы лендинга

V. Установка и настройка контактных форм.

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

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

/***Стили для формы обратной связи****/ .contact-us a{ border:1px solid #ccc; /*цвет границы*/ background:#2674C8; /*цвет фона*/ padding:10px 20px; /*внитринние отступы*/ display:block; text-align:center; /*выравнивание текста по центру*/ color:#fff; /*цвет текста*/ text-decoration:none; /*убрать подчёркивание у ссылки*/ width:190px; /*ширина кнопки*/ margin:auto; /*выравнивание кнопки по центру*/ -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; } /**Плавное появление тени у кнопки при наведении**/ .contact-us a:hover{ -moz-box-shadow: 0 0 6px #000; -webkit-box-shadow: 0 0 6px #000; box-shadow:0 0 6px #000; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; } /***Стили для CF7***/ .wpcf7 { background:#f1f1f1; /*цвет границы*/ padding:20px 20px 20px 20px!important; text-align:center; border:1px solid #ccc; font-size:17px; } .wpcf7 h2{ text-transform:uppercase; font-size:20px; color:#750000; margin-bottom:15px; } .wpcf7-text{ margin-bottom:10px; padding:5px; border:1px solid #6e6e6e; } .wpcf7-text:focus{ -moz-box-shadow: 0 0 6px #004080!important; -webkit-box-shadow: 0 0 6px #004080!important; box-shadow:0 0 6px #004080!important; } .wpcf7-submit{ background: linear-gradient(#f20000, #750000)!important; color:#fff!important; text-shadow:none!important; text-transform:uppercase; border-radius:10px!important; -moz-box-shadow: 0 0 6px #000!important; -webkit-box-shadow: 0 0 6px #000!important; box-shadow:0 0 6px #000!important; margin-top:20px; } /*стили сообщений об ошибках*/ .wpcf7-not-valid{ border:1px solid red!important; } .wpcf7-response-output{ background:#fff; border-radius:10px!important; -moz-box-shadow: 0 0 6px #000; -webkit-box-shadow: 0 0 6px #000; box-shadow:0 0 6px #000; }

/***Стили для формы обратной связи****/

Contact-us a {

border : 1px solid #ccc ; /*цвет границы*/

background : #2674C8 ; /*цвет фона*/

padding : 10px 20px ; /*внитринние отступы*/

display : block ;

text-align : center ; /*выравнивание текста по центру*/

color : #fff ; /*цвет текста*/

text-decoration : none ; /*убрать подчёркивание у ссылки*/

width : 190px ; /*ширина кнопки*/

margin : auto ; /*выравнивание кнопки по центру*/

Webkit-transition : all 0.5s ease ;

Moz-transition : all 0.5s ease ;

Затем вставляем следующий код в ту форму, где нам нужно вывести кнопку обратной связи. Конечно же вставляем его в режиме html разметки.

Отправить сообщение

< div class = "contact-us" > < a href = "#contact_form_pop_up" class = "fancybox-inline" > Отправитьсообщение< / a > < / div >

< div style = "display:none" class = "fancybox-hidden" >

< div id = "contact_form_pop_up" >

[ contact - form - 7 id = "159" title = "Контактная форма 1" ]

< / div >

< / div >

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

Всем привет.

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

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

Для тех, кто не в теме: Вордпресс – это бесплатная платформа, на которой можно легко без знания языков программирования создать свой сайт. Еще WordPress называют системой управления контентом (CMS – content manager system), с помощью этой платформы процесс добавления статей или новых страниц на свой web-ресурс не вызывает абсолютно никаких сложностей.

И еще тем, у кого еще нет своего сайта — вот ссылка на бесплатный курс по созданию сайта на WordPress

Статьи по теме:

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

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


Установка плагина

Итак, речь пойдет о плагине под названием Elementor. Установка плагина стандартная, как и для всех плагинов. Вот короткая инструкция:

  1. Зайти в админ панель вордпресс по ссылке «ваш-домен/wp-admin»
  2. В меню слева нажать «Плагины» – «добавить новый»
  3. В поле поиска ввести Elementor
  4. Плагин найден. Нажать установить
  5. Нажать активировать
  6. Готово! Плагин Elementor установлен.

Это, конечно, идеальный случай 😊 Мой блог немного вредный. И по этой инструкции не получилось.

  • Во-первых, при установке плагинов мне еще необходимо ввести логин и пароль от FTP доступа. Это не проблема. Все эти данные я всегда могу получить на своем хостинге .
  • Во-вторых, после установки плагин не работал. Чтобы не тратить драгоценное время и не разбираться в чем проблема, я установил систему WordPress на поддомен своего сайта и далее установил Elementor на поддомене. На подомене всё заработало.

Предположение. Возможно, плагин Elementor не заработал на моем блоге из-за конфликта с темой.

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

Как создать страницу — начало

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

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

Инструкция:

Интерфейс оболочки для создания лендингов

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

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

Объектов очень много:

  • заголовок,
  • текст,
  • различные списки,
  • картинка,
  • кнопка,
  • линии,
  • html код,
  • и другие.

У всех объектов есть свои параметры: цвет, размер и другие. Вообще параметры зависят от самого объекта. Например, у заголовка главные параметры — это размер заголовка, его цвет. У кнопки – также размер кнопки, цвет, ссылка.

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

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

Процесс создания лендинга

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

Чтобы их убрать, нажмите в левом нижнем углу на настройки (шестеренка). Далее нужно выбрать режим отображения Full Width (полная ширина). После этого правая колонка исчезнет.

Теперь пора начинать создавать свою страничку:


Ваша страничка готова, теперь можете использовать ее по назначению.

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

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

Также делитесь статьей со своими друзьями в социальных сетях.

Всем пока и до скорых встреч!

С уважением, Абдуллин Руслан