WebDesign Master
Курсы
Быстрое создание красивых сайтов на WordPress. Layers Style Kit на реальном примере
WordPress

Быстрое создание красивых сайтов на WordPress. Layers Style Kit на реальном примере

Создадим сайт на WordPress (Style Kit) с использованием WordPress Layers Framework.

Поделиться
Твитнуть
Поделиться
Класснуть
Запинить
Быстрое создание красивых сайтов на WordPress. Layers Style Kit на реальном примере - Видеоурок
Смотреть урок на YouTube
Создание контентного сайта на Jekyll от А до Я

Результат урока: Смотреть

Материалы урока

  • Скачать Layers 2.0 – Source code(zip) с GitHub
  • Исходные файлы для прохождения урока: Скачать
  • Перевод документации по WordPress Layers: Читать
  • layers-style-kit-demo readme.txt на GitHub
  • Рекомендую использовать пипетку Instant Eyedropper

Код для плавного скролла при клике по ссылке с хэшем (в меню):

jQuery(function($) {

	$('a[href^="#"]').live('click', function(event) {
		event.preventDefault();
		var target_offset = $(this.hash).offset() ? $(this.hash).offset().top : 0;
		//change this number to create the additional off set
		var customoffset = 40;
		$('html, body').animate({scrollTop: target_offset - customoffset}, 500);
	});

}(jQuery));
Внимание! С официального сайта Layers рекомендую скачивать только в том случае, если вы хотите использовать связку Layers + Elementor.
Шаги установки Layers 2.0 могут отличаться от первой версии. Просто оставляйте дефолтные значения, нажимая "Вперёд". Интерфейс второй версии может немного отличаться, но там всё интуитивно понятно.
Цвет текста в каждом слайдере можно указать белый как для заголовка, так и для подзаголовка, если у вас цвет текста слайдов по-умолчанию чёрный. Никаких глобальный изменений в работе Layers нет, кроме того, что появился удобный кодовый редактор для кастомного CSS-кода.

Премиум уроки от WebDesign Master

Курс по созданию сайта от А до Я на Jekyll

Создание сайта от А до Я. Комплексный курс

Курс по созданию интернет-магазина на OpenCart

Создание современного интернет-магазина от А до Я

Фриланс для начинающих

Я - фрилансер! Базовый курс для начинающих

Другие уроки по теме «WordPress»

  • Как создать шаблон для WordPress. Грамотная посадка вёрстки на WordPress (Right Way)
  • Руководство по созданию тем на WordPress и StyleKit's с использованием Layers Framework
  • Layers. Быстрая разработка сайтов на WordPress #1. Знакомство с Layers WP
  • Создание Responsive Landing Page на WordPress

Разделы сайта:

  • Курсы
  • HTML и CSS
  • Веб-дизайн
  • Инструменты
  • Оффтоп
  • MODX
  • WordPress
  • jQuery
  • Адаптивный веб-дизайн
  • Создание иконок
  • Обработка изображений
  • Иллюстрации и Инфографика
  • Интерфейсы UI/UX
  • Прототипирование
  • JavaScript
  • Хостинг

Полезные ресурсы:

  • Lazy Load Placeholder
  • Документация Gulp 4
  • Рабочее место разработчика
2021 © WebDesign Master