Сайт на Wordpress, Верстка сайта и перенос на CMS

Освой Wordpress легко на практике с двумя разными сайтами. Вы научитесь верстать сайт по макету из Figma, Pixso и используя сервис Marsy, а также натягивать готовую верстку на Wordpress, создавать свою тему, настраивать формы и переносить сайт на настоящий хостинг.
Средний уровень
30 минут в день
Сертификат Stepik

Чему вы научитесь

  • верстать сайт из Figma в современных реалиях без Dev Mode
  • верстать сайт из Pixso
  • верстать сайт из Marsy
  • делать адаптивный дизайн под разные устройства
  • работать с CMS Wordpress (установка, настройка, создание базы данных)
  • работать с произвольными полями (плагин CFS) и настраивать админку сайта
  • настраивать плагин Contact Form 7 для создания форм обратной связи
  • создавать свою тему сайта на Wordpress
  • работать со слайдером изображений Swiper.js
  • делать свой сайт мультиязычным с помощью плагина ConveyThis
  • переносить сайт на настоящий хостинг

О курсе

В этом курсе мы создадим аж два сайта на Wordpress. Первый сайт мы очень быстро сверстаем на HTML, CSS, JS это будет одностраничный сайт. После этого мы создадим свою тему на Wordpress и настроим полностью наш сайт, перенесем его на настоящий хостинг, настроим форму для отправки письма и защитим свою почту от спама. Мы рассмотрим весь процесс создания Landing Page на Wordpress, начнем с установки CMS и постепенно сделаем нашу админку удобной для наполнения сайта информацией, а так же создадим слайдер на Swiper.js которого не было в вёрстке.

В следующем модуле мы усложним задачу и создадим многостраничный сайт компании изготавливающей двери на заказ. Тут мы уже не будем верстать сайт, а вы сможете скачать готовый код верстки состоящий из 10 страниц и сразу же приступить к натяжке вёрстки на Wordpress. В рамках этой главы мы создадим многостраничный сайт на Wordpress. Настроим каталог товаров с фильтрацией по категориям, настроим пагинацию в каталоге чтобы товары отображались на нескольких страницах если их слишком много. Сделаем страницу товара с галереей, характеристиками и формой заказа товара. Настроим страницу с портфолио компании, где подключим галерею изображений. Научимся выводит записи из разных рубрик, выводить формы с помощью шорткодов, работать с плагином CFS и Contact Form 7 и в завершении курса перенесем все на настоящий хостинг, создадим почтовый домен, настроим работу наших форм и завершим создание сайта.

В этом видео курсе я покажу весь жизненный цикл переноса одностраничного сайта на Wordpress. Мы начнем с установки CMS Wodpress и создания базы данных в phpMyAdmin. После этого приступим к созданию своей темы, научимся подключать стили, скрипты и шрифты. Добавим возможность выбора логотипа сайта через панель настроек Wordpress.

После этого познакомимся с произвольными полями на CMS Wordpress, установим плагин Custom Field Suite и научимся работать с ним. Создадим слайдер с помощью Swiper.js и бесплатного повторителя в плагине CFS. Постепенно перенесем все остальные разделы сайта на Wordpress с помощь плагина CFS, подключим и настроим плагин Contact Form 7 для отправки писем через форму обратной связи.

В завершение работы над сайтом мы перенесем его с локального сервера Open Server на реальный хостинг, я покажу как перенести сайт максимально просто и быстро, настроим Contact Form 7 на оправку писем, добавим защиту от спама с помощью интеграции Google Recapcha и скроем значок recapcha на нашем сайте.

После того как вы пройдете обучение в данном курсе, вы сможете с легкостью перенести практически любой сайт на Wordpress. Имея верстку сайта на HTML+CSS, вы просто и без проблем сможете создать свою собственную тему на Wordpress и настроить её правильно, для того чтобы сайтом можно было управлять из админки.

Для кого этот курс

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

Начальные требования

Начальные требования:

  • Основы HTML и CSS
  • Базовые навыки работы с компьютером
  • Никакой другой предварительной подготовки

Наши преподаватели

Как проходит обучение

Обучение построено на видео уроках. Для лучшего усвоения материала рекомендуется смотреть урок и пробовать повторить все самостоятельно. Почти в каждом уроке доступно одно или более заданий в виде теста, задачи на сопоставление, заполнение пропусков, сортировки и другие. В некоторых уроках есть шаги с заданием в видео формате, где подробно изложены условия и цель задачи. Обязательно читайте всю текстовую информацию к уроку там могут быть полезные ссылки на сторонние ресурсы или на материалы, которые нужны для урока. По желанию можете конспектировать изучаемый материал в любом удобном для вас формате (бумага, цифра). Задействовав дополнительный вид памяти вы улучшите усвоение материала.

Программа курса

загружаем...
Certificate

Сертификат

Stepik

Что вы получаете

  • 5 модулей, в которых вы научитесь верстать сайт из Figma, Pixso, Marsy и переносить его на Wordpress
  • 51 урок, общая продолжительность видео уроков около 15 часов
  • 46 тестовых заданий (вся теория закрепляется на практике на наглядных примерах)
  • много ресурсов для скачивания (ссылки на полезные сервисы, готовые шпаргалки и примеры кода)
  • несколько макетов для практики и готовых работ в своё портфолио
  • выдается сертификат
  • общение с автором и другими учениками, обсуждение уроков и отдельных шагов, можно задавать вопросы под каждым уроком
  • обучение по шагам - учитесь когда вам удобно (нет дедлайнов)
  • обучение может занять от 1 до 2 месяцев, в зависимости от уделенного вами времени
  • вы получите огромный багаж знаний и сможете освоить современную востребованную профессию
Price: Бесплатно

Расскажите о курсе друзьям

Price: Бесплатно