Course
2 hours
Practitioner, Developer, Administrator
Beginner
The following has evaluated to null or missing: ==> navigationJSONObject.getJSONObject("course") [in template "17855804202317#32484267#LEARN-COURSE-SIDE-NAV" at line 5, column 28] ---- Tip: If the failing expression is known to legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)?? ---- ---- FTL stack trace ("~" means nesting-related): - Failed at: courseJSONObject = navigationJSONObje... [in template "17855804202317#32484267#LEARN-COURSE-SIDE-NAV" at line 5, column 9] ----
1<#assign
2 groupPathFriendlyURLPublic = themeDisplay.getPathFriendlyURLPublic() + themeDisplay.getScopeGroup().getFriendlyURL()
3 navigationJSONObject = jsonFactoryUtil.createJSONObject(navigation.getData())
4
5 courseJSONObject = navigationJSONObject.getJSONObject("course")
6 modulesJSONArray = navigationJSONObject.getJSONArray("modules")
7/>
8
9<div class="learn-course-side-nav">
10 <div class="learn-course-nav-content">
11 <#if modulesJSONArray.length() gt 0>
12 <ul class="m-0 p-2">
13 <li class="learn-course-nav-item ${(navigationJSONObject.getJSONObject("self").url == courseJSONObject.url)?then("selected", "")}">
14 <a class="liferay-nav-item" href="${courseJSONObject.url}">
15 <span>Introduction</span>
16 </a>
17 </li>
18
19 <#list 0..modulesJSONArray.length()-1 as i>
20 <div>
21 <#assign modulesJSONObject = modulesJSONArray.getJSONObject(i) />
22
23 <div class="panel-group">
24 <div class="panel panel-secondary">
25 <button
26 aria-controls= "collapsePanel${i}"
27 aria-expanded="false"
28 class="btn btn-unstyled panel-header panel-header-link collapse-icon collapse-icon-middle collapsed"
29 data-target= "#collapsePanel${i}"
30 data-toggle="liferay-collapse"
31 onclick="togglePanel(this)"
32 >
33 <span class="panel-title">
34 <li class="learn-course-nav-item">
35 <div
36 class="liferay-nav-item ${(navigationJSONObject.getJSONObject("self").url == modulesJSONObject.url)?then("selected", "")}"
37 href="${modulesJSONObject.url}"
38 style="display: flex; justify-content: space-between;"
39 >
40 <div class="nav-item-number-title">
41 <div>
42 <span class="course-module-number">${i+1}</span>
43 </div>
44
45 <span class="course-module-title">${modulesJSONObject.getString("title")}</span>
46 </div>
47 </div>
48
49 <span class="collapse-icon-closed">
50 <svg
51 class="lexicon-icon lexicon-icon-angle-right"
52 role="presentation"
53 >
54 <use xlink:href="/o/admin-theme/images/clay/icons.svg#angle-right" />
55 </svg>
56 </span>
57 <span class="collapse-icon-open">
58 <svg
59 class="lexicon-icon lexicon-icon-angle-down"
60 role="presentation"
61 >
62 <use xlink:href="/o/admin-theme/images/clay/icons.svg#angle-down" />
63 </svg>
64 </span>
65 </li>
66 </span>
67 </button>
68
69 <div class="panel-collapse collapse" id="collapsePanel${i}">
70 <div class="panel-body">
71 <#assign lessonsJSONArray = modulesJSONObject.getJSONArray("lessons")?eval_json />
72 <#list lessonsJSONArray as lesson>
73 <div class="container-lesson">
74 <div class="course-module-transparent" />
75
76 <a href="${lesson.url}">${lesson.title}</a>
77 </div>
78 </#list>
79 </div>
80 </div>
81 </div>
82 </div>
83 </div>
84 </#list>
85 </ul>
86 </#if>
87 </div>
88</div>
89
90<script>
91 function togglePanel(button) {
92 const courseModuleNumber = button.querySelector('.course-module-number');
93 const liferayNavItem = button.querySelector('.liferay-nav-item');
94
95 if (button.getAttribute('aria-expanded') === 'true') {
96 button.setAttribute('aria-expanded', 'false');
97 courseModuleNumber.classList.remove('highlighted');
98 liferayNavItem.classList.remove('highlightedNavItem');
99 }
100 else {
101 button.setAttribute('aria-expanded', 'true');
102 courseModuleNumber.classList.add('highlighted');
103 liferayNavItem.classList.add('highlightedNavItem');
104 }
105 }
106</script>
Introduction
15 min
In today’s digital market, businesses need to provide users with engaging, personalized online experiences that distinguish their brand and drive conversions. Liferay DXP provides a comprehensive environment for business teams and developers to efficiently build enterprise websites at scale. With low-code capabilities and a user-friendly editor, Liferay’s flexible platform simplifies and optimizes site development. You can also leverage Liferay to unify your technical infrastructure and enable seamless integration with existing systems.
In this course you’ll learn how to build enterprise websites with Liferay following best practices. While this course primarily focuses on the needs of Enterprise Websites, many of the following capabilities and use cases also apply to other solutions. Programming knowledge is not needed, but an understanding of HTML, CSS, Javascript, and templating languages like FreeMarker would be helpful.
Given the breadth and depth of Liferay features and configurations, it is impossible to cover every detail necessary for building a production ready website. However, this course will equip you with the knowledge and skills necessary to tackle real-world problems and create solutions with Liferay.
To bridge the gap between theory and practice, this course will lead you through building an enterprise marketing website for a fictional company, Clarity Vision Solutions. Before diving into the technical aspects of Liferay DXP, we’ll introduce Clarity and outline what you’ll be building.
Capabilities
Product
Contact Us