Дизайн

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

Пользователь HabraHabr Алексей (wdmaster) записал видео-курс по созданию Responsive Landing Page на WordPress, состоящий из 13 уроков.

be6a2e56c2e3471aa9390cd73f881de4

Новый видеокурс по созданию адаптивного одностраничного сайта и посадке на 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 — Отправка заявок с сайта
    Free WordPress Themes