Magnolia Academy
/
Courses
/
M6.3 - Magnolia Templating Development for the Front-end Developers
/ Exercise: Create a Teaser Component
Courses
Learning Paths
FAQ
Book a demo
My profile
Exercise: Create a Teaser Component
All lessons
✕
1
Getting started with Light Development
2
Preparation: Setting up the environment
3
Magnolia CLI
4
Light modules
5
Exercise: Create a light module
6
Knowledge check
7
Resource files app
8
Exercise: Check the light module in the app
9
Template
10
Page template
11
FreeMarker directives - page
12
Exercise: Create a page template
13
JCR
14
Exercise: Check entries in the JCR browser
15
Resource linking
16
Exercise: Use 'Twitter Bootstrap' CSS Resource
17
Knowledge check (CSS)
18
Dialog
19
Exercise: Add dialog definition and content
20
Accessing the content
21
Render the first Page's content
22
Area template
23
FreeMarker directives - area
24
Exercise: Create an area
25
Component template
26
FreeMarker directives - component
27
Exercise: Create a component template textImage
28
Knowledge check (FreeMarker)
29
FreeMarker: Basics
30
Exercise: 'Text & Image' Component - Create Headline
31
Templating functions
32
Exercise: Make use of cmsfn to decode a property
33
Dam TemplatingFunctions
34
Exercise: Make Use of the Dam TemplatingFunctions
35
Linking in JCR & Magnolia
36
Exercise: Create a Teaser Component
37
Definition Objects - Parameters
38
Exercise: Parameterize a new 'textImageParameters' Component
39
Area Definition - Area Script
40
Exercise: Use the Area Script
41
Definition decorator
42
Exercise: Decorate an app label
43
Definitions App
44
Congratulations!
Exercise: Create a Teaser Component