3 <html lang=
"en" class=
"no-js">
7 <meta name=
"viewport" content=
"width=device-width,initial-scale=1">
11 <link rel=
"canonical" href=
"https://docs.woltlab.com/6.1/view/templates/">
14 <link rel=
"prev" href=
"../languages/">
17 <link rel=
"next" href=
"../template-modifiers/">
20 <link rel=
"icon" href=
"../../assets/default.favicon.ico">
21 <meta name=
"generator" content=
"mkdocs-1.5.3, mkdocs-material-9.4.2">
25 <title>Templates - WoltLab Suite Documentation
</title>
29 <link rel=
"stylesheet" href=
"../../assets/stylesheets/main.d451bc0e.min.css">
32 <link rel=
"stylesheet" href=
"../../assets/stylesheets/palette.a5377069.min.css">
45 <link rel=
"stylesheet" href=
"../../stylesheets/extra.css">
47 <script>__md_scope=new URL(
"../..",location),__md_hash=e=
>[...e].reduce((e,_)=
>(e<
<5)-e+_.charCodeAt(
0),
0),__md_get=(e,_=localStorage,t=__md_scope)=
>JSON.parse(_.getItem(t.pathname+
"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=
>{try{t.setItem(a.pathname+
"."+e,JSON.stringify(_))}catch(e){}}
</script>
62 <body dir=
"ltr" data-md-color-scheme=
"default" data-md-color-primary=
"teal" data-md-color-accent=
"indigo">
66 <input class=
"md-toggle" data-md-toggle=
"drawer" type=
"checkbox" id=
"__drawer" autocomplete=
"off">
67 <input class=
"md-toggle" data-md-toggle=
"search" type=
"checkbox" id=
"__search" autocomplete=
"off">
68 <label class=
"md-overlay" for=
"__drawer"></label>
69 <div data-md-component=
"skip">
72 <a href=
"#templates" class=
"md-skip">
77 <div data-md-component=
"announce">
79 <aside class=
"md-banner">
80 <div class=
"md-banner__inner md-grid md-typeset">
83 <a href=
"https://www.woltlab.com">Back to
<strong>woltlab.com
</strong></a>
91 <div data-md-color-scheme=
"default" data-md-component=
"outdated" hidden
>
100 <header class=
"md-header md-header--shadow" data-md-component=
"header">
101 <nav class=
"md-header__inner md-grid" aria-label=
"Header">
102 <a href=
"../.." title=
"WoltLab Suite Documentation" class=
"md-header__button md-logo" aria-label=
"WoltLab Suite Documentation" data-md-component=
"logo">
104 <img src=
"../../assets/logo.png" alt=
"logo">
107 <label class=
"md-header__button md-icon" for=
"__drawer">
109 <svg xmlns=
"http://www.w3.org/2000/svg" viewBox=
"0 0 24 24"><path d=
"M3 6h18v2H3V6m0 5h18v2H3v-2m0 5h18v2H3v-2Z"/></svg>
111 <div class=
"md-header__title" data-md-component=
"header-title">
112 <div class=
"md-header__ellipsis">
113 <div class=
"md-header__topic">
114 <span class=
"md-ellipsis">
115 WoltLab Suite Documentation
118 <div class=
"md-header__topic" data-md-component=
"header-topic">
119 <span class=
"md-ellipsis">
132 <label class=
"md-header__button md-icon" for=
"__search">
134 <svg xmlns=
"http://www.w3.org/2000/svg" viewBox=
"0 0 24 24"><path d=
"M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5Z"/></svg>
136 <div class=
"md-search" data-md-component=
"search" role=
"dialog">
137 <label class=
"md-search__overlay" for=
"__search"></label>
138 <div class=
"md-search__inner" role=
"search">
139 <form class=
"md-search__form" name=
"search">
140 <input type=
"text" class=
"md-search__input" name=
"query" aria-label=
"Search" placeholder=
"Search" autocapitalize=
"off" autocorrect=
"off" autocomplete=
"off" spellcheck=
"false" data-md-component=
"search-query" required
>
141 <label class=
"md-search__icon md-icon" for=
"__search">
143 <svg xmlns=
"http://www.w3.org/2000/svg" viewBox=
"0 0 24 24"><path d=
"M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5Z"/></svg>
145 <svg xmlns=
"http://www.w3.org/2000/svg" viewBox=
"0 0 24 24"><path d=
"M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12Z"/></svg>
147 <nav class=
"md-search__options" aria-label=
"Search">
149 <button type=
"reset" class=
"md-search__icon md-icon" title=
"Clear" aria-label=
"Clear" tabindex=
"-1">
151 <svg xmlns=
"http://www.w3.org/2000/svg" viewBox=
"0 0 24 24"><path d=
"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41Z"/></svg>
156 <div class=
"md-search__output">
157 <div class=
"md-search__scrollwrap" data-md-scrollfix
>
158 <div class=
"md-search-result" data-md-component=
"search-result">
159 <div class=
"md-search-result__meta">
162 <ol class=
"md-search-result__list" role=
"presentation"></ol>
170 <div class=
"md-header__source">
171 <a href=
"https://github.com/WoltLab/docs.woltlab.com/" title=
"Go to repository" class=
"md-source" data-md-component=
"source">
172 <div class=
"md-source__icon md-icon">
174 <svg xmlns=
"http://www.w3.org/2000/svg" viewBox=
"0 0 448 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2023 Fonticons, Inc.--><path d=
"M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
176 <div class=
"md-source__repository">
186 <div class=
"md-container" data-md-component=
"container">
193 <main class=
"md-main" data-md-component=
"main">
194 <div class=
"md-main__inner md-grid">
198 <div class=
"md-sidebar md-sidebar--primary" data-md-component=
"sidebar" data-md-type=
"navigation" >
199 <div class=
"md-sidebar__scrollwrap">
200 <div class=
"md-sidebar__inner">
205 <nav class=
"md-nav md-nav--primary" aria-label=
"Navigation" data-md-level=
"0">
206 <label class=
"md-nav__title" for=
"__drawer">
207 <a href=
"../.." title=
"WoltLab Suite Documentation" class=
"md-nav__button md-logo" aria-label=
"WoltLab Suite Documentation" data-md-component=
"logo">
209 <img src=
"../../assets/logo.png" alt=
"logo">
212 WoltLab Suite Documentation
215 <div class=
"md-nav__source">
216 <a href=
"https://github.com/WoltLab/docs.woltlab.com/" title=
"Go to repository" class=
"md-source" data-md-component=
"source">
217 <div class=
"md-source__icon md-icon">
219 <svg xmlns=
"http://www.w3.org/2000/svg" viewBox=
"0 0 448 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2023 Fonticons, Inc.--><path d=
"M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
221 <div class=
"md-source__repository">
227 <ul class=
"md-nav__list" data-md-scrollfix
>
234 <li class=
"md-nav__item">
235 <a href=
"../../getting-started/" class=
"md-nav__link">
238 <span class=
"md-ellipsis">
258 <li class=
"md-nav__item md-nav__item--nested">
263 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_2" >
266 <label class=
"md-nav__link" for=
"__nav_2" id=
"__nav_2_label" tabindex=
"0">
269 <span class=
"md-ellipsis">
274 <span class=
"md-nav__icon md-icon"></span>
277 <nav class=
"md-nav" data-md-level=
"1" aria-labelledby=
"__nav_2_label" aria-expanded=
"false">
278 <label class=
"md-nav__title" for=
"__nav_2">
279 <span class=
"md-nav__icon md-icon"></span>
282 <ul class=
"md-nav__list" data-md-scrollfix
>
289 <li class=
"md-nav__item">
290 <a href=
"../../php/pages/" class=
"md-nav__link">
293 <span class=
"md-ellipsis">
309 <li class=
"md-nav__item">
310 <a href=
"../../php/database-objects/" class=
"md-nav__link">
313 <span class=
"md-ellipsis">
329 <li class=
"md-nav__item">
330 <a href=
"../../php/database-access/" class=
"md-nav__link">
333 <span class=
"md-ellipsis">
349 <li class=
"md-nav__item">
350 <a href=
"../../php/exceptions/" class=
"md-nav__link">
353 <span class=
"md-ellipsis">
374 <li class=
"md-nav__item md-nav__item--nested">
379 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_2_5" >
382 <label class=
"md-nav__link" for=
"__nav_2_5" id=
"__nav_2_5_label" tabindex=
"0">
385 <span class=
"md-ellipsis">
390 <span class=
"md-nav__icon md-icon"></span>
393 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_2_5_label" aria-expanded=
"false">
394 <label class=
"md-nav__title" for=
"__nav_2_5">
395 <span class=
"md-nav__icon md-icon"></span>
398 <ul class=
"md-nav__list" data-md-scrollfix
>
410 <li class=
"md-nav__item md-nav__item--nested">
415 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_2_5_1" >
418 <label class=
"md-nav__link" for=
"__nav_2_5_1" id=
"__nav_2_5_1_label" tabindex=
"0">
421 <span class=
"md-ellipsis">
426 <span class=
"md-nav__icon md-icon"></span>
429 <nav class=
"md-nav" data-md-level=
"3" aria-labelledby=
"__nav_2_5_1_label" aria-expanded=
"false">
430 <label class=
"md-nav__title" for=
"__nav_2_5_1">
431 <span class=
"md-nav__icon md-icon"></span>
434 <ul class=
"md-nav__list" data-md-scrollfix
>
441 <li class=
"md-nav__item">
442 <a href=
"../../php/api/caches/" class=
"md-nav__link">
445 <span class=
"md-ellipsis">
461 <li class=
"md-nav__item">
462 <a href=
"../../php/api/caches_persistent-caches/" class=
"md-nav__link">
465 <span class=
"md-ellipsis">
481 <li class=
"md-nav__item">
482 <a href=
"../../php/api/caches_runtime-caches/" class=
"md-nav__link">
485 <span class=
"md-ellipsis">
509 <li class=
"md-nav__item">
510 <a href=
"../../php/api/comments/" class=
"md-nav__link">
513 <span class=
"md-ellipsis">
529 <li class=
"md-nav__item">
530 <a href=
"../../php/api/cronjobs/" class=
"md-nav__link">
533 <span class=
"md-ellipsis">
549 <li class=
"md-nav__item">
550 <a href=
"../../php/api/events/" class=
"md-nav__link">
553 <span class=
"md-ellipsis">
574 <li class=
"md-nav__item md-nav__item--nested">
579 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_2_5_5" >
582 <label class=
"md-nav__link" for=
"__nav_2_5_5" id=
"__nav_2_5_5_label" tabindex=
"0">
585 <span class=
"md-ellipsis">
590 <span class=
"md-nav__icon md-icon"></span>
593 <nav class=
"md-nav" data-md-level=
"3" aria-labelledby=
"__nav_2_5_5_label" aria-expanded=
"false">
594 <label class=
"md-nav__title" for=
"__nav_2_5_5">
595 <span class=
"md-nav__icon md-icon"></span>
598 <ul class=
"md-nav__list" data-md-scrollfix
>
605 <li class=
"md-nav__item">
606 <a href=
"../../php/api/form_builder/overview/" class=
"md-nav__link">
609 <span class=
"md-ellipsis">
625 <li class=
"md-nav__item">
626 <a href=
"../../php/api/form_builder/structure/" class=
"md-nav__link">
629 <span class=
"md-ellipsis">
645 <li class=
"md-nav__item">
646 <a href=
"../../php/api/form_builder/form_fields/" class=
"md-nav__link">
649 <span class=
"md-ellipsis">
665 <li class=
"md-nav__item">
666 <a href=
"../../php/api/form_builder/validation_data/" class=
"md-nav__link">
669 <span class=
"md-ellipsis">
685 <li class=
"md-nav__item">
686 <a href=
"../../php/api/form_builder/dependencies/" class=
"md-nav__link">
689 <span class=
"md-ellipsis">
713 <li class=
"md-nav__item">
714 <a href=
"../../php/api/package_installation_plugins/" class=
"md-nav__link">
717 <span class=
"md-ellipsis">
718 Package Installation Plugins
733 <li class=
"md-nav__item">
734 <a href=
"../../php/api/user_activity_points/" class=
"md-nav__link">
737 <span class=
"md-ellipsis">
753 <li class=
"md-nav__item">
754 <a href=
"../../php/api/user_notifications/" class=
"md-nav__link">
757 <span class=
"md-ellipsis">
773 <li class=
"md-nav__item">
774 <a href=
"../../php/api/rss_feeds/" class=
"md-nav__link">
777 <span class=
"md-ellipsis">
793 <li class=
"md-nav__item">
794 <a href=
"../../php/api/sitemaps/" class=
"md-nav__link">
797 <span class=
"md-ellipsis">
821 <li class=
"md-nav__item">
822 <a href=
"../../php/code-style/" class=
"md-nav__link">
825 <span class=
"md-ellipsis">
841 <li class=
"md-nav__item">
842 <a href=
"../../php/apps/" class=
"md-nav__link">
845 <span class=
"md-ellipsis">
861 <li class=
"md-nav__item">
862 <a href=
"../../php/gdpr/" class=
"md-nav__link">
865 <span class=
"md-ellipsis">
895 <li class=
"md-nav__item md-nav__item--active md-nav__item--nested">
900 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_3" checked
>
903 <label class=
"md-nav__link" for=
"__nav_3" id=
"__nav_3_label" tabindex=
"0">
906 <span class=
"md-ellipsis">
907 Languages, Templates & CSS
911 <span class=
"md-nav__icon md-icon"></span>
914 <nav class=
"md-nav" data-md-level=
"1" aria-labelledby=
"__nav_3_label" aria-expanded=
"true">
915 <label class=
"md-nav__title" for=
"__nav_3">
916 <span class=
"md-nav__icon md-icon"></span>
917 Languages, Templates & CSS
919 <ul class=
"md-nav__list" data-md-scrollfix
>
926 <li class=
"md-nav__item">
927 <a href=
"../languages/" class=
"md-nav__link">
930 <span class=
"md-ellipsis">
948 <li class=
"md-nav__item md-nav__item--active">
950 <input class=
"md-nav__toggle md-toggle" type=
"checkbox" id=
"__toc">
956 <label class=
"md-nav__link md-nav__link--active" for=
"__toc">
959 <span class=
"md-ellipsis">
964 <span class=
"md-nav__icon md-icon"></span>
967 <a href=
"./" class=
"md-nav__link md-nav__link--active">
970 <span class=
"md-ellipsis">
979 <nav class=
"md-nav md-nav--secondary" aria-label=
"Table of contents">
986 <label class=
"md-nav__title" for=
"__toc">
987 <span class=
"md-nav__icon md-icon"></span>
990 <ul class=
"md-nav__list" data-md-component=
"toc" data-md-scrollfix
>
992 <li class=
"md-nav__item">
993 <a href=
"#template-types-and-conventions" class=
"md-nav__link">
994 Template Types and Conventions
999 <li class=
"md-nav__item">
1000 <a href=
"#installing-templates" class=
"md-nav__link">
1001 Installing Templates
1006 <li class=
"md-nav__item">
1007 <a href=
"#base-templates" class=
"md-nav__link">
1011 <nav class=
"md-nav" aria-label=
"Base Templates">
1012 <ul class=
"md-nav__list">
1014 <li class=
"md-nav__item">
1015 <a href=
"#frontend" class=
"md-nav__link">
1021 <li class=
"md-nav__item">
1022 <a href=
"#backend" class=
"md-nav__link">
1033 <li class=
"md-nav__item">
1034 <a href=
"#common-template-components" class=
"md-nav__link">
1035 Common Template Components
1038 <nav class=
"md-nav" aria-label=
"Common Template Components">
1039 <ul class=
"md-nav__list">
1041 <li class=
"md-nav__item">
1042 <a href=
"#forms" class=
"md-nav__link">
1048 <li class=
"md-nav__item">
1049 <a href=
"#tab-menus" class=
"md-nav__link">
1060 <li class=
"md-nav__item">
1061 <a href=
"#template-scripting" class=
"md-nav__link">
1065 <nav class=
"md-nav" aria-label=
"Template Scripting">
1066 <ul class=
"md-nav__list">
1068 <li class=
"md-nav__item">
1069 <a href=
"#template-variables" class=
"md-nav__link">
1073 <nav class=
"md-nav" aria-label=
"Template Variables">
1074 <ul class=
"md-nav__list">
1076 <li class=
"md-nav__item">
1077 <a href=
"#modifiers" class=
"md-nav__link">
1083 <li class=
"md-nav__item">
1084 <a href=
"#system-template-variable" class=
"md-nav__link">
1085 System Template Variable
1095 <li class=
"md-nav__item">
1096 <a href=
"#comments" class=
"md-nav__link">
1102 <li class=
"md-nav__item">
1103 <a href=
"#conditions" class=
"md-nav__link">
1109 <li class=
"md-nav__item">
1110 <a href=
"#foreach-loops" class=
"md-nav__link">
1116 <li class=
"md-nav__item">
1117 <a href=
"#including-other-templates" class=
"md-nav__link">
1118 Including Other Templates
1123 <li class=
"md-nav__item">
1124 <a href=
"#template-plugins" class=
"md-nav__link">
1149 <li class=
"md-nav__item">
1150 <a href=
"../template-modifiers/" class=
"md-nav__link">
1153 <span class=
"md-ellipsis">
1169 <li class=
"md-nav__item">
1170 <a href=
"../template-plugins/" class=
"md-nav__link">
1173 <span class=
"md-ellipsis">
1189 <li class=
"md-nav__item">
1190 <a href=
"../css/" class=
"md-nav__link">
1193 <span class=
"md-ellipsis">
1221 <li class=
"md-nav__item md-nav__item--nested">
1226 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_4" >
1229 <label class=
"md-nav__link" for=
"__nav_4" id=
"__nav_4_label" tabindex=
"0">
1232 <span class=
"md-ellipsis">
1233 TypeScript and JavaScript API
1237 <span class=
"md-nav__icon md-icon"></span>
1240 <nav class=
"md-nav" data-md-level=
"1" aria-labelledby=
"__nav_4_label" aria-expanded=
"false">
1241 <label class=
"md-nav__title" for=
"__nav_4">
1242 <span class=
"md-nav__icon md-icon"></span>
1243 TypeScript and JavaScript API
1245 <ul class=
"md-nav__list" data-md-scrollfix
>
1252 <li class=
"md-nav__item">
1253 <a href=
"../../javascript/general-usage/" class=
"md-nav__link">
1256 <span class=
"md-ellipsis">
1272 <li class=
"md-nav__item">
1273 <a href=
"../../javascript/typescript/" class=
"md-nav__link">
1276 <span class=
"md-ellipsis">
1297 <li class=
"md-nav__item md-nav__item--nested">
1302 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_4_3" >
1305 <label class=
"md-nav__link" for=
"__nav_4_3" id=
"__nav_4_3_label" tabindex=
"0">
1308 <span class=
"md-ellipsis">
1313 <span class=
"md-nav__icon md-icon"></span>
1316 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_4_3_label" aria-expanded=
"false">
1317 <label class=
"md-nav__title" for=
"__nav_4_3">
1318 <span class=
"md-nav__icon md-icon"></span>
1321 <ul class=
"md-nav__list" data-md-scrollfix
>
1328 <li class=
"md-nav__item">
1329 <a href=
"../../javascript/components_ckeditor5/" class=
"md-nav__link">
1332 <span class=
"md-ellipsis">
1348 <li class=
"md-nav__item">
1349 <a href=
"../../javascript/components_confirmation/" class=
"md-nav__link">
1352 <span class=
"md-ellipsis">
1368 <li class=
"md-nav__item">
1369 <a href=
"../../javascript/components_dialog/" class=
"md-nav__link">
1372 <span class=
"md-ellipsis">
1388 <li class=
"md-nav__item">
1389 <a href=
"../../javascript/components_google_maps/" class=
"md-nav__link">
1392 <span class=
"md-ellipsis">
1408 <li class=
"md-nav__item">
1409 <a href=
"../../javascript/components_pagination/" class=
"md-nav__link">
1412 <span class=
"md-ellipsis">
1441 <li class=
"md-nav__item md-nav__item--nested">
1446 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_4_4" >
1449 <label class=
"md-nav__link" for=
"__nav_4_4" id=
"__nav_4_4_label" tabindex=
"0">
1452 <span class=
"md-ellipsis">
1457 <span class=
"md-nav__icon md-icon"></span>
1460 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_4_4_label" aria-expanded=
"false">
1461 <label class=
"md-nav__title" for=
"__nav_4_4">
1462 <span class=
"md-nav__icon md-icon"></span>
1465 <ul class=
"md-nav__list" data-md-scrollfix
>
1472 <li class=
"md-nav__item">
1473 <a href=
"../../javascript/new-api_writing-a-module/" class=
"md-nav__link">
1476 <span class=
"md-ellipsis">
1492 <li class=
"md-nav__item">
1493 <a href=
"../../javascript/new-api_core/" class=
"md-nav__link">
1496 <span class=
"md-ellipsis">
1512 <li class=
"md-nav__item">
1513 <a href=
"../../javascript/new-api_dom/" class=
"md-nav__link">
1516 <span class=
"md-ellipsis">
1532 <li class=
"md-nav__item">
1533 <a href=
"../../javascript/new-api_events/" class=
"md-nav__link">
1536 <span class=
"md-ellipsis">
1552 <li class=
"md-nav__item">
1553 <a href=
"../../javascript/new-api_ajax/" class=
"md-nav__link">
1556 <span class=
"md-ellipsis">
1572 <li class=
"md-nav__item">
1573 <a href=
"../../javascript/new-api_dialogs/" class=
"md-nav__link">
1576 <span class=
"md-ellipsis">
1592 <li class=
"md-nav__item">
1593 <a href=
"../../javascript/new-api_browser/" class=
"md-nav__link">
1596 <span class=
"md-ellipsis">
1597 Browser and Screen Sizes
1612 <li class=
"md-nav__item">
1613 <a href=
"../../javascript/new-api_ui/" class=
"md-nav__link">
1616 <span class=
"md-ellipsis">
1640 <li class=
"md-nav__item">
1641 <a href=
"../../javascript/legacy-api/" class=
"md-nav__link">
1644 <span class=
"md-ellipsis">
1660 <li class=
"md-nav__item">
1661 <a href=
"../../javascript/code-snippets/" class=
"md-nav__link">
1664 <span class=
"md-ellipsis">
1692 <li class=
"md-nav__item md-nav__item--nested">
1697 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_5" >
1700 <label class=
"md-nav__link" for=
"__nav_5" id=
"__nav_5_label" tabindex=
"0">
1703 <span class=
"md-ellipsis">
1708 <span class=
"md-nav__icon md-icon"></span>
1711 <nav class=
"md-nav" data-md-level=
"1" aria-labelledby=
"__nav_5_label" aria-expanded=
"false">
1712 <label class=
"md-nav__title" for=
"__nav_5">
1713 <span class=
"md-nav__icon md-icon"></span>
1716 <ul class=
"md-nav__list" data-md-scrollfix
>
1723 <li class=
"md-nav__item">
1724 <a href=
"../../package/package-xml/" class=
"md-nav__link">
1727 <span class=
"md-ellipsis">
1748 <li class=
"md-nav__item md-nav__item--nested">
1753 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_5_2" >
1756 <label class=
"md-nav__link" for=
"__nav_5_2" id=
"__nav_5_2_label" tabindex=
"0">
1759 <span class=
"md-ellipsis">
1764 <span class=
"md-nav__icon md-icon"></span>
1767 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_5_2_label" aria-expanded=
"false">
1768 <label class=
"md-nav__title" for=
"__nav_5_2">
1769 <span class=
"md-nav__icon md-icon"></span>
1772 <ul class=
"md-nav__list" data-md-scrollfix
>
1779 <li class=
"md-nav__item">
1780 <a href=
"../../package/pip/" class=
"md-nav__link">
1783 <span class=
"md-ellipsis">
1799 <li class=
"md-nav__item">
1800 <a href=
"../../package/pip/acl-option/" class=
"md-nav__link">
1803 <span class=
"md-ellipsis">
1819 <li class=
"md-nav__item">
1820 <a href=
"../../package/pip/acp-menu/" class=
"md-nav__link">
1823 <span class=
"md-ellipsis">
1839 <li class=
"md-nav__item">
1840 <a href=
"../../package/pip/acp-search-provider/" class=
"md-nav__link">
1843 <span class=
"md-ellipsis">
1859 <li class=
"md-nav__item">
1860 <a href=
"../../package/pip/acp-template/" class=
"md-nav__link">
1863 <span class=
"md-ellipsis">
1879 <li class=
"md-nav__item">
1880 <a href=
"../../package/pip/acp-template-delete/" class=
"md-nav__link">
1883 <span class=
"md-ellipsis">
1899 <li class=
"md-nav__item">
1900 <a href=
"../../package/pip/bbcode/" class=
"md-nav__link">
1903 <span class=
"md-ellipsis">
1919 <li class=
"md-nav__item">
1920 <a href=
"../../package/pip/box/" class=
"md-nav__link">
1923 <span class=
"md-ellipsis">
1939 <li class=
"md-nav__item">
1940 <a href=
"../../package/pip/clipboard-action/" class=
"md-nav__link">
1943 <span class=
"md-ellipsis">
1959 <li class=
"md-nav__item">
1960 <a href=
"../../package/pip/core-object/" class=
"md-nav__link">
1963 <span class=
"md-ellipsis">
1979 <li class=
"md-nav__item">
1980 <a href=
"../../package/pip/cronjob/" class=
"md-nav__link">
1983 <span class=
"md-ellipsis">
1999 <li class=
"md-nav__item">
2000 <a href=
"../../package/pip/database/" class=
"md-nav__link">
2003 <span class=
"md-ellipsis">
2019 <li class=
"md-nav__item">
2020 <a href=
"../../package/pip/event-listener/" class=
"md-nav__link">
2023 <span class=
"md-ellipsis">
2039 <li class=
"md-nav__item">
2040 <a href=
"../../package/pip/file/" class=
"md-nav__link">
2043 <span class=
"md-ellipsis">
2059 <li class=
"md-nav__item">
2060 <a href=
"../../package/pip/file-delete/" class=
"md-nav__link">
2063 <span class=
"md-ellipsis">
2079 <li class=
"md-nav__item">
2080 <a href=
"../../package/pip/language/" class=
"md-nav__link">
2083 <span class=
"md-ellipsis">
2099 <li class=
"md-nav__item">
2100 <a href=
"../../package/pip/media-provider/" class=
"md-nav__link">
2103 <span class=
"md-ellipsis">
2119 <li class=
"md-nav__item">
2120 <a href=
"../../package/pip/menu/" class=
"md-nav__link">
2123 <span class=
"md-ellipsis">
2139 <li class=
"md-nav__item">
2140 <a href=
"../../package/pip/menu-item/" class=
"md-nav__link">
2143 <span class=
"md-ellipsis">
2159 <li class=
"md-nav__item">
2160 <a href=
"../../package/pip/object-type/" class=
"md-nav__link">
2163 <span class=
"md-ellipsis">
2179 <li class=
"md-nav__item">
2180 <a href=
"../../package/pip/object-type-definition/" class=
"md-nav__link">
2183 <span class=
"md-ellipsis">
2184 objectTypeDefinition
2199 <li class=
"md-nav__item">
2200 <a href=
"../../package/pip/option/" class=
"md-nav__link">
2203 <span class=
"md-ellipsis">
2219 <li class=
"md-nav__item">
2220 <a href=
"../../package/pip/page/" class=
"md-nav__link">
2223 <span class=
"md-ellipsis">
2239 <li class=
"md-nav__item">
2240 <a href=
"../../package/pip/pip/" class=
"md-nav__link">
2243 <span class=
"md-ellipsis">
2259 <li class=
"md-nav__item">
2260 <a href=
"../../package/pip/script/" class=
"md-nav__link">
2263 <span class=
"md-ellipsis">
2279 <li class=
"md-nav__item">
2280 <a href=
"../../package/pip/smiley/" class=
"md-nav__link">
2283 <span class=
"md-ellipsis">
2299 <li class=
"md-nav__item">
2300 <a href=
"../../package/pip/sql/" class=
"md-nav__link">
2303 <span class=
"md-ellipsis">
2319 <li class=
"md-nav__item">
2320 <a href=
"../../package/pip/style/" class=
"md-nav__link">
2323 <span class=
"md-ellipsis">
2339 <li class=
"md-nav__item">
2340 <a href=
"../../package/pip/template/" class=
"md-nav__link">
2343 <span class=
"md-ellipsis">
2359 <li class=
"md-nav__item">
2360 <a href=
"../../package/pip/template-delete/" class=
"md-nav__link">
2363 <span class=
"md-ellipsis">
2379 <li class=
"md-nav__item">
2380 <a href=
"../../package/pip/template-listener/" class=
"md-nav__link">
2383 <span class=
"md-ellipsis">
2399 <li class=
"md-nav__item">
2400 <a href=
"../../package/pip/user-group-option/" class=
"md-nav__link">
2403 <span class=
"md-ellipsis">
2419 <li class=
"md-nav__item">
2420 <a href=
"../../package/pip/user-menu/" class=
"md-nav__link">
2423 <span class=
"md-ellipsis">
2439 <li class=
"md-nav__item">
2440 <a href=
"../../package/pip/user-notification-event/" class=
"md-nav__link">
2443 <span class=
"md-ellipsis">
2444 userNotificationEvent
2459 <li class=
"md-nav__item">
2460 <a href=
"../../package/pip/user-option/" class=
"md-nav__link">
2463 <span class=
"md-ellipsis">
2479 <li class=
"md-nav__item">
2480 <a href=
"../../package/pip/user-profile-menu/" class=
"md-nav__link">
2483 <span class=
"md-ellipsis">
2507 <li class=
"md-nav__item">
2508 <a href=
"../../package/database-php-api/" class=
"md-nav__link">
2511 <span class=
"md-ellipsis">
2539 <li class=
"md-nav__item md-nav__item--nested">
2544 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6" >
2547 <label class=
"md-nav__link" for=
"__nav_6" id=
"__nav_6_label" tabindex=
"0">
2550 <span class=
"md-ellipsis">
2555 <span class=
"md-nav__icon md-icon"></span>
2558 <nav class=
"md-nav" data-md-level=
"1" aria-labelledby=
"__nav_6_label" aria-expanded=
"false">
2559 <label class=
"md-nav__title" for=
"__nav_6">
2560 <span class=
"md-nav__icon md-icon"></span>
2563 <ul class=
"md-nav__list" data-md-scrollfix
>
2575 <li class=
"md-nav__item md-nav__item--nested">
2580 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_1" >
2583 <label class=
"md-nav__link" for=
"__nav_6_1" id=
"__nav_6_1_label" tabindex=
"0">
2586 <span class=
"md-ellipsis">
2587 From WoltLab Suite
6.0
2591 <span class=
"md-nav__icon md-icon"></span>
2594 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_1_label" aria-expanded=
"false">
2595 <label class=
"md-nav__title" for=
"__nav_6_1">
2596 <span class=
"md-nav__icon md-icon"></span>
2597 From WoltLab Suite
6.0
2599 <ul class=
"md-nav__list" data-md-scrollfix
>
2606 <li class=
"md-nav__item">
2607 <a href=
"../../migration/wsc60/php/" class=
"md-nav__link">
2610 <span class=
"md-ellipsis">
2626 <li class=
"md-nav__item">
2627 <a href=
"../../migration/wsc60/templates/" class=
"md-nav__link">
2630 <span class=
"md-ellipsis">
2646 <li class=
"md-nav__item">
2647 <a href=
"../../migration/wsc60/deprecations_removals/" class=
"md-nav__link">
2650 <span class=
"md-ellipsis">
2651 Deprecations and Removals
2679 <li class=
"md-nav__item md-nav__item--nested">
2684 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_2" >
2687 <label class=
"md-nav__link" for=
"__nav_6_2" id=
"__nav_6_2_label" tabindex=
"0">
2690 <span class=
"md-ellipsis">
2691 From WoltLab Suite
5.5
2695 <span class=
"md-nav__icon md-icon"></span>
2698 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_2_label" aria-expanded=
"false">
2699 <label class=
"md-nav__title" for=
"__nav_6_2">
2700 <span class=
"md-nav__icon md-icon"></span>
2701 From WoltLab Suite
5.5
2703 <ul class=
"md-nav__list" data-md-scrollfix
>
2710 <li class=
"md-nav__item">
2711 <a href=
"../../migration/wsc55/php/" class=
"md-nav__link">
2714 <span class=
"md-ellipsis">
2730 <li class=
"md-nav__item">
2731 <a href=
"../../migration/wsc55/javascript/" class=
"md-nav__link">
2734 <span class=
"md-ellipsis">
2735 TypeScript and JavaScript
2750 <li class=
"md-nav__item">
2751 <a href=
"../../migration/wsc55/templates/" class=
"md-nav__link">
2754 <span class=
"md-ellipsis">
2770 <li class=
"md-nav__item">
2771 <a href=
"../../migration/wsc55/icons/" class=
"md-nav__link">
2774 <span class=
"md-ellipsis">
2790 <li class=
"md-nav__item">
2791 <a href=
"../../migration/wsc55/dialogs/" class=
"md-nav__link">
2794 <span class=
"md-ellipsis">
2810 <li class=
"md-nav__item">
2811 <a href=
"../../migration/wsc55/libraries/" class=
"md-nav__link">
2814 <span class=
"md-ellipsis">
2815 Third Party Libraries
2830 <li class=
"md-nav__item">
2831 <a href=
"../../migration/wsc55/deprecations_removals/" class=
"md-nav__link">
2834 <span class=
"md-ellipsis">
2835 Deprecations and Removals
2863 <li class=
"md-nav__item md-nav__item--nested">
2868 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_3" >
2871 <label class=
"md-nav__link" for=
"__nav_6_3" id=
"__nav_6_3_label" tabindex=
"0">
2874 <span class=
"md-ellipsis">
2875 From WoltLab Suite
5.4
2879 <span class=
"md-nav__icon md-icon"></span>
2882 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_3_label" aria-expanded=
"false">
2883 <label class=
"md-nav__title" for=
"__nav_6_3">
2884 <span class=
"md-nav__icon md-icon"></span>
2885 From WoltLab Suite
5.4
2887 <ul class=
"md-nav__list" data-md-scrollfix
>
2894 <li class=
"md-nav__item">
2895 <a href=
"../../migration/wsc54/php/" class=
"md-nav__link">
2898 <span class=
"md-ellipsis">
2914 <li class=
"md-nav__item">
2915 <a href=
"../../migration/wsc54/javascript/" class=
"md-nav__link">
2918 <span class=
"md-ellipsis">
2919 TypeScript and JavaScript
2934 <li class=
"md-nav__item">
2935 <a href=
"../../migration/wsc54/templates/" class=
"md-nav__link">
2938 <span class=
"md-ellipsis">
2954 <li class=
"md-nav__item">
2955 <a href=
"../../migration/wsc54/libraries/" class=
"md-nav__link">
2958 <span class=
"md-ellipsis">
2959 Third Party Libraries
2974 <li class=
"md-nav__item">
2975 <a href=
"../../migration/wsc54/deprecations_removals/" class=
"md-nav__link">
2978 <span class=
"md-ellipsis">
2979 Deprecations and Removals
3007 <li class=
"md-nav__item md-nav__item--nested">
3012 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_4" >
3015 <label class=
"md-nav__link" for=
"__nav_6_4" id=
"__nav_6_4_label" tabindex=
"0">
3018 <span class=
"md-ellipsis">
3019 From WoltLab Suite
5.3
3023 <span class=
"md-nav__icon md-icon"></span>
3026 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_4_label" aria-expanded=
"false">
3027 <label class=
"md-nav__title" for=
"__nav_6_4">
3028 <span class=
"md-nav__icon md-icon"></span>
3029 From WoltLab Suite
5.3
3031 <ul class=
"md-nav__list" data-md-scrollfix
>
3038 <li class=
"md-nav__item">
3039 <a href=
"../../migration/wsc53/php/" class=
"md-nav__link">
3042 <span class=
"md-ellipsis">
3058 <li class=
"md-nav__item">
3059 <a href=
"../../migration/wsc53/session/" class=
"md-nav__link">
3062 <span class=
"md-ellipsis">
3063 Session Handling and Authentication
3078 <li class=
"md-nav__item">
3079 <a href=
"../../migration/wsc53/javascript/" class=
"md-nav__link">
3082 <span class=
"md-ellipsis">
3083 TypeScript and JavaScript
3098 <li class=
"md-nav__item">
3099 <a href=
"../../migration/wsc53/templates/" class=
"md-nav__link">
3102 <span class=
"md-ellipsis">
3118 <li class=
"md-nav__item">
3119 <a href=
"../../migration/wsc53/libraries/" class=
"md-nav__link">
3122 <span class=
"md-ellipsis">
3123 Third Party Libraries
3151 <li class=
"md-nav__item md-nav__item--nested">
3156 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_5" >
3159 <label class=
"md-nav__link" for=
"__nav_6_5" id=
"__nav_6_5_label" tabindex=
"0">
3162 <span class=
"md-ellipsis">
3163 From WoltLab Suite
5.2
3167 <span class=
"md-nav__icon md-icon"></span>
3170 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_5_label" aria-expanded=
"false">
3171 <label class=
"md-nav__title" for=
"__nav_6_5">
3172 <span class=
"md-nav__icon md-icon"></span>
3173 From WoltLab Suite
5.2
3175 <ul class=
"md-nav__list" data-md-scrollfix
>
3182 <li class=
"md-nav__item">
3183 <a href=
"../../migration/wsc52/php/" class=
"md-nav__link">
3186 <span class=
"md-ellipsis">
3202 <li class=
"md-nav__item">
3203 <a href=
"../../migration/wsc52/templates/" class=
"md-nav__link">
3206 <span class=
"md-ellipsis">
3207 Templates and Languages
3222 <li class=
"md-nav__item">
3223 <a href=
"../../migration/wsc52/libraries/" class=
"md-nav__link">
3226 <span class=
"md-ellipsis">
3227 Third Party Libraries
3255 <li class=
"md-nav__item md-nav__item--nested">
3260 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_6" >
3263 <label class=
"md-nav__link" for=
"__nav_6_6" id=
"__nav_6_6_label" tabindex=
"0">
3266 <span class=
"md-ellipsis">
3267 From WoltLab Suite
3.1
3271 <span class=
"md-nav__icon md-icon"></span>
3274 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_6_label" aria-expanded=
"false">
3275 <label class=
"md-nav__title" for=
"__nav_6_6">
3276 <span class=
"md-nav__icon md-icon"></span>
3277 From WoltLab Suite
3.1
3279 <ul class=
"md-nav__list" data-md-scrollfix
>
3286 <li class=
"md-nav__item">
3287 <a href=
"../../migration/wsc31/php/" class=
"md-nav__link">
3290 <span class=
"md-ellipsis">
3319 <li class=
"md-nav__item md-nav__item--nested">
3324 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_7" >
3327 <label class=
"md-nav__link" for=
"__nav_6_7" id=
"__nav_6_7_label" tabindex=
"0">
3330 <span class=
"md-ellipsis">
3331 From WoltLab Suite
3.0
3335 <span class=
"md-nav__icon md-icon"></span>
3338 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_7_label" aria-expanded=
"false">
3339 <label class=
"md-nav__title" for=
"__nav_6_7">
3340 <span class=
"md-nav__icon md-icon"></span>
3341 From WoltLab Suite
3.0
3343 <ul class=
"md-nav__list" data-md-scrollfix
>
3350 <li class=
"md-nav__item">
3351 <a href=
"../../migration/wsc30/php/" class=
"md-nav__link">
3354 <span class=
"md-ellipsis">
3370 <li class=
"md-nav__item">
3371 <a href=
"../../migration/wsc30/javascript/" class=
"md-nav__link">
3374 <span class=
"md-ellipsis">
3390 <li class=
"md-nav__item">
3391 <a href=
"../../migration/wsc30/templates/" class=
"md-nav__link">
3394 <span class=
"md-ellipsis">
3410 <li class=
"md-nav__item">
3411 <a href=
"../../migration/wsc30/css/" class=
"md-nav__link">
3414 <span class=
"md-ellipsis">
3430 <li class=
"md-nav__item">
3431 <a href=
"../../migration/wsc30/package/" class=
"md-nav__link">
3434 <span class=
"md-ellipsis">
3463 <li class=
"md-nav__item md-nav__item--nested">
3468 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_6_8" >
3471 <label class=
"md-nav__link" for=
"__nav_6_8" id=
"__nav_6_8_label" tabindex=
"0">
3474 <span class=
"md-ellipsis">
3479 <span class=
"md-nav__icon md-icon"></span>
3482 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_6_8_label" aria-expanded=
"false">
3483 <label class=
"md-nav__title" for=
"__nav_6_8">
3484 <span class=
"md-nav__icon md-icon"></span>
3487 <ul class=
"md-nav__list" data-md-scrollfix
>
3494 <li class=
"md-nav__item">
3495 <a href=
"../../migration/wcf21/php/" class=
"md-nav__link">
3498 <span class=
"md-ellipsis">
3514 <li class=
"md-nav__item">
3515 <a href=
"../../migration/wcf21/templates/" class=
"md-nav__link">
3518 <span class=
"md-ellipsis">
3534 <li class=
"md-nav__item">
3535 <a href=
"../../migration/wcf21/css/" class=
"md-nav__link">
3538 <span class=
"md-ellipsis">
3554 <li class=
"md-nav__item">
3555 <a href=
"../../migration/wcf21/package/" class=
"md-nav__link">
3558 <span class=
"md-ellipsis">
3594 <li class=
"md-nav__item md-nav__item--nested">
3599 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_7" >
3602 <label class=
"md-nav__link" for=
"__nav_7" id=
"__nav_7_label" tabindex=
"0">
3605 <span class=
"md-ellipsis">
3610 <span class=
"md-nav__icon md-icon"></span>
3613 <nav class=
"md-nav" data-md-level=
"1" aria-labelledby=
"__nav_7_label" aria-expanded=
"false">
3614 <label class=
"md-nav__title" for=
"__nav_7">
3615 <span class=
"md-nav__icon md-icon"></span>
3618 <ul class=
"md-nav__list" data-md-scrollfix
>
3630 <li class=
"md-nav__item md-nav__item--nested">
3635 <input class=
"md-nav__toggle md-toggle " type=
"checkbox" id=
"__nav_7_1" >
3638 <label class=
"md-nav__link" for=
"__nav_7_1" id=
"__nav_7_1_label" tabindex=
"0">
3641 <span class=
"md-ellipsis">
3646 <span class=
"md-nav__icon md-icon"></span>
3649 <nav class=
"md-nav" data-md-level=
"2" aria-labelledby=
"__nav_7_1_label" aria-expanded=
"false">
3650 <label class=
"md-nav__title" for=
"__nav_7_1">
3651 <span class=
"md-nav__icon md-icon"></span>
3654 <ul class=
"md-nav__list" data-md-scrollfix
>
3661 <li class=
"md-nav__item">
3662 <a href=
"../../tutorial/series/overview/" class=
"md-nav__link">
3665 <span class=
"md-ellipsis">
3681 <li class=
"md-nav__item">
3682 <a href=
"../../tutorial/series/part_1/" class=
"md-nav__link">
3685 <span class=
"md-ellipsis">
3701 <li class=
"md-nav__item">
3702 <a href=
"../../tutorial/series/part_2/" class=
"md-nav__link">
3705 <span class=
"md-ellipsis">
3721 <li class=
"md-nav__item">
3722 <a href=
"../../tutorial/series/part_3/" class=
"md-nav__link">
3725 <span class=
"md-ellipsis">
3741 <li class=
"md-nav__item">
3742 <a href=
"../../tutorial/series/part_4/" class=
"md-nav__link">
3745 <span class=
"md-ellipsis">
3761 <li class=
"md-nav__item">
3762 <a href=
"../../tutorial/series/part_5/" class=
"md-nav__link">
3765 <span class=
"md-ellipsis">
3781 <li class=
"md-nav__item">
3782 <a href=
"../../tutorial/series/part_6/" class=
"md-nav__link">
3785 <span class=
"md-ellipsis">
3819 <div class=
"md-sidebar md-sidebar--secondary" data-md-component=
"sidebar" data-md-type=
"toc" >
3820 <div class=
"md-sidebar__scrollwrap">
3821 <div class=
"md-sidebar__inner">
3824 <nav class=
"md-nav md-nav--secondary" aria-label=
"Table of contents">
3831 <label class=
"md-nav__title" for=
"__toc">
3832 <span class=
"md-nav__icon md-icon"></span>
3835 <ul class=
"md-nav__list" data-md-component=
"toc" data-md-scrollfix
>
3837 <li class=
"md-nav__item">
3838 <a href=
"#template-types-and-conventions" class=
"md-nav__link">
3839 Template Types and Conventions
3844 <li class=
"md-nav__item">
3845 <a href=
"#installing-templates" class=
"md-nav__link">
3846 Installing Templates
3851 <li class=
"md-nav__item">
3852 <a href=
"#base-templates" class=
"md-nav__link">
3856 <nav class=
"md-nav" aria-label=
"Base Templates">
3857 <ul class=
"md-nav__list">
3859 <li class=
"md-nav__item">
3860 <a href=
"#frontend" class=
"md-nav__link">
3866 <li class=
"md-nav__item">
3867 <a href=
"#backend" class=
"md-nav__link">
3878 <li class=
"md-nav__item">
3879 <a href=
"#common-template-components" class=
"md-nav__link">
3880 Common Template Components
3883 <nav class=
"md-nav" aria-label=
"Common Template Components">
3884 <ul class=
"md-nav__list">
3886 <li class=
"md-nav__item">
3887 <a href=
"#forms" class=
"md-nav__link">
3893 <li class=
"md-nav__item">
3894 <a href=
"#tab-menus" class=
"md-nav__link">
3905 <li class=
"md-nav__item">
3906 <a href=
"#template-scripting" class=
"md-nav__link">
3910 <nav class=
"md-nav" aria-label=
"Template Scripting">
3911 <ul class=
"md-nav__list">
3913 <li class=
"md-nav__item">
3914 <a href=
"#template-variables" class=
"md-nav__link">
3918 <nav class=
"md-nav" aria-label=
"Template Variables">
3919 <ul class=
"md-nav__list">
3921 <li class=
"md-nav__item">
3922 <a href=
"#modifiers" class=
"md-nav__link">
3928 <li class=
"md-nav__item">
3929 <a href=
"#system-template-variable" class=
"md-nav__link">
3930 System Template Variable
3940 <li class=
"md-nav__item">
3941 <a href=
"#comments" class=
"md-nav__link">
3947 <li class=
"md-nav__item">
3948 <a href=
"#conditions" class=
"md-nav__link">
3954 <li class=
"md-nav__item">
3955 <a href=
"#foreach-loops" class=
"md-nav__link">
3961 <li class=
"md-nav__item">
3962 <a href=
"#including-other-templates" class=
"md-nav__link">
3963 Including Other Templates
3968 <li class=
"md-nav__item">
3969 <a href=
"#template-plugins" class=
"md-nav__link">
3989 <div class=
"md-content" data-md-component=
"content">
3990 <article class=
"md-content__inner md-typeset">
3998 <h1 id=
"templates">Templates
<a class=
"headerlink" href=
"#templates" title=
"Permanent link">#
</a></h1>
3999 <p>Templates are responsible for the output a user sees when requesting a page (while the PHP code is responsible for providing the data that will be shown).
4000 Templates are text files with
<code>.tpl
</code> as the file extension.
4001 WoltLab Suite Core compiles the template files once into a PHP file that is executed when a user requests the page.
4002 In subsequent request, as the PHP file containing the compiled template already exists, compiling the template is not necessary anymore.
</p>
4003 <h2 id=
"template-types-and-conventions">Template Types and Conventions
<a class=
"headerlink" href=
"#template-types-and-conventions" title=
"Permanent link">#
</a></h2>
4004 <p>WoltLab Suite Core supports two types of templates:
4005 frontend templates (or simply
<em>templates
</em>) and backend templates (
<em>ACP templates
</em>).
4006 Each type of template is only available in its respective domain, thus frontend templates cannot be included or used in the ACP and vice versa.
</p>
4007 <p>For pages and forms, the name of the template matches the unqualified name of the PHP class except for the
<code>Page
</code> or
<code>Form
</code> suffix:
</p>
4009 <li><code>RegisterForm.class.php
</code> →
<code>register.tpl
</code></li>
4010 <li><code>UserPage.class.php
</code> →
<code>user.tpl
</code></li>
4012 <p>If you follow this convention, WoltLab Suite Core will automatically determine the template name so that you do not have to explicitly set it.
</p>
4013 <div class=
"admonition info">
4014 <p class=
"admonition-title">For forms that handle creating and editing objects, in general, there are two form classes:
<code>FooAddForm
</code> and
<code>FooEditForm
</code>. WoltLab Suite Core, however, generally only uses one template
<code>fooAdd.tpl
</code> and the template variable
<code>$action
</code> to distinguish between creating a new object (
<code>$action = 'add'
</code>) and editing an existing object (
<code>$action = 'edit'
</code>) as the differences between templates for adding and editing an object are minimal.
</p>
4016 <h2 id=
"installing-templates">Installing Templates
<a class=
"headerlink" href=
"#installing-templates" title=
"Permanent link">#
</a></h2>
4017 <p>Templates and ACP templates are installed by two different package installation plugins:
4018 the
<a href=
"../../package/pip/template/">template PIP
</a> and the
<a href=
"../../package/pip/acp-template/">ACP template PIP
</a>.
4019 More information about installing templates can be found on those pages.
</p>
4020 <h2 id=
"base-templates">Base Templates
<a class=
"headerlink" href=
"#base-templates" title=
"Permanent link">#
</a></h2>
4021 <h3 id=
"frontend">Frontend
<a class=
"headerlink" href=
"#frontend" title=
"Permanent link">#
</a></h3>
4022 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span>
4023 <span class=
"normal">2</span>
4024 <span class=
"normal">3</span>
4025 <span class=
"normal">4</span>
4026 <span class=
"normal">5</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">include
</span> <span class=
"na">file
</span><span class=
"o">=
</span><span class=
"s1">'header
'</span><span class=
"cp">}
</span>
4028 <span class=
"cp">{
</span><span class=
"c">* content *
</span><span class=
"cp">}
</span>
4030 <span class=
"cp">{
</span><span class=
"nf">include
</span> <span class=
"na">file
</span><span class=
"o">=
</span><span class=
"s1">'footer
'</span><span class=
"cp">}
</span>
4031 </code></pre></div></td></tr></table></div>
4032 <h3 id=
"backend">Backend
<a class=
"headerlink" href=
"#backend" title=
"Permanent link">#
</a></h3>
4033 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal"> 1</span>
4034 <span class=
"normal"> 2</span>
4035 <span class=
"normal"> 3</span>
4036 <span class=
"normal"> 4</span>
4037 <span class=
"normal"> 5</span>
4038 <span class=
"normal"> 6</span>
4039 <span class=
"normal"> 7</span>
4040 <span class=
"normal"> 8</span>
4041 <span class=
"normal"> 9</span>
4042 <span class=
"normal">10</span>
4043 <span class=
"normal">11</span>
4044 <span class=
"normal">12</span>
4045 <span class=
"normal">13</span>
4046 <span class=
"normal">14</span>
4047 <span class=
"normal">15</span>
4048 <span class=
"normal">16</span>
4049 <span class=
"normal">17</span>
4050 <span class=
"normal">18</span>
4051 <span class=
"normal">19</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">include
</span> <span class=
"na">file
</span><span class=
"o">=
</span><span class=
"s1">'header
'</span> <span class=
"na">pageTitle
</span><span class=
"o">=
</span><span class=
"s1">'foo.bar.baz
'</span><span class=
"cp">}
</span>
4053 <span class=
"x"><header class=
"contentHeader
"></span>
4054 <span class=
"x"> <div class=
"contentHeaderTitle
"></span>
4055 <span class=
"x"> <h1 class=
"contentTitle
">Title
</h1
></span>
4056 <span class=
"x"> </div
></span>
4058 <span class=
"x"> <nav class=
"contentHeaderNavigation
"></span>
4059 <span class=
"x"> <ul
></span>
4060 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"c">* your default content header navigation buttons *
</span><span class=
"cp">}
</span>
4062 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">event
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"s1">'contentHeaderNavigation
'</span><span class=
"cp">}
</span>
4063 <span class=
"x"> </ul
></span>
4064 <span class=
"x"> </nav
></span>
4065 <span class=
"x"></header
></span>
4067 <span class=
"cp">{
</span><span class=
"c">* content *
</span><span class=
"cp">}
</span>
4069 <span class=
"cp">{
</span><span class=
"nf">include
</span> <span class=
"na">file
</span><span class=
"o">=
</span><span class=
"s1">'footer
'</span><span class=
"cp">}
</span>
4070 </code></pre></div></td></tr></table></div>
4071 <p><code>foo.bar.baz
</code> is the language item that contains the title of the page.
</p>
4072 <h2 id=
"common-template-components">Common Template Components
<a class=
"headerlink" href=
"#common-template-components" title=
"Permanent link">#
</a></h2>
4073 <h3 id=
"forms">Forms
<a class=
"headerlink" href=
"#forms" title=
"Permanent link">#
</a></h3>
4074 <div class=
"admonition info">
4075 <p class=
"admonition-title">For new forms, use the
<a href=
"../../php/api/form_builder/overview/">form builder API
</a>.
</p>
4077 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal"> 1</span>
4078 <span class=
"normal"> 2</span>
4079 <span class=
"normal"> 3</span>
4080 <span class=
"normal"> 4</span>
4081 <span class=
"normal"> 5</span>
4082 <span class=
"normal"> 6</span>
4083 <span class=
"normal"> 7</span>
4084 <span class=
"normal"> 8</span>
4085 <span class=
"normal"> 9</span>
4086 <span class=
"normal">10</span>
4087 <span class=
"normal">11</span>
4088 <span class=
"normal">12</span>
4089 <span class=
"normal">13</span>
4090 <span class=
"normal">14</span>
4091 <span class=
"normal">15</span>
4092 <span class=
"normal">16</span>
4093 <span class=
"normal">17</span>
4094 <span class=
"normal">18</span>
4095 <span class=
"normal">19</span>
4096 <span class=
"normal">20</span>
4097 <span class=
"normal">21</span>
4098 <span class=
"normal">22</span>
4099 <span class=
"normal">23</span>
4100 <span class=
"normal">24</span>
4101 <span class=
"normal">25</span>
4102 <span class=
"normal">26</span>
4103 <span class=
"normal">27</span>
4104 <span class=
"normal">28</span>
4105 <span class=
"normal">29</span>
4106 <span class=
"normal">30</span>
4107 <span class=
"normal">31</span>
4108 <span class=
"normal">32</span>
4109 <span class=
"normal">33</span>
4110 <span class=
"normal">34</span>
4111 <span class=
"normal">35</span>
4112 <span class=
"normal">36</span>
4113 <span class=
"normal">37</span>
4114 <span class=
"normal">38</span>
4115 <span class=
"normal">39</span>
4116 <span class=
"normal">40</span>
4117 <span class=
"normal">41</span>
4118 <span class=
"normal">42</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"x"><form method=
"post
" action=
"</span><span class=
"cp">{
</span><span class=
"nf">link
</span> <span class=
"na">controller
</span><span class=
"o">=
</span><span class=
"s1">'FooBar
'</span><span class=
"cp">}{
</span><span class=
"nf">/link
</span><span class=
"cp">}
</span><span class=
"x">"></span>
4119 <span class=
"x"> <div class=
"section
"></span>
4120 <span class=
"x"> <dl
</span><span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$errorField
</span> <span class=
"o">==
</span> <span class=
"s1">'baz
'</span><span class=
"cp">}
</span><span class=
"x"> class=
"formError
"</span><span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span><span class=
"x">></span>
4121 <span class=
"x"> <dt
><label for=
"baz
"></span><span class=
"cp">{
</span><span class=
"nf">lang
</span><span class=
"cp">}
</span><span class=
"x">foo.bar.baz
</span><span class=
"cp">{
</span><span class=
"nf">/lang
</span><span class=
"cp">}
</span><span class=
"x"></label
></dt
></span>
4122 <span class=
"x"> <dd
></span>
4123 <span class=
"x"> <input type=
"text
" id=
"baz
" name=
"baz
" value=
"</span><span class=
"cp">{
</span><span class=
"nv">$baz
</span><span class=
"cp">}
</span><span class=
"x">" class=
"long
" required autofocus
></span>
4124 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$errorField
</span> <span class=
"o">==
</span> <span class=
"s1">'baz
'</span><span class=
"cp">}
</span>
4125 <span class=
"x"> <small class=
"innerError
"></span>
4126 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$errorType
</span> <span class=
"o">==
</span> <span class=
"s1">'empty
'</span><span class=
"cp">}
</span>
4127 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">lang
</span><span class=
"cp">}
</span><span class=
"x">wcf.global.form.error.empty
</span><span class=
"cp">{
</span><span class=
"nf">/lang
</span><span class=
"cp">}
</span>
4128 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">else
</span><span class=
"cp">}
</span>
4129 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">lang
</span><span class=
"cp">}
</span><span class=
"x">foo.bar.baz.error.
</span><span class=
"cp">{
</span><span class=
"o">@
</span><span class=
"nv">$errorType
</span><span class=
"cp">}{
</span><span class=
"nf">/lang
</span><span class=
"cp">}
</span>
4130 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span>
4131 <span class=
"x"> </small
></span>
4132 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span>
4133 <span class=
"x"> </dd
></span>
4134 <span class=
"x"> </dl
></span>
4136 <span class=
"x"> <dl
></span>
4137 <span class=
"x"> <dt
><label for=
"bar
"></span><span class=
"cp">{
</span><span class=
"nf">lang
</span><span class=
"cp">}
</span><span class=
"x">foo.bar.bar
</span><span class=
"cp">{
</span><span class=
"nf">/lang
</span><span class=
"cp">}
</span><span class=
"x"></label
></dt
></span>
4138 <span class=
"x"> <dd
></span>
4139 <span class=
"x"> <textarea name=
"bar
" id=
"bar
" cols=
"40" rows=
"10"></span><span class=
"cp">{
</span><span class=
"nv">$bar
</span><span class=
"cp">}
</span><span class=
"x"></textarea
></span>
4140 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$errorField
</span> <span class=
"o">==
</span> <span class=
"s1">'bar
'</span><span class=
"cp">}
</span>
4141 <span class=
"x"> <small class=
"innerError
"></span><span class=
"cp">{
</span><span class=
"nf">lang
</span><span class=
"cp">}
</span><span class=
"x">foo.bar.bar.error.
</span><span class=
"cp">{
</span><span class=
"o">@
</span><span class=
"nv">$errorType
</span><span class=
"cp">}{
</span><span class=
"nf">/lang
</span><span class=
"cp">}
</span><span class=
"x"></small
></span>
4142 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span>
4143 <span class=
"x"> </dd
></span>
4144 <span class=
"x"> </dl
></span>
4146 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"c">* other fields *
</span><span class=
"cp">}
</span>
4148 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">event
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"s1">'dataFields
'</span><span class=
"cp">}
</span>
4149 <span class=
"x"> </div
></span>
4151 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"c">* other sections *
</span><span class=
"cp">}
</span>
4153 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">event
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"s1">'sections
'</span><span class=
"cp">}
</span>
4155 <span class=
"x"> <div class=
"formSubmit
"></span>
4156 <span class=
"x"> <input type=
"submit
" value=
"</span><span class=
"cp">{
</span><span class=
"nf">lang
</span><span class=
"cp">}
</span><span class=
"x">wcf.global.button.submit
</span><span class=
"cp">{
</span><span class=
"nf">/lang
</span><span class=
"cp">}
</span><span class=
"x">" accesskey=
"s
"></span>
4157 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">csrfToken
</span><span class=
"cp">}
</span>
4158 <span class=
"x"> </div
></span>
4159 <span class=
"x"></form
></span>
4160 </code></pre></div></td></tr></table></div>
4161 <h3 id=
"tab-menus">Tab Menus
<a class=
"headerlink" href=
"#tab-menus" title=
"Permanent link">#
</a></h3>
4162 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal"> 1</span>
4163 <span class=
"normal"> 2</span>
4164 <span class=
"normal"> 3</span>
4165 <span class=
"normal"> 4</span>
4166 <span class=
"normal"> 5</span>
4167 <span class=
"normal"> 6</span>
4168 <span class=
"normal"> 7</span>
4169 <span class=
"normal"> 8</span>
4170 <span class=
"normal"> 9</span>
4171 <span class=
"normal">10</span>
4172 <span class=
"normal">11</span>
4173 <span class=
"normal">12</span>
4174 <span class=
"normal">13</span>
4175 <span class=
"normal">14</span>
4176 <span class=
"normal">15</span>
4177 <span class=
"normal">16</span>
4178 <span class=
"normal">17</span>
4179 <span class=
"normal">18</span>
4180 <span class=
"normal">19</span>
4181 <span class=
"normal">20</span>
4182 <span class=
"normal">21</span>
4183 <span class=
"normal">22</span>
4184 <span class=
"normal">23</span>
4185 <span class=
"normal">24</span>
4186 <span class=
"normal">25</span>
4187 <span class=
"normal">26</span>
4188 <span class=
"normal">27</span>
4189 <span class=
"normal">28</span>
4190 <span class=
"normal">29</span>
4191 <span class=
"normal">30</span>
4192 <span class=
"normal">31</span>
4193 <span class=
"normal">32</span>
4194 <span class=
"normal">33</span>
4195 <span class=
"normal">34</span>
4196 <span class=
"normal">35</span>
4197 <span class=
"normal">36</span>
4198 <span class=
"normal">37</span>
4199 <span class=
"normal">38</span>
4200 <span class=
"normal">39</span>
4201 <span class=
"normal">40</span>
4202 <span class=
"normal">41</span>
4203 <span class=
"normal">42</span>
4204 <span class=
"normal">43</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"x"><div class=
"section tabMenuContainer
"></span>
4205 <span class=
"x"> <nav class=
"tabMenu
"></span>
4206 <span class=
"x"> <ul
></span>
4207 <span class=
"x"> <li
><a href=
"#tab1
">Tab
1</a
></li
></span>
4208 <span class=
"x"> <li
><a href=
"#tab2
">Tab
2</a
></li
></span>
4210 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">event
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"s1">'tabMenuTabs
'</span><span class=
"cp">}
</span>
4211 <span class=
"x"> </ul
></span>
4212 <span class=
"x"> </nav
></span>
4214 <span class=
"x"> <div id=
"tab1
" class=
"tabMenuContent
"></span>
4215 <span class=
"x"> <div class=
"section
"></span>
4216 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"c">* contents of first tab *
</span><span class=
"cp">}
</span>
4217 <span class=
"x"> </div
></span>
4218 <span class=
"x"> </div
></span>
4220 <span class=
"x"> <div id=
"tab2
" class=
"tabMenuContainer tabMenuContent
"></span>
4221 <span class=
"x"> <nav class=
"menu
"></span>
4222 <span class=
"x"> <ul
></span>
4223 <span class=
"x"> <li
><a href=
"#tab2A
">Tab
2A
</a
></li
></span>
4224 <span class=
"x"> <li
><a href=
"#tab2B
">Tab
2B
</a
></li
></span>
4226 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">event
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"s1">'tabMenuTab2Subtabs
'</span><span class=
"cp">}
</span>
4227 <span class=
"x"> </ul
></span>
4228 <span class=
"x"> </nav
></span>
4230 <span class=
"x"> <div id=
"tab2A
" class=
"tabMenuContent
"></span>
4231 <span class=
"x"> <div class=
"section
"></span>
4232 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"c">* contents of first subtab for second tab *
</span><span class=
"cp">}
</span>
4233 <span class=
"x"> </div
></span>
4234 <span class=
"x"> </div
></span>
4236 <span class=
"x"> <div id=
"tab2B
" class=
"tabMenuContent
"></span>
4237 <span class=
"x"> <div class=
"section
"></span>
4238 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"c">* contents of second subtab for second tab *
</span><span class=
"cp">}
</span>
4239 <span class=
"x"> </div
></span>
4240 <span class=
"x"> </div
></span>
4242 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">event
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"s1">'tabMenuTab2Contents
'</span><span class=
"cp">}
</span>
4243 <span class=
"x"> </div
></span>
4245 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">event
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"s1">'tabMenuContents
'</span><span class=
"cp">}
</span>
4246 <span class=
"x"></div
></span>
4247 </code></pre></div></td></tr></table></div>
4248 <h2 id=
"template-scripting">Template Scripting
<a class=
"headerlink" href=
"#template-scripting" title=
"Permanent link">#
</a></h2>
4249 <h3 id=
"template-variables">Template Variables
<a class=
"headerlink" href=
"#template-variables" title=
"Permanent link">#
</a></h3>
4250 <p>Template variables can be assigned via
<code>WCF::getTPL()-
>assign('foo', 'bar')
</code> and accessed in templates via
<code>$foo
</code>:
</p>
4252 <li><code>{$foo}
</code> will result in the contents of
<code>$foo
</code> to be passed to
<code>StringUtil::encodeHTML()
</code> before being printed.
</li>
4253 <li><code>{#$foo}
</code> will result in the contents of
<code>$foo
</code> to be passed to
<code>StringUtil::formatNumeric()
</code> before being printed.
4254 Thus, this method is relevant when printing numbers and having them formatted correctly according the the user’s language.
</li>
4255 <li><code>{@$foo}
</code> will result in the contents of
<code>$foo
</code> to be printed directly.
4256 In general, this method should not be used for user-generated input.
</li>
4258 <p>Multiple template variables can be assigned by passing an array:
</p>
4259 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span>
4260 <span class=
"normal">2</span>
4261 <span class=
"normal">3</span>
4262 <span class=
"normal">4</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"nx">WCF
</span><span class=
"o">::
</span><span class=
"na">getTPL
</span><span class=
"p">()
</span><span class=
"o">-
></span><span class=
"na">assign
</span><span class=
"p">([
</span>
4263 <span class=
"s1">'foo
'</span> <span class=
"o">=
></span> <span class=
"s1">'bar
'</span><span class=
"p">,
</span>
4264 <span class=
"s1">'baz
'</span> <span class=
"o">=
></span> <span class=
"k">false
</span>
4265 <span class=
"p">]);
</span>
4266 </code></pre></div></td></tr></table></div>
4267 <h4 id=
"modifiers">Modifiers
<a class=
"headerlink" href=
"#modifiers" title=
"Permanent link">#
</a></h4>
4268 <p>Variable modifiers are used to modify the output of variables within templates.
4269 These modifiers allow you to perform various operations on the variables before displaying them.
4270 The general syntax for applying a variable modifier is
<code>{$variable|modifier}
</code>.
</p>
4271 <p>Modifiers can be chained together to perform multiple operations on a variable. In such cases, the modifiers are applied from left to right. For example:
4272 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nv">$variable
</span><span class=
"o">|
</span><span class=
"na">modifier1
</span><span class=
"o">|
</span><span class=
"na">modifier2
</span><span class=
"o">|
</span><span class=
"na">modifier3
</span><span class=
"cp">}
</span>
4273 </code></pre></div></td></tr></table></div></p>
4274 <p>A modifier may accept additional parameters that affect its behavior. These parameters follow the modifier name and are separated by a
<code>:
</code>. For example:
4275 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nv">$variable
</span><span class=
"o">|
</span><span class=
"na">modifier
</span><span class=
"o">:
</span><span class=
"s1">'param1
'</span><span class=
"o">:
</span><span class=
"s1">'param2
'</span><span class=
"cp">}
</span>
4276 </code></pre></div></td></tr></table></div></p>
4277 <p>An
<a href=
"../template-modifiers/">overview of all available modifiers
</a> is available on a
<a href=
"../template-modifiers/">dedicated page
</a>.
</p>
4278 <h4 id=
"system-template-variable">System Template Variable
<a class=
"headerlink" href=
"#system-template-variable" title=
"Permanent link">#
</a></h4>
4280 <li><code>$__wcf
</code> contains the
<code>WCF
</code> object (or
<code>WCFACP
</code> object in the backend).
</li>
4282 <h3 id=
"comments">Comments
<a class=
"headerlink" href=
"#comments" title=
"Permanent link">#
</a></h3>
4283 <p>Comments are wrapped in
<code>{*
</code> and
<code>*}
</code> and can span multiple lines:
</p>
4284 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span>
4285 <span class=
"normal">2</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"c">* some
</span>
4286 <span class=
"c"> comment *
</span><span class=
"cp">}
</span>
4287 </code></pre></div></td></tr></table></div>
4288 <div class=
"admonition info">
4289 <p class=
"admonition-title">The template compiler discards the comments, so that they not included in the compiled template.
</p>
4291 <h3 id=
"conditions">Conditions
<a class=
"headerlink" href=
"#conditions" title=
"Permanent link">#
</a></h3>
4292 <p>Conditions follow a similar syntax to PHP code:
</p>
4293 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span>
4294 <span class=
"normal">2</span>
4295 <span class=
"normal">3</span>
4296 <span class=
"normal">4</span>
4297 <span class=
"normal">5</span>
4298 <span class=
"normal">6</span>
4299 <span class=
"normal">7</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$foo
</span> <span class=
"o">===
</span> <span class=
"s1">'bar
'</span><span class=
"cp">}
</span>
4300 <span class=
"x"> foo is bar
</span>
4301 <span class=
"cp">{
</span><span class=
"nf">elseif
</span> <span class=
"nv">$foo
</span> <span class=
"o">===
</span> <span class=
"s1">'baz
'</span><span class=
"cp">}
</span>
4302 <span class=
"x"> foo is baz
</span>
4303 <span class=
"cp">{
</span><span class=
"nf">else
</span><span class=
"cp">}
</span>
4304 <span class=
"x"> foo is neither bar nor baz
</span>
4305 <span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span>
4306 </code></pre></div></td></tr></table></div>
4307 <p>The supported operators in conditions are
<code>===
</code>,
<code>!==
</code>,
<code>==
</code>,
<code>!=
</code>,
<code><=
</code>,
<code><</code>,
<code>>=
</code>,
<code>></code>,
<code>||
</code>,
<code>&&</code>,
<code>!
</code>, and
<code>=
</code>.
</p>
4308 <p>More examples:
</p>
4309 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span>
4310 <span class=
"normal">2</span>
4311 <span class=
"normal">3</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$bar
</span><span class=
"o">|
</span><span class=
"na">isset
</span><span class=
"cp">}
</span><span class=
"x">…
</span><span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span>
4313 <span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$bar
</span><span class=
"o">|
</span><span class=
"na">count
</span> <span class=
"o">></span> <span class=
"m">3</span> <span class=
"o">&&</span> <span class=
"nv">$bar
</span><span class=
"o">|
</span><span class=
"na">count
</span> <span class=
"o"><</span> <span class=
"m">100</span><span class=
"cp">}
</span><span class=
"x">…
</span><span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span>
4314 </code></pre></div></td></tr></table></div>
4315 <h3 id=
"foreach-loops">Foreach Loops
<a class=
"headerlink" href=
"#foreach-loops" title=
"Permanent link">#
</a></h3>
4316 <p>Foreach loops allow to iterate over arrays or iterable objects:
</p>
4317 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span>
4318 <span class=
"normal">2</span>
4319 <span class=
"normal">3</span>
4320 <span class=
"normal">4</span>
4321 <span class=
"normal">5</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"x"><ul
></span>
4322 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">foreach
</span> <span class=
"na">from
</span><span class=
"o">=
</span><span class=
"nv">$array
</span> <span class=
"na">key
</span><span class=
"o">=
</span><span class=
"na">key
</span> <span class=
"na">item
</span><span class=
"o">=
</span><span class=
"na">value
</span><span class=
"cp">}
</span>
4323 <span class=
"x"> <li
></span><span class=
"cp">{
</span><span class=
"nv">$key
</span><span class=
"cp">}
</span><span class=
"x">:
</span><span class=
"cp">{
</span><span class=
"nv">$value
</span><span class=
"cp">}
</span><span class=
"x"></li
></span>
4324 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">/foreach
</span><span class=
"cp">}
</span>
4325 <span class=
"x"></ul
></span>
4326 </code></pre></div></td></tr></table></div>
4327 <p>While the
<code>from
</code> attribute containing the iterated structure and the
<code>item
</code> attribute containg the current value are mandatory, the
<code>key
</code> attribute is optional.
4328 If the foreach loop has a name assigned to it via the
<code>name
</code> attribute, the
<code>$tpl
</code> template variable provides additional data about the loop:
</p>
4329 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal"> 1</span>
4330 <span class=
"normal"> 2</span>
4331 <span class=
"normal"> 3</span>
4332 <span class=
"normal"> 4</span>
4333 <span class=
"normal"> 5</span>
4334 <span class=
"normal"> 6</span>
4335 <span class=
"normal"> 7</span>
4336 <span class=
"normal"> 8</span>
4337 <span class=
"normal"> 9</span>
4338 <span class=
"normal">10</span>
4339 <span class=
"normal">11</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"x"><ul
></span>
4340 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">foreach
</span> <span class=
"na">from
</span><span class=
"o">=
</span><span class=
"nv">$array
</span> <span class=
"na">key
</span><span class=
"o">=
</span><span class=
"na">key
</span> <span class=
"na">item
</span><span class=
"o">=
</span><span class=
"na">value
</span> <span class=
"na">name
</span><span class=
"o">=
</span><span class=
"na">foo
</span><span class=
"cp">}
</span>
4341 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">if
</span> <span class=
"nv">$tpl
</span><span class=
"o">[
</span><span class=
"na">foreach
</span><span class=
"o">][
</span><span class=
"na">foo
</span><span class=
"o">][
</span><span class=
"na">first
</span><span class=
"o">]
</span><span class=
"cp">}
</span>
4342 <span class=
"x"> something special for the first iteration
</span>
4343 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">elseif
</span> <span class=
"nv">$tpl
</span><span class=
"o">[
</span><span class=
"na">foreach
</span><span class=
"o">][
</span><span class=
"na">foo
</span><span class=
"o">][
</span><span class=
"na">last
</span><span class=
"o">]
</span><span class=
"cp">}
</span>
4344 <span class=
"x"> something special for the last iteration
</span>
4345 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">/if
</span><span class=
"cp">}
</span>
4347 <span class=
"x"> <li
>iteration
</span><span class=
"cp">{
</span><span class=
"err">#
</span><span class=
"nv">$tpl
</span><span class=
"o">[
</span><span class=
"na">foreach
</span><span class=
"o">][
</span><span class=
"na">foo
</span><span class=
"o">][
</span><span class=
"na">iteration
</span><span class=
"o">]+
</span><span class=
"m">1</span><span class=
"cp">}
</span><span class=
"x"> out of
</span><span class=
"cp">{
</span><span class=
"err">#
</span><span class=
"nv">$tpl
</span><span class=
"o">[
</span><span class=
"na">foreach
</span><span class=
"o">][
</span><span class=
"na">foo
</span><span class=
"o">][
</span><span class=
"na">total
</span><span class=
"o">]
</span><span class=
"cp">}
</span><span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nv">$key
</span><span class=
"cp">}
</span><span class=
"x">:
</span><span class=
"cp">{
</span><span class=
"nv">$value
</span><span class=
"cp">}
</span><span class=
"x"></li
></span>
4348 <span class=
"x"> </span><span class=
"cp">{
</span><span class=
"nf">/foreach
</span><span class=
"cp">}
</span>
4349 <span class=
"x"></ul
></span>
4350 </code></pre></div></td></tr></table></div>
4351 <p>In contrast to PHP’s foreach loop, templates also support
<code>foreachelse
</code>:
</p>
4352 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span>
4353 <span class=
"normal">2</span>
4354 <span class=
"normal">3</span>
4355 <span class=
"normal">4</span>
4356 <span class=
"normal">5</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">foreach
</span> <span class=
"na">from
</span><span class=
"o">=
</span><span class=
"nv">$array
</span> <span class=
"na">item
</span><span class=
"o">=
</span><span class=
"na">value
</span><span class=
"cp">}
</span>
4357 <span class=
"x"> …
</span>
4358 <span class=
"cp">{
</span><span class=
"nf">foreachelse
</span><span class=
"cp">}
</span>
4359 <span class=
"x"> there is nothing to iterate over
</span>
4360 <span class=
"cp">{
</span><span class=
"nf">/foreach
</span><span class=
"cp">}
</span>
4361 </code></pre></div></td></tr></table></div>
4362 <h3 id=
"including-other-templates">Including Other Templates
<a class=
"headerlink" href=
"#including-other-templates" title=
"Permanent link">#
</a></h3>
4363 <p>To include template named
<code>foo
</code> from the same domain (frontend/backend), you can use
</p>
4364 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">include
</span> <span class=
"na">file
</span><span class=
"o">=
</span><span class=
"s1">'foo
'</span><span class=
"cp">}
</span>
4365 </code></pre></div></td></tr></table></div>
4366 <p>If the template belongs to an application, you have to specify that application using the
<code>application
</code> attribute:
</p>
4367 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">include
</span> <span class=
"na">file
</span><span class=
"o">=
</span><span class=
"s1">'foo
'</span> <span class=
"na">application
</span><span class=
"o">=
</span><span class=
"s1">'app
'</span><span class=
"cp">}
</span>
4368 </code></pre></div></td></tr></table></div>
4369 <p>Additional template variables can be passed to the included template as additional attributes:
</p>
4370 <div class=
"highlight"><table class=
"highlighttable"><tr><td class=
"linenos"><div class=
"linenodiv"><pre><span></span><span class=
"normal">1</span></pre></div></td><td class=
"code"><div><pre><span></span><code><span class=
"cp">{
</span><span class=
"nf">include
</span> <span class=
"na">file
</span><span class=
"o">=
</span><span class=
"s1">'foo
'</span> <span class=
"na">application
</span><span class=
"o">=
</span><span class=
"s1">'app
'</span> <span class=
"na">var1
</span><span class=
"o">=
</span><span class=
"s1">'foo1
'</span> <span class=
"na">var2
</span><span class=
"o">=
</span><span class=
"s1">'foo2
'</span><span class=
"cp">}
</span>
4371 </code></pre></div></td></tr></table></div>
4372 <h3 id=
"template-plugins">Template Plugins
<a class=
"headerlink" href=
"#template-plugins" title=
"Permanent link">#
</a></h3>
4373 <p>An overview of all available template plugins can be found
<a href=
"../template-plugins/">here
</a>.
</p>
4376 <div class=
"md-source-file">
4398 <footer class=
"md-footer">
4400 <div class=
"md-footer-meta md-typeset">
4401 <div class=
"md-footer-meta__inner md-grid">
4402 <div class=
"md-copyright">
4404 <div class=
"md-copyright__highlight">
4405 Copyright ©
2020 WoltLab GmbH
4410 <a href=
"https://squidfunk.github.io/mkdocs-material/" target=
"_blank" rel=
"noopener">
4416 <div class=
"md-copyright">
4417 <a href=
"https://www.woltlab.com/legal-notice/">Legal Notice
</a>
4418 <a href=
"https://www.woltlab.com/privacy-policy/">Privacy Policy
</a>
4426 <div class=
"md-dialog" data-md-component=
"dialog">
4427 <div class=
"md-dialog__inner md-typeset"></div>
4430 <script id=
"__config" type=
"application/json">{
"base":
"../..",
"features": [
"navigation.tracking"],
"search":
"../../assets/javascripts/workers/search.a264c092.min.js",
"translations": {
"clipboard.copied":
"Copied to clipboard",
"clipboard.copy":
"Copy to clipboard",
"search.result.more.one":
"1 more on this page",
"search.result.more.other":
"# more on this page",
"search.result.none":
"No matching documents",
"search.result.one":
"1 matching document",
"search.result.other":
"# matching documents",
"search.result.placeholder":
"Type to start searching",
"search.result.term.missing":
"Missing",
"select.version":
"Select version"},
"version": {
"provider":
"mike"}}
</script>
4433 <script src=
"../../assets/javascripts/bundle.726fbb30.min.js"></script>