Урок по созданию сайта на WordPress с использованием Layers. Рассмотрим самый простой и красивый способ создания своей темы на WordPress.
Результат урока: Смотреть
Материалы урока
- Layers 2.0 – Source code(zip): Скачать
- Исходные файлы для прохождения урока: Скачать
- Перевод документации по 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
Другие уроки по теме «CMS/Framework»
- Как создать тему для WordPress. Грамотная посадка верстки на WordPress (Right Way)
- Руководство по созданию тем на WordPress и StyleKit's с использованием Layers Framework
- Layers. Быстрая разработка сайтов на WordPress #1. Знакомство с Layers WP
- Создание лендинга на WordPress с нуля
- Посадка типовой секции Landing Page на MODx с использованием MIGX (добавляемые поля)