Course
2 hours
Practitioner, Developer, Administrator
Beginner
For "." left-hand operand: Expected a hash, but this has evaluated to a string (wrapper: f.t.SimpleScalar):
==> courseData [in template "17855804202317#32484267#LEARN-COURSE-SIDE-NAV" at line 23, column 120]
----
FTL stack trace ("~" means nesting-related):
- Failed at: ${(navigationJSONObject.getJSONObject... [in template "17855804202317#32484267#LEARN-COURSE-SIDE-NAV" at line 23, column 67]
----
1<#assign
2 courseData = ""
3 groupPathFriendlyURLPublic = themeDisplay.getPathFriendlyURLPublic() + themeDisplay.getScopeGroup().getFriendlyURL()
4 navigationJSONObject = jsonFactoryUtil.createJSONObject(navigation.getData())
5
6 childrenJSONArray1 = navigationJSONObject.getJSONArray("children")
7 siblingsJSONArray = navigationJSONObject.getJSONArray("siblings")
8/>
9
10<#list 0..siblingsJSONArray.length()-1 as i>
11 <#assign sibling = siblingsJSONArray.getJSONObject(i) />
12
13 <#if sibling.getString("title") == "${course.getData()}">
14 <#assign courseData = sibling />
15 <#break>
16 </#if>
17</#list>
18
19<div class="learn-article-nav">
20 <div class="learn-article-nav-content">
21 <#if childrenJSONArray1.length() gt 0>
22 <ul class="m-0 p-2">
23 <li class="learn-article-nav-item ${(navigationJSONObject.getJSONObject("self").url == courseData.url)?then("selected", "")}">
24 <a class="liferay-nav-item" href="${courseData.url}">
25 <span>Introduction</span>
26 </a>
27 </li>
28
29 <#list 0..childrenJSONArray1.length()-1 as i>
30 <div>
31 <#assign
32 child = childrenJSONArray1.getJSONObject(i)
33
34 childrenJSONArray2 = child.getJSONArray("children")
35 />
36
37 <div class="panel-group">
38 <div class="panel panel-secondary">
39 <button
40 aria-controls= "collapsePanel${i}"
41 aria-expanded="false"
42 class="btn btn-unstyled panel-header panel-header-link collapse-icon collapse-icon-middle collapsed"
43 data-target= "#collapsePanel${i}"
44 data-toggle="liferay-collapse"
45 onclick="togglePanel(this)"
46 >
47 <span class="panel-title">
48 <li class="learn-article-nav-item">
49 <div
50 class="liferay-nav-item ${(navigationJSONObject.getJSONObject("self").url == child.url)?then("selected", "")}"
51 href="${child.url}"
52 style="display: flex; justify-content: space-between;"
53 >
54 <div class="nav-item-number-title">
55 <div>
56 <span class="course-module-number">${i+1}</span>
57 </div>
58
59 <span class="course-module-title">${child.getString("title")}</span>
60 </div>
61 </div>
62 </li>
63 </span>
64 <span class="collapse-icon-closed">
65 <svg
66 class="lexicon-icon lexicon-icon-angle-right"
67 role="presentation"
68 >
69 <use xlink:href="/o/admin-theme/images/clay/icons.svg#angle-right"></use>
70 </svg>
71 </span>
72 <span class="collapse-icon-open">
73 <svg
74 class="lexicon-icon lexicon-icon-angle-down"
75 role="presentation"
76 >
77 <use xlink:href="/o/admin-theme/images/clay/icons.svg#angle-down"></use>
78 </svg>
79 </span>
80 </button>
81
82 <div class="panel-collapse collapse" id="collapsePanel${i}">
83 <div class="panel-body">
84 <#assign lessons = childrenJSONArray2?eval_json />
85
86 <#list lessons as lesson>
87 <div class="container-lesson"><div class="course-module-transparent" ></div><a href="${lesson.url}">${lesson.title}</a></div>
88 </#list>
89 </div>
90 </div>
91 </div>
92 </div>
93 </div>
94 </#list>
95 </ul>
96 </#if>
97 </div>
98</div>
99
100<script>
101 function togglePanel(button) {
102 const courseModuleNumber = button.querySelector('.course-module-number');
103 const liferayNavItem = button.querySelector('.liferay-nav-item');
104
105 if (button.getAttribute('aria-expanded') === 'true') {
106 button.setAttribute('aria-expanded', 'false');
107 courseModuleNumber.classList.remove('highlighted');
108 liferayNavItem.classList.remove('highlightedNavItem');
109 }
110 else {
111 button.setAttribute('aria-expanded', 'true');
112 courseModuleNumber.classList.add('highlighted');
113 liferayNavItem.classList.add('highlightedNavItem');
114 }
115 }
116</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