| <!doctype html> |
| <!-- Generated by FreeMarker/Docgen from DocBook --> |
| <html lang="en" class="page-type-section"> |
| <head prefix="og: http://ogp.me/ns#"> |
| <meta charset="utf-8"> |
| <title>Overall structure - FreeMarker Manual</title> |
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> |
| <meta name="viewport" content="width=device-width,initial-scale=1"> |
| <meta name="format-detection" content="telephone=no"> |
| <meta property="og:site_name" content="FreeMarker Manual"> |
| <meta property="og:title" content="Overall structure"> |
| <meta property="og:locale" content="en_US"> |
| <meta property="og:url" content="http://example.com/dgui_template_overallstructure.html"> |
| <link rel="canonical" href="http://example.com/dgui_template_overallstructure.html"> |
| <link rel="icon" href="favicon.png" type="image/png"> |
| <link rel="stylesheet" type="text/css" href="docgen-resources/docgen.min.css?1594338519184"> |
| </head> |
| <body itemscope itemtype="https://schema.org/Code"> |
| <meta itemprop="url" content="http://example.com/"> |
| <meta itemprop="name" content="FreeMarker Manual"> |
| |
| <!--[if lte IE 9]> |
| <div style="background-color: #C00; color: #fff; padding: 12px 24px;">Please use a modern browser to view this website.</div> |
| <![endif]--><div class="header-top-bg"><div class="site-width header-top"><a class="logo" href="http://example.com" role="banner"> <img itemprop="image" src="logo.png" alt="My Logo"> |
| </a></div></div><div class="header-bottom-bg"><div class="site-width search-row"><a href="index.html" class="navigation-header">FreeMarker Manual</a><div class="navigation-header"></div></div><div class="site-width breadcrumb-row"><ul class="breadcrumb" itemscope itemtype="http://schema.org/BreadcrumbList"><li class="step-0" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a class="label" itemprop="item" href="index.html"><span itemprop="name">FreeMarker Manual</span></a></li><li class="step-1" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a class="label" itemprop="item" href="dgui.html"><span itemprop="name">Template Author's Guide</span></a></li><li class="step-2" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a class="label" itemprop="item" href="dgui_template.html"><span itemprop="name">The Template</span></a></li><li class="step-3" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a class="label" itemprop="item" href="dgui_template_overallstructure.html"><span itemprop="name">Overall structure</span></a></li></ul><div class="bookmarks" title="Bookmarks"><span class="sr-only">Bookmarks:</span><ul class="bookmark-list"><li><a href="alphaidx.html">Index</a></li><li><a href="gloss.html">Glossary</a></li><li><a href="ref.html">Reference</a></li><li><a href="app_faq.html">FAQ</a></li><li><a href="preface.html#test_target">Bőregér</a></li><li><a href="api/index.html">API</a></li><li><a href="../index.html">Home</a></li></ul></div></div></div> <div class="main-content site-width"> |
| <div class="content-wrapper"> |
| <div id="table-of-contents-wrapper" class="col-left"> |
| <script>var breadcrumb = ["FreeMarker Manual","Template Author\'s Guide","The Template","Overall structure"];</script> |
| <script src="toc.js?1594338519184"></script> |
| <script src="docgen-resources/main.min.js?1594338519184"></script> |
| </div> |
| <div class="col-right"><div class="page-content"><div class="page-title"><div class="pagers top"><a class="paging-arrow previous" href="dgui_template.html"><span>Previous</span></a><a class="paging-arrow next" href="dgui_template_directives.html"><span>Next</span></a></div><div class="title-wrapper"> |
| <h1 class="content-header header-section1" id="dgui_template_overallstructure" itemprop="headline">Overall structure</h1> |
| </div></div><p>Templates are in fact programs you write in a language called |
| <strong>FTL</strong> (for FreeMarker |
| Template Language). This is a quite simple programming language |
| designed for writing templates and nothing else.</p><p>A template (= FTL program) is a mix of the following |
| sections:</p><ul> |
| <li> |
| <p><strong>Text</strong>: Text that will be printed to the output as |
| is.</p> |
| </li> |
| |
| <li> |
| <p><strong>Interpolation</strong>: These sections will be replaced with a calculated |
| value in the output. Interpolations are delimited by |
| <code class="inline-code">${</code> and <code class="inline-code">}</code> (or with |
| <code class="inline-code">#{</code> and <code class="inline-code">}</code>, but that shouldn't |
| be used anymore; <a href="ref_depr_numerical_interpolation.html">see more |
| here</a>).</p> |
| </li> |
| |
| <li> |
| <p><strong>FTL tags</strong>: FTL tags are a bit similar to HTML tags, but they |
| are instructions to FreeMarker and will not be printed to the |
| output.</p> |
| </li> |
| |
| <li> |
| <p><strong>Comments</strong>: Comments are similar to HTML comments, but they |
| are delimited by <code class="inline-code"><#--</code> and |
| <code class="inline-code">--></code>. Comments will be ignored by FreeMarker, |
| and will not be written to the output.</p> |
| </li> |
| </ul><p>Let's see a concrete template. I have marked the template's |
| components with colors: <span class="marked-text">text</span>, |
| <span class="marked-interpolation">interpolation</span>, <span class="marked-ftl-tag">FTL tag</span>, <span class="marked-comment">comment</span>. With the <em><span class="marked-invisible-text">[BR]</span></em>-s I intend to visualize the |
| <a href="gloss.html#gloss.lineBreak">line breaks</a>.</p> |
| |
| <div class="code-wrapper"><pre class="code-block code-template"><span class="marked-text"><html><em><span class="marked-invisible-text">[BR]</span></em> |
| <head><em><span class="marked-invisible-text">[BR]</span></em> |
| <title>Welcome!</title><em><span class="marked-invisible-text">[BR]</span></em> |
| </head><em><span class="marked-invisible-text">[BR]</span></em> |
| <body><em><span class="marked-invisible-text">[BR]</span></em> |
| <span class="marked-comment"><#-- Greet the user with his/her name --></span><em><span class="marked-invisible-text">[BR]</span></em> |
| <h1>Welcome <span class="marked-interpolation">${user}</span>!</h1><em><span class="marked-invisible-text">[BR]</span></em> |
| <p>We have these animals:<em><span class="marked-invisible-text">[BR]</span></em> |
| <ul><em><span class="marked-invisible-text">[BR]</span></em> |
| <span class="marked-ftl-tag"><#list animals as being></span><em><span class="marked-invisible-text">[BR]</span></em> |
| <li><span class="marked-interpolation">${being.name}</span> for <span class="marked-interpolation">${being.price}</span> Euros<em><span class="marked-invisible-text">[BR]</span></em> |
| <span class="marked-ftl-tag"></#list></span><em><span class="marked-invisible-text">[BR]</span></em> |
| </ul><em><span class="marked-invisible-text">[BR]</span></em> |
| </body><em><span class="marked-invisible-text">[BR]</span></em> |
| </html></span></pre></div><p>FTL distinguishes upper case and lower case letters. So |
| <code class="inline-code">list</code> is good directive name, while |
| <code class="inline-code">List</code> is not. Similarly <code class="inline-code">${name}</code> |
| is not the same as <code class="inline-code">${Name}</code> or |
| <code class="inline-code">${NAME}</code></p><p>It is important to realize that <span class="marked-interpolation">interpolations</span> can be used in |
| <span class="marked-text">text</span> (and in string literal |
| expressions; see <a href="dgui_template_exp.html#dgui_template_exp_stringop_interpolation">later</a>) |
| only.</p><p>An <span class="marked-ftl-tag">FTL tag</span> can't be inside |
| another <span class="marked-ftl-tag">FTL tag</span> nor inside an |
| <span class="marked-interpolation">interpolation</span>. For example |
| this is <em>WRONG</em>: <code class="inline-code"><#if <#include |
| 'foo'>='bar'>...</#if></code></p><p><span class="marked-comment">Comments</span> can be placed |
| inside <span class="marked-ftl-tag">FTL tags</span> and <span class="marked-interpolation">interpolations</span>. For |
| example:</p> |
| |
| <div class="code-wrapper"><pre class="code-block code-template"><span class="marked-text"><h1>Welcome <span class="marked-interpolation">${user <span class="marked-comment"><#-- The name of user --></span>}</span>!</h1><em><span class="marked-invisible-text">[BR]</span></em> |
| <p>We have these animals:<em><span class="marked-invisible-text">[BR]</span></em> |
| <ul><em><span class="marked-invisible-text">[BR]</span></em> |
| <span class="marked-ftl-tag"><#list <span class="marked-comment"><#-- some comment... --></span> animals as <span class="marked-comment"><#-- again... --></span> being></span><em><span class="marked-invisible-text">[BR]</span></em></span> |
| <em>...</em></pre></div> <div class="callout note"> |
| <strong class="callout-label">Note:</strong> |
| |
| <p>For those of you who have tried the above examples: You may |
| notice that some of spaces, tabs and line breaks are missing from |
| the template output, even though we said that <span class="marked-text">text</span> is printed as is. Don't bother with |
| it now. This is because the feature called ''white-space stripping'' |
| is turned on, and that automatically removes some superfluous |
| spaces, tabs and line breaks. This will be explained <a href="dgui_misc_whitespace.html">later</a>.</p> |
| </div> |
| <div class="bottom-pagers-wrapper"><div class="pagers bottom"><a class="paging-arrow previous" href="dgui_template.html"><span>Previous</span></a><a class="paging-arrow next" href="dgui_template_directives.html"><span>Next</span></a></div></div></div></div> </div> |
| </div> |
| <div class="site-footer"><div class="site-width"><div class="footer-top"><div class="col-left sitemap"></div><div class="col-right"><a class="xxe" href="http://www.xmlmind.com/xmleditor/" rel="nofollow" title="Edited with XMLMind XML Editor"><span>Edited with XMLMind XML Editor</span></a></div></div><div class="footer-bottom"> <p class="last-generated"> |
| Last generated: |
| <time itemprop="dateModified" datetime="2020-07-09T23:48:39Z" title="Thursday, July 9, 2020 11:48:39 PM GMT">2020-07-09 23:48:39 GMT</time> </p> |
| <p class="copyright"> |
| © <span itemprop="copyrightYear">1999</span>–2020 |
| <a itemtype="http://schema.org/Organization" itemprop="copyrightHolder" href="https://apache.org/">The Apache Software Foundation</a> </p> |
| </div></div></div></body> |
| </html> |
