Building Magento 2 Themes

2h 58mIntermediate2018-04-04

Authors

Enno Stuurman

Experienced Magento Front-End Developer with a main focus on ecommerce

Course details

Learn how to create and customize Magento 2 themes. Instructor Enno Stuurman begins the course by taking a look at the default Luma theme. After he goes over the structure of Luma, he helps you use that knowledge to build your own unique theme. Enno discusses page layouts in Magento themes, overriding and extending Magento theme CSS, deploying Magento 2 themes to production, and more. Throughout the course, he covers Knockout.js, Grunt, and other tools you need to master Magento theming.

Learning objectives
Creating custom Magento themes
Changing the theme logo and favicon
Moving elements inside a theme layout
Customizing a product page
Understanding CSS in Magento themes
Changing your theme style with overrides
JavaScript in Magento 2 themes

Skills covered

MagentoE-Commerce DevelopmentCSSJavaScriptOracleProjectAdobeWeb DevelopmentOpen Source

Concepts

0. Introduction

01 - Introduction to Magento themes and Luma

1. Starting the Theme

02 - Creating a custom Magento theme
03 - Customizing a Magento theme
04 - Changing the theme logo and favicon

2. Front-End Layout

05 - Editing the output in Magento themes
06 - Page layouts in Magento themes
07 - Moving elements inside the theme layout
08 - Customizing the product page
09 - Controlling the mini cart layout with Knockout.js

3. CSS in Magento Themes

10 - Understanding CSS in Magento themes
11 - Overriding and extending Magento theme CSS
12 - Installing Grunt for compiling Magento CSS
13 - Changing your theme style with overrides

4. JavaScript and Deployment

14 - JavaScript in Magento 2 themes
15 - Deploying Magento 2 themes to production