Core Principles for Theming in Magento 2 (On-Demand)

View class schedule

Prerequisites

For this course, the following skills are required: CSS & CSS 3, HTML & HTML 5, XML, basics of PHP and comfortable with the use of the command line. To enhance your understanding of this course, the following skills are desirable: Responsive Web Design (RWD), LESS, and JavaScript is strongly recommended but not required. Students should have experience working with the Magento 1 platform.

Course Description

This course will introduce Magento 1 front end developers to the Magento 2 platform. Students will understand the fundamentals of Magento's templating system and learn how Magento themes work and all the components of a theme, especially layouts, page templates and block templates. Students will learn to customize both the look and feel and the functionality of a website at the theme level.


This course is based on Magento Community Edition v2.1.0

Course Outline

Unit 1: Overview of Theming in Magento
  • Introduction
  • Folder Structure
  • Static files classification
  • Deployment Process
  • Fallback Process
Theme Architecture
  • M1 <> M2 Comparison
  • .less files organization
  • Style-m and styles-l files
  • Customization approached for .less files
  • .less files deployment and compilation options
  • Using Grunt for deployment and compilation
  • Extending Grunt configuration
  • Non-less files deployment
Layout XML, Blocks & Templates
  • Layouts overview in M2
  • Layout files location
  • Page layouts
  • Basic CSS and JS inclusion
  • Layout files and directives
  • Intro into blocks
  • Templates