Привет ребят. В этот раз я подготовил для вас еще один бесплатный шаблон лендинга для WordPress + видео-урок по тому, как я его создавал. Ссылка на все инструменты, сервисы и прочее в описании под этим видео.
Дополнительно:
Вы можете скачать лендинг, которые я создавал в этом уроке — ссылка на него, вместе с видео-инструкцией вы найдете в описании.
Как создать лендинг для WordPress с нуля
Основные инструменты и сервисы:
➡ Хостинг, домен и CMS регистрируем тут: https://clck.ru/JLr9M
➡ Генератор логотипов для сайта тут: https://clck.ru/MPpyv
➡ Мой бесплатный курс по созданию сайтов с нуля тут: https://clck.ru/PwJAv
Шаблон сайта + видео-инструкция по установке:
?Шаблон сайта из видео можно скачать тут: https://yadi.sk/d/faJWhVx9JUks9A
?Инструкция по размещению сайта на хостинге и подключение домена: https://youtu.be/rvl3gDmuj_o
Название плагинов и тем, которые я использую в видео:
- Тема — ASTRA
- Плагины:
- Elementor
- Elementor — Header, Footer & Blocks
- Essential Addons for Elementor
- Livemesh Addons for Elementor
- jQuery Smooth Scroll
- Contact Form 7
- Popup Maker
Шрифты и цвета из урока:
Шрифты и цвета, которые я использовал в уроке:
Шрифт — Source Sans Pro
Цвета:
#FF7951 — Основной цвет (оранжевый)
#532437 — Градиентный bac (темно-фиолетовый)
#100C1B — Градиентный bac (темно-синий)
#FF6383 — Мелкие подзаголовки (фиолетовый)
#F0F0F0 — Цвет текста (серый)
#54595F — Цвет текста (черный)
Дополнительные материалы к уроку:
- Как придумать доменное имя для своего сайта: https://clck.ru/NBhsQ
- Как зарегистрировать домен и подключить его к сайту: https://youtu.be/6bkvslQMH6E
- Бесплатные изображения для сайта можно брать тут: https://clck.ru/JfNoy
- Бесплатные иконки для сайта можно брать тут: https://clck.ru/NBhcs
- Генератор политики конфиденциальности тут: https://clck.ru/JLtr3
- Google кириллические шрифты тут: https://clck.ru/EACPK
Таймкоды на темы из видео:
0:34 — старт урока
0:58 — организационные моменты
Начинаем создавать лендинг:
3:07 — что потребуется для создания лендинга
5:13 — настраиваем Астру (шрифт, лого, фавикон)
9:50 — наполняем страницу «Политика конфиденциальности»
11:40 — как работать в Elementor (обзор инструментов)
Работа в Элементоре:
15:58 — начинаем создавать лендинг
16:45 — первый экран лендинга (создаем и настраиваем)
32:46 — второй экран лендинга (создаем и настраиваем)
44:28 — настраиваем разделитель секции (переход из 1 к 2 экрану)
46:35 — третий экран лендинга (создаем и настраиваем)
52:08 — четвертый экран лендинга (создаем и настраиваем)
55:23 — пятый экран лендинга (создаем и настраиваем)
1:04:05 — шестой экран лендинга (создаем и настраиваем)
1:15:44 — добавляем якорные ссылки (anchor)
Контактная форма и поп-ап окна
1:20:37 — активируем контактную форму 7 и попап мэйкер
1:21:17 — настраиваем контактную форму 7
1:26:16 — настраиваем попап мэйкер
1:28:42 — добавляем и настраиваем два попап окна
Настраиваем мобильную и планшетную версии
1:37:18 — настраиваем планшутную версию
1:42:13 — настраиваем мобильную версию
Настраиваем подвал и шапку сайта
1:46:57 — активируем плагин, создаем шапку в Elementor
1:49:03 — создаем меню шапки сайта
1:59:15 — создаем подвал сайта
Настраиваем главную страницу сайта
2:04:46 — выставляем лендинг в качестве главной страницы
Заключение
На этом у меня все. Как обычно, если этот урок оказался для вас полезным — поделитесь им в соц сетях, для меня это будет лучшая благодарность. Ну, а если у вас остались вопросы или вам есть что добавить — пишите в комментарии тут или на ютубе и я отвечу/дополню урок.