Тема для WordPress в БЭМ. Владимир Гриненко, Яндекс
0 likes2,449 views
Документ описывает разработку темы для WordPress с использованием методологии BEM, предоставляя информацию о структуре проекта и необходимых технологиях (PHP, CSS, JS). Основные темы включают сборку блоков с помощью инструмента BEM и минимизацию кода с утилитами borschik и uglify-js. В документе также содержатся ссылки на ресурсы и шпаргалки для разработчиков.
Тема для WordPress в БЭМ. Владимир Гриненко, Яндекс
- 1. Тема для WordPress в БЭМ Владимир Гриненко Разработчик интерфейсов Yet another Conference, Москва, 19 сентября 2011 года
- 3. BEM – это не только b- 3
- 4. Что мы будем делать Yet another WordPress theme — Описание страницы в формате bemjson 4
- 5. Что мы будем делать Yet another WordPress theme — Описание страницы в формате bemjson — Блоки в технологиях php, css, js 5
- 6. Что мы будем делать Yet another WordPress theme — Описание страницы в формате bemjson — Блоки в технологиях php, css, js — Сборка блоков с помощью BEM tools 6
- 7. Что мы будем делать Yet another WordPress theme — Описание страницы в формате bemjson — Блоки в технологиях php, css, js — Сборка блоков с помощью BEM tools — Разворачивание css-импортов утилитой borschik 7
- 8. Что мы будем делать Yet another WordPress theme — Описание страницы в формате bemjson — Блоки в технологиях php, css, js — Сборка блоков с помощью BEM tools — Разворачивание css-импортов утилитой borschik — Структурная минимизация с CSSO 8
- 9. Что мы будем делать Yet another WordPress theme — Описание страницы в формате bemjson — Блоки в технологиях php, css, js — Сборка блоков с помощью BEM tools — Разворачивание css-импортов утилитой borschik — Структурная минимизация с CSSO — Минимизация js утилитой uglify-js 9
- 10. Ссылки на инструменты Шпаргалка http://clck.ru/L2Lh Репозиторий http://clck.ru/L4lR 10
- 11. Структура проекта bempress/ blocks/ уровень переопределения темы header/ footer/ pages/ уровень переопределения страниц index/ blocks/ single/ 11
- 12. Структура проекта bempress/ blocks/ уровень переопределения темы header/ технологии блока header.css header.js header.php footer/ 12
- 13. Структура проекта bempress/ pages/ уровень переопределения страниц index/ blocks/ блоки уровня страниц header/ header.css доопределение технологии блока index.bemjson.js описание страницы 13