Создание Responsive Landing Page на WordPress от А до Я

в 7:11, , рубрики: front-end, web-разработка, wordpress, wordpress.com, веб сайты и графический дизайн, веб-дизайн, Веб-разработка, верстка сайтов, дизайн интерфейсов, дизайн сайтов, Мобильный веб, проектирование интерфейсов, проектирование сайтов

Создание Responsive Landing Page на WordPress от А до Я - 1

Новый видеокурс по созданию адаптивного одностраничного сайта и посадке на CMS WordPress. В процессе обучение рассмотрены такие моменты, как проектирование интерфейса, создание скетча, адаптивная верстка и подключение Front-End плагинов, посадка на WordPress и создание опций шаблона. При разработке темплейта учитывалась возможность дистрибуции и распространения темы.

Материалы на GitHub: https://github.com/agragregra/wordpress-landing-page-lesson
Демо фронтенда: http://dev.webdesign-master.ru/_wp_html/

Видеокурс:

Первый урок:

Второй урок:

Третий урок:

Четвертый урок:

Пятый урок:

Шестой урок:

Седьмой урок:

Восьмой урок:

Девятый урок:

Десятый урок:

Одиннадцатый урок:

Двенадцатый урок:

Заключительный урок:

Что использовалось:

  • ru.wordpress.org — Собственной персоной
  • elementary.io — Спасибо за логотип :)
  • getbootstrap.com — Адаптивная сетка
  • jquery.com — Популярнейший javaScript Framework
  • stocksnap.io — Сервис качественных бесплатных фотографий для веб-дизайна
  • wireframe.cc — Отличный сервис для скетчинга
  • gist.github.com — Сервис для хранения полезного кода
  • inkscape.org — Векторный редактор SVG
  • linea.io — Тонкие векторные иконки
  • fortawesome.github.io — Векторные иконки. Использовали для соц. сетей
  • codepen.io — Много интересного кода. Спасибо за Sandwich :)
  • pixelcog.github.io/parallax.js — Параллакс эффект
  • dimsemenov.com/plugins/magnific-popup — Респонсив попап менеджер
  • github.com/malihu/page-scroll-to-id — Плагин навигации по Landing Page
  • imakewebthings.com/waypoints — Триггер для скролла
  • daneden.github.io/animate.css — Анимация элементов на странице
  • mixitup.kunkalabs.com — Сортабельные анимированные плитки в портфолио
  • bourbon.io — Коллекция миксинов для SASS
  • sass-lang.com — Препроцессор SASS
  • koala-app.com — Компилятор для препроцессоров
  • fontsquirrel.com/fonts/raleway — Бесплатный шрифт для нашей темы
  • sublimetext.com — Редактор для фронт-енда
  • jetbrains.com/phpstorm — Редактор для бэк-енда
  • formspree.io — Отправка заявок с сайта

Спасибо за внимание к материалу.

Автор: wdmaster

Источник

Поделиться

* - обязательные к заполнению поля