Настройка Contact Form 7 часть первая и вторая

Друзья самый лучший плагин для отправки писем с сайта не всегда мы используем на все 100%

Настройка Contact Form 7 . В этом видео я рассказываю:
Как создать простую форму

1. Как настроить и изменить стандартные уведомления
2. Создадим форму со своими полями
3. Научимся загружать файлы через Contact Form7
4. Создадим письмо со своим текстом
5. Поменяем стили формы
6. Оформим контакт форм при помощи плагинов
7. Создадим страницу спасибо

Я разбил этот урок на 2 части.

В первой части настройки Contact Form 7,  мы научимся создавать простую форму (кто еще не умеет), добавим свои поля для формы, и напишем свое письмо, которое будет получать пользователь. Научимся использовать шорткоды для подстановки значений имени е-maila темы и сообщения а так же любых полей. Научимся делать в форме загрузку файлов.

А вторая часть полностью посвещана внешнему оформлению форм.

1) Кастомный css https://youtu.be/4CXiYcCuh9Y?t=44
2) Расположить поля горизонтально https://youtu.be/4CXiYcCuh9Y?t=541
3) Плагин для создания красивых форм https://youtu.be/4CXiYcCuh9Y?t=720
4) Создаем форму по своим стилям https://youtu.be/4CXiYcCuh9Y?t=806

Текст который я использовал при настройке Contact Form 7

Код для страницы спасибо

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
    location = 'http://адрес вашей страницы спасибо';
}, false );
</script>

Вставьте свою страницу спасибо.

Код для формы с кастомными стилями

<p class="name-cf">Ваше имя (обязательно)
[text* your-name]</p>
<p class="name-cf">Ваш e-mail (обязательно)
[email* your-email]</p>

<div class="clear-cf"></div>
<p class="thems-cf">Тема
[text your-subject]</p>
<p class="text-cf">Сообщение
[textarea your-message]</p>

<div class="submit-cf">

[submit «Отправить»]

</div>

===========================

Код которым я оформлял всю форму

#wpcf7-f172-p34-o1 {
margin: 5px;
padding: 10px;
background: #B3AFAF;
font-family: Georgia, «Times New Roman», Times, serif;
color: #000;
}

========================

А этот код я вставлял в кастомайзер

.name-cf {
float:left;
padding: 2px;
}
.name-cf input {
width: 270px;
}
.thems-cf input {
width: 100%;
}
.clear-cf {
clear: both;
}
.text-cf textarea {
width: 100%;
}

Спасибо что посмотрели это видео, Настройка Contact Form 7 следить за обновлением можно подписавшись на канал по ссылке http://www.youtube.com/channel/UCOvS3wi2Tr9Q15xVnWpgBtQ?sub_confirmation=1

Мой второй канал с различными лайфхаками для жизни тут http://www.youtube.com/user/mosgy?sub_confirmation=1

Если нужна личная консультация всегда пожалуйста, пишите на yarg@bitrix24.ru договоримся.

Или начните обучение бесплатно на моем курсе https://e-integrate.ru