The following has evaluated to null or missing: ==> dynamicElement.element("dynamic-content") [in template "1415598#1415646#1563732311" at line 65, column 38] ---- 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: #assign ImageBackground = dynamicElem... [in template "1415598#1415646#1563732311" at line 65, column 11] ----
1<#assign base_url = "/web/amfs/"/>
2
3<section class="CX-main CX-card-news media simple">
4 <div class="container CX-wrapper">
5
6 <div class="box-card-news list-news-row">
7 <div class="simple-bar" id="simple-bar-card-media-vertical-list">
8 <div class="row">
9
10 <#-- Sample Data -->
11
12 <#assign paramValue = staticUtil["com.liferay.portal.kernel.util.ParamUtil"].getString(request, "page", "1") />
13 <#assign page = paramValue!1>
14 <#if page?exists>
15 <p class="hide">Current page: ${page}</p>
16 <#else>
17 <p class="hide">Page parameter not found.</p>
18 </#if>
19
20 <#assign items = []>
21 <#if entries?has_content>
22 <!-- membuat list kosong-->
23 <#list entries as curEntry>
24 <#if (curEntry?index > 4)>
25 <#-- Menambahkan item ke list -->
26 <#assign items = items + [curEntry.getTitle(locale)]>
27 </#if>
28 </#list>
29 </#if>
30 <#-- Pagination.ftl -->
31 <#assign itemsPerPage = 10>
32 <#assign totalItems = items?size>
33 <#assign totalPages = (totalItems / itemsPerPage)?ceiling>
34 <#assign currentPage = (page?number)!1>
35 <#assign maxVisiblePages = 5> <!-- Jumlah halaman yang ingin ditampilkan -->
36
37 <!--SATU-->
38 <#if entries?has_content>
39 <#assign no=0/>
40 <#list entries as curEntry>
41 <#if (curEntry?index > 4)>
42 <#assign no++/>
43
44 <#assign entryId = curEntry.getClassPK()/>
45 <#assign renderer = curEntry.getAssetRenderer()/>
46 <#assign className = renderer.getClassName()/>
47
48 <#if className = "com.liferay.journal.model.JournalArticle">
49
50 <#assign journalArticle = renderer.getArticle() />
51 <#assign document = saxReaderUtil.read(journalArticle.getContentByLocale(locale.toString())) />
52 <#assign rootElement = document.getRootElement()/>
53
54 <#assign date = journalArticle.getDisplayDate()/>
55 <#assign displayDate = dateUtil.getDate(date, "dd MMM yyyy", locale)/>
56 <#assign displayTime = dateUtil.getDate(date?time, "HH:mm", locale)/>
57 <#assign curEntryIndex = curEntry_index - 5/>
58 <#if (curEntryIndex >= (currentPage - 1) * itemsPerPage && curEntryIndex < currentPage * itemsPerPage)>
59 <div class="col-sm-12">
60 <div class="box-card-outer vp-fadeinup delayp${no}">
61 <div class="box-card-inner" style="display:flex; align-items:center; margin-top: 20px;">
62 <!--
63 <#list rootElement.elements() as dynamicElement>
64 <#if "ImageBackground" == dynamicElement.attributeValue("name")>
65 <#assign ImageBackground = dynamicElement.element("dynamic-content").getStringValue()/>
66 <#assign path_image = "/documents/"/>
67 <#assign image_json = jsonFactoryUtil.createJSONObject(ImageBackground)/>
68 <#assign image_title = image_json.getString('title') />
69 <#assign image_grupid = image_json.getString('groupId') + "/" />
70 <#assign image_fileEntryId = image_json.getString('fileEntryId') + "/" />
71 <#assign image_name = stringUtil.replace(image_json.getString('name'), " ","%20" )/>
72 <#assign image_uuid = "/" + image_json.getString('uuid') + "/"/>
73 <#assign full_image = path_image + image_grupid + image_fileEntryId + image_name + image_uuid />
74
75 <a href="${assetPublisherHelper.getAssetViewURL(renderRequest, renderResponse, curEntry, true)}" style="width: 250px;">
76 <div class="img-background" style="background-image:url(${full_image}); width:250px; max-height: 200px; background-position: center right; border-radius: 8px;"></div>
77 </a>
78
79 </#if>
80 </#list> -->
81 <div class="box-card-item" style="display:flex; flex-direction:column; margin-left: 20px; margin-top: 0;">
82 <div class="text">
83 <h4><a href="${assetPublisherHelper.getAssetViewURL(renderRequest, renderResponse, curEntry, true)}" >${curEntry.getTitle(locale)}</a></h4>
84
85 <#list rootElement.elements() as dynamicElement>
86 <#if "ShortDescription" == dynamicElement.attributeValue("name")>
87 <#if dynamicElement.element("dynamic-content")?has_content>
88 <#assign ShortDescription = dynamicElement.element("dynamic-content").getText() />
89 <p>${ShortDescription}</p>
90 </#if>
91 </#if>
92 </#list>
93
94 <div class="date">
95 <span>${displayDate}</span>
96
97 </div>
98 </div>
99 <div class="btn-act">
100 <a href="${assetPublisherHelper.getAssetViewURL(renderRequest, renderResponse, curEntry, true)}" class="view-more"><@liferay.language key="selengkapnya" /></a>
101 </div>
102 </div>
103 </div>
104 </div>
105 </div>
106 </#if>
107 </#if>
108 </#if>
109 </#list>
110 </#if>
111 <!--SATU-->
112
113
114
115 </div>
116 </div>
117
118 </div>
119
120 <nav aria-label="Page navigation" id="page-navigation">
121 <ul class="pagination">
122 <#if (currentPage > 1)>
123 <li class="page-item">
124 <a class="page-link" href="?page=${currentPage - 1}"><i class="fas fa-chevron-left"></i></a>
125 </li>
126 <#else>
127 <li class="page-item disabled"><a class="page-link" href="#"><i class="fas fa-chevron-left"></i></a></li>
128 </#if>
129
130 <#-- <#list 1..totalPages as page>
131 <#if page == currentPage>
132 <li class="page-item active">
133 <a class="page-link" href="?page=${page}">${page}</a>
134 </li>
135 <#else>
136 <li class="page-item">
137 <a class="page-link" href="?page=${page}">${page}</a>
138 </li>
139 </#if>
140 </#list> -->
141
142 <#-- Menampilkan halaman dengan elipsis -->
143 <#list 1..totalPages as page>
144 <#if page == 1 || (page >= currentPage - 2 && page <= currentPage + 2)>
145 <#-- Menampilkan halaman jika dalam rentang yang terlihat -->
146 <#if page == currentPage>
147 <li class="page-item active">
148 <span class="current">${page}</span>
149 </li>
150 <#else>
151 <li class="page-item">
152 <a href="?page=${page}">${page}</a>
153 </li>
154 </#if>
155 <#elseif page == currentPage - 3 || page == currentPage + 3>
156 <li class="page-item">
157 <span class="ellipsis">...</span>
158 </li>
159 <#elseif page == totalPages>
160 <li class="page-item">
161 <a href="?page=${page}">${page}</a>
162 </li>
163 </#if>
164 </#list>
165 <#if currentPage < totalPages>
166 <li class="page-item">
167 <a class="page-link" href="?page=${currentPage + 1}"><i class="fas fa-chevron-right"></i></a>
168 </li>
169 <#else>
170 <li class="page-item disabled"><a class="page-link" href="#"><i class="fas fa-chevron-right"></i></a></li>
171 </#if>
172
173 </ul>
174 </nav>
175 </div>
176</section>
177
178<style>
179.CX-card-news.media.simple .box-card-news .box-card-outer .box-card-inner .box-card-item .text h4 {
180 font-size: 1.5rem;
181 }
182
183 .CX-card-news.media.simple .box-card-news .box-card-outer .box-card-inner .box-card-item .text p,
184 .CX-card-news.media.simple .box-card-news .box-card-outer .box-card-inner .box-card-item .text span{
185 font-size: 1.2rem;
186 }
187
188 .CX-card-news.media.simple .box-card-news .box-card-outer .box-card-inner .box-card-item .text .date{
189 margin-bottom: 1rem;
190 }
191
192#page-navigation {
193 margin-top: 30px;
194}
195
196 @media screen and (max-width:768px) {
197
198 }
199
200li.page-item.active {
201 background: #000092;
202 color: #ffffff;
203 padding: 1px 8px 0px 8px;
204 border-radius: 8px;
205}
206
207/* li.page-item.page-next:hover, li.page-item.page-next:active,
208li.page-item.page-prev:hover, li.page-item.page-prev:active {
209 background: #000092;
210 i{
211 color: #ffffff;
212 }
213} */
214
215li.page-item {
216 margin: 0 10px;
217}
218
219.pagination {
220justify-content: center;
221 @media screen and (min-width:768px) {
222 font-size: 1.2rem;
223 }
224}
225</style>
226
227<script type="text/javascript">
228
229 $(document).ready(function () {
230 simpleBarMedia();
231 });
232 $(window).resize(function () {
233 simpleBarMedia();
234 });
235
236 function simpleBarMedia() {
237 if (window.matchMedia("(maxwidth: 1024px)")) {
238 var myElement = document.getElementById("simple-bar-card-media-vertical-list");
239 new SimpleBar(myElement, {
240 forceVisible: true,
241 autoHide: false,
242 });
243 }
244 }
245 </script>