Создание Landing Page в WordPress. Блок «Коммерческое предложение, видео и форма заказа»

Автор Nikita Stoianov
Создание Landing Page в WordPress. Блок «Коммерческое предложение, видео и форма заказа»

в этом уроке мы с вами создадим 1 блоке в нашем нашей продающий страничке на нашей Landing page выведем коммерческое предложение попробуем вывести видео и форму заказа заявку из который сможет сделать заказ так вот у нас есть шаблон который мы приготовили в предыдущем уроке в программе artisteer в принципе можете использовать любой шаблон вот.

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

Вот и вот здесь у нас есть такая вкладка предыдущем мы установили с вами page Builder plugin и нажимаем в эту вкладку powerbuilder и у нас есть первый блок вот в принципе нам этот блок наверное не нужен нам нужен двойной блок поэтому я нажимаю Delete и нажимаю Draw добавить ряд и две колонки нужно.

Здесь две колонки и нажимаю добавить вот появился рядом. Вот в этой части у нас впервые будет коммерческое предложение вот в этой части в форму заказа и так нажмем добавить виджет выбираем текстовый виджет и вставляем он пишем заголовок. Я подготовил уже текст напишем. Наш текст коммерческое предложение наша и нажимаем добавить коммерческое предложение добавил теперь с этой стороны у нас будет в формочках форма. Я уже заранее придумал какие-то будут поля в форму будет называться записаться на курсы ваше имя контактный телефон e-mail подать заявку на обучение реализовывать. Это я буду с помощью плагина Contact form поэтому. Для начала я установлю его заеду в плагины добавить новые сжимая Contact form 7 поиск плагинов нашёл плагин Contact form 7 нажимаю установить IO готова. Теперь у меня появился пункт контакты f7 захожу в него и есть 1 контактная форма для пример тестовая то есть я могу её использовать, но я не буду её использовать я скопирую и создам новую вот контактная форма здесь. Видел моё название — это будет под названием записаться на курсы вот здесь у неё есть. Я уже нам для нас создали форма ваше имя ваш e-mail тема вместо темы мы напишем контактный телефон. А Блок сообщение мы уберем контактный телефон и подать заявку на обучение вот здесь у нас есть кнопочка отправить текст у меня отправить у нас будет нет подать заявку на обучение. Если вам нужны какие-то дополнительные поля то их можно сгенерировать с помощью этого генератора с генерировать ник и выбираем. Какое поле нужно сгенерировать его добавляют в форму текста в имо номер телефона и так далее. У нас есть довольно подробный урок по данному плагину если вам интересно может его посмотреть сейчас не будем подробно на этом останавливаться так вот здесь вот выбирается адрес куда будет отправляться заявка. Что будет в теме в тексте письма указываться если хотите можете 2 30 ещё на один имею чтобы отправлялось всё формочка создана мы скопировали теперь вот этот. Откуда мы берём копируем controls заходим обратно страницу которую мы создавали и вот у нас остался правоведъ который мы будем составлять форму нажимаю добавить виджет выбирают текст и сюда вставляя форму и плюс заголовки пишу записаться на курсы всё нажимаем опубликовать можно посмотреть эту страницу. Вот она у нас вот так вот выглядит профессиональные курсы бухгалтеров бухгалтера баланса в 1С записаться на курсы есть человек может заполнить формочку и отправить. Вот здесь у нас комментарии остаются на. Мой комментарий не нужен поэтому редактирование этой странице нужно чтобы возить настройки экрана обсуждение стояла галочка и разрешить комментарии и обратные ссылки уведомления галочку убираем и нажимаем обновить вот да теперь. Допустим мы хотим вот в этом блоке вставить не текст о видео или видео вместе с текстом для этого. Зайдите на YouTube загрузить видео и потом под видео есть такая кнопочка поделиться. Зайдите туда код видеоролик, а потом. Зайдите в страницу в которой вы добавляли текст нажмите. Эдит и редактировать и. Вставьте данный код дам обновить посмотрим, что из этого. Получилось Отлично вот можно в принципе даже поменьше сделать ещё раз этих нажимаю. Напиши мне 560 a530 пикселей допустимо в ширину. А ну вот в принципе вот так достаточно. Можно даже 540. Смотрите по вашему сайту как нужно ширины такое выставлять вот. Собственно 1. Мы создали — это видео формочка в которой можно записаться на курсы в принципе на этом пока всё следующем уроке мы создадим следующий блок.

0 комментариев
0

Читайте также