Skip to content

Commit

Permalink
Updated articles and 3.1 tutorials after latest package changes
Browse files Browse the repository at this point in the history
  • Loading branch information
danielfernandez committed Jan 7, 2023
1 parent 8539532 commit 5cf0388
Show file tree
Hide file tree
Showing 20 changed files with 123 additions and 123 deletions.
2 changes: 1 addition & 1 deletion doc/articles/fromhtmltohtmlviahtml.html
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,7 @@ <h2>So what is HTML5?</h2>
<h2>Can I use HTML5 already?</h2>
<p>Mostly yes. While (as of 2016) there is no browser that fully implements the whole HTML5 feature set, most of the common ones do implement a large part of it. So as long as your users are not stuck with very old versions of (now-defunct) Internet Explorer, you should be fine in most scenarios.</p>
<p>Also, note that browser support actually evolves with time not only because of the quick pace at which browsers release new versions, but also because the specification itself is still work in progress.</p>
<p>For a list of HTML5 features and the corresponding browser support, check the <a href="http://caniuse.com/">Can I use…</a> website. Notably, the HTML5 category list for all of the features: <a href="http://caniuse.com/#cats=HTML5" class="uri">http://caniuse.com/#cats=HTML5</a></p>
<p>For a list of HTML5 features and the corresponding browser support, check the <a href="http://caniuse.com/">Can I use…</a> website. Notably, the HTML5 category list for all of the features: <a href="http://caniuse.com/#cats=HTML5">http://caniuse.com/#cats=HTML5</a></p>
</section>
<section id="and-what-about-xhtml5-does-that-exist" class="level2">
<h2>And what about XHTML5? Does that exist?</h2>
Expand Down
14 changes: 7 additions & 7 deletions doc/articles/layouts.html
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ <h3>Hierarchical-style layouts</h3>
</section>
<section id="example-application" class="level2">
<h2>Example Application</h2>
<p>All the samples and code fragments presented in this article are available on GitHub at <a href="https://github.com/thymeleaf/thymeleafexamples-layouts" class="uri">https://github.com/thymeleaf/thymeleafexamples-layouts</a></p>
<p>All the samples and code fragments presented in this article are available on GitHub at <a href="https://github.com/thymeleaf/thymeleafexamples-layouts">https://github.com/thymeleaf/thymeleafexamples-layouts</a></p>
</section>
<section id="thymeleaf-standard-layout-system" class="level2">
<h2>Thymeleaf Standard Layout System</h2>
Expand Down Expand Up @@ -154,10 +154,10 @@ <h3>Basic inclusion with <code>th:insert</code> and <code>th:replace</code></h3>
<figure>
<img src="images/layouts/homeNotSignedIn.png" alt="Home page when not signed in" /><figcaption>Home page when not signed in</figcaption>
</figure>
<p>In the above example, we are building a page that consists of page header and page footer. In Thymeleaf all fragments can be defined in a single file (e.g. <code>fragments.html</code>) or in a separate files, like in this particular case.</p>
<p>In the above example, we are building a page that consists of page header and page footer. In Thymeleaf all fragments can be defined in a single file (e.g. <code>fragments.html</code>) or in a separate files, like in this particular case.</p>
<p>Let’s shortly analyze the inclusion statement:</p>
<pre class="xml"><code>&lt;div th:replace=&quot;fragments/header :: header&quot;&gt;...&lt;/div&gt;</code></pre>
<p>The first part of the statement, <code>fragments/header</code>, is a template name that we are referencing. This can be a file (like in this example) or it can reference to the same file either by using the <code>this</code> keyword (e.g. <code>this :: header</code>) or without any keyword (e.g. <code>:: header</code>). The expression after double colon is a fragment selector (either fragment name or <em>Markup Selector</em>). As you can also see, the header fragment contains a markup that is used for static prototyping only.</p>
<p>The first part of the statement, <code>fragments/header</code>, is a template name that we are referencing. This can be a file (like in this example) or it can reference to the same file either by using the <code>this</code> keyword (e.g. <code>this :: header</code>) or without any keyword (e.g. <code>:: header</code>). The expression after double colon is a fragment selector (either fragment name or <em>Markup Selector</em>). As you can also see, the header fragment contains a markup that is used for static prototyping only.</p>
<p>Header and footer are defined in the following files:</p>
<p>Template <code>fragments/header.html</code></p>
<pre class="xml"><code>&lt;!DOCTYPE html&gt;
Expand Down Expand Up @@ -226,7 +226,7 @@ <h3>Basic inclusion with <code>th:insert</code> and <code>th:replace</code></h3>
<h3>Including with Markup Selectors</h3>
<p>In Thymeleaf, fragments don’t need to be explicitly specified using <code>th:fragment</code> at the page they are extracted from. Thymeleaf can select an arbitrary section of a page as a fragment (even a page living on an external server) by means of its Markup Selector syntax, similar to XPath expressions, CSS or jQuery selectors.</p>
<pre class="xml"><code>&lt;div th:insert=&quot;https://www.thymeleaf.org :: section.description&quot; &gt;...&lt;/div&gt;</code></pre>
<p>The above code will include a <code>section</code> with <code>class=&quot;description&quot;</code> from <code>thymeleaf.org</code>.</p>
<p>The above code will include a <code>section</code> with <code>class="description"</code> from <code>thymeleaf.org</code>.</p>
<p>In order to make it happen, the template engine must be configured with <code>UrlTemplateResolver</code>:</p>
<pre class="java"><code>@Bean
public SpringTemplateEngine templateEngine() {
Expand Down Expand Up @@ -463,7 +463,7 @@ <h3>Creating a layout</h3>
<figure>
<img src="images/layouts/layoutlayoutdialect.png" alt="Layout page" /><figcaption>Layout page</figcaption>
</figure>
<p>The above file is our decorator for content pages we will be creating in the application. The most important thing about the above example is <code>layout:fragment=&quot;content&quot;</code>. This is the <em>heart</em> of the decorator page (layout). You can also notice, that header and footer are included using Standard Thymeleaf Layout System.</p>
<p>The above file is our decorator for content pages we will be creating in the application. The most important thing about the above example is <code>layout:fragment="content"</code>. This is the <em>heart</em> of the decorator page (layout). You can also notice, that header and footer are included using Standard Thymeleaf Layout System.</p>
<p>The content page looks as follows (<code>WEB-INF/views/task/list.html</code>):</p>
<pre class="xml"><code>&lt;!DOCTYPE html&gt;
&lt;html layout:decorate=&quot;~{task/layout}&quot;&gt;
Expand Down Expand Up @@ -502,7 +502,7 @@ <h3>Creating a layout</h3>
<figure>
<img src="images/layouts/layoutlayoutdialectlist.png" alt="Layout page" /><figcaption>Layout page</figcaption>
</figure>
<p>Content of this <code>task/list</code> view will be decorated by the elements of <code>task/layout</code> view. Please note <code>layout:decorate=&quot;~{task/layout}&quot;</code> attribute in <code>&lt;html&gt;</code> element. This attribute signals to the Layout Dialect which layout should be used to decorate given view. And please note it is using Thymeleaf Fragment Expression syntax.</p>
<p>Content of this <code>task/list</code> view will be decorated by the elements of <code>task/layout</code> view. Please note <code>layout:decorate="~{task/layout}"</code> attribute in <code>&lt;html&gt;</code> element. This attribute signals to the Layout Dialect which layout should be used to decorate given view. And please note it is using Thymeleaf Fragment Expression syntax.</p>
<p>And what about <em>Natural Templates</em> using the Layout Dialect? Again, possible! You simply need to add some prototyping-only markup around the fragments being included in your templates and that’s it!</p>
</section>
<section id="include-style-approach-with-layout-dialect" class="level3">
Expand Down Expand Up @@ -584,7 +584,7 @@ <h3>Thymeleaf Custom Layout</h3>
<ul>
<li>Controllers return view names, that translate to single Thymeleaf view file (1)</li>
<li>Before rendering the view, the original <code>viewName</code> attribute in <code>ModelAndView</code> object is replaced with with the name of the layout view and the original <code>viewName</code> becomes an attribute in <code>ModelAndView</code>.</li>
<li>The layout view (2) contains several include elements: <code>&lt;div th:replace=&quot;${view} :: content&quot;&gt;Page Content&lt;/div&gt;</code></li>
<li>The layout view (2) contains several include elements: <code>&lt;div th:replace="${view} :: content"&gt;Page Content&lt;/div&gt;</code></li>
<li>The actual view file contains fragments, <em>pulled</em> by the template which embeds the actual view</li>
</ul>
<p>The project can be found on <a href="https://github.com/kolorobot/thymeleaf-custom-layout">GitHub</a>.</p>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ <h1 class="hero-header-title">Thymeleaf</h1>
<header>
<h1>Say Hello Again! Extending Thymeleaf even more in another 5 minutes</h1>
</header>
<p>This article is a continuation of <a href="sayhelloextendingthymeleaf5minutes.html"><em>“Say Hello! Extending Thymeleaf in 5 minutes”</em></a> and is meant to be read after it. Code in this article comes from the same example application, which you can view or download from <a href="https://github.com/thymeleaf/thymeleafexamples-sayhello">its GitHub repo</a>.</p>
<p>This article is a continuation of <a href="sayhelloextendingthymeleaf5minutes.html"><em>“Say Hello! Extending Thymeleaf in 5 minutes”</em></a> and is meant to be read after it. Code in this article comes from the same example application, which you can view or download from <a href="https://github.com/thymeleaf/thymeleaf/tree/3.1-master/examples/spring6/thymeleaf-examples-spring6-sayhello">its GitHub repo</a>.</p>
<section id="some-improvements-for-our-hello-dialect" class="level2">
<h2>Some improvements for our ‘hello’ dialect</h2>
<p>So far our <code>HelloDialect</code> allowed us to turn this:</p>
Expand All @@ -75,7 +75,7 @@ <h2>Some improvements for our ‘hello’ dialect</h2>
<pre class="html"><code>&lt;p&gt;Hello World!&lt;/p&gt;</code></pre>
<p>And it works just fine… but we want to add some nice additional features. For example:</p>
<ul>
<li>Allow Spring EL expressions as attribute values, like in most tags in the <em>Spring Thymeleaf Dialect</em>. For example: <code>hello:sayto=&quot;${user.name}&quot;</code></li>
<li>Allow Spring EL expressions as attribute values, like in most tags in the <em>Spring Thymeleaf Dialect</em>. For example: <code>hello:sayto="${user.name}"</code></li>
<li>Internationalize output: say <em>Hello</em> for English, <em>Hola</em> for Spanish, <em>Olá</em> for Portuguese, etc.</li>
</ul>
<p>And we will need all that because we want to be able to create a new attribute, called “<code>saytoplanet</code>” and salute all the planets in the solar system, with a template like this:</p>
Expand Down
2 changes: 1 addition & 1 deletion doc/articles/sayhelloextendingthymeleaf5minutes.html
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ <h1 class="hero-header-title">Thymeleaf</h1>
<h1>Say Hello! Extending Thymeleaf in 5 minutes</h1>
</header>
<p>Extending Thymeleaf is easy: we only have to create a dialect and add it to our template engine. Let’s see how.</p>
<p>All the code seen here comes from a working application. You can view or download the source code from <a href="https://github.com/thymeleaf/thymeleafexamples-sayhello">its GitHub repo</a>.</p>
<p>All the code seen here comes from a working application. You can view or download the source code from <a href="https://github.com/thymeleaf/thymeleaf/tree/3.1-master/examples/spring6/thymeleaf-examples-spring6-sayhello">its GitHub repo</a>.</p>
<section id="dialects" class="level2">
<h2>Dialects</h2>
<p>Thymeleaf Dialects are sets of features we can use in your templates. These features include:</p>
Expand Down
2 changes: 1 addition & 1 deletion doc/articles/springmail.html
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@ <h2>Prerequisites</h2>
</section>
<section id="example-application" class="level2">
<h2>Example application</h2>
<p>All the code in this article comes from a working example application. You can view or download the source from <a href="https://github.com/thymeleaf/thymeleafexamples-springmail">its GitHub repo</a>. Downloading this application, executing it and exploring its source code is highly recommended <em>(note that you will have to configure your SMTP user name and password (and your SMTP server if you are not using GMail) at <code>src/main/resources/configuration.properties</code>)</em>.</p>
<p>All the code in this article comes from a working example application. You can view or download the source from <a href="https://github.com/thymeleaf/thymeleaf/tree/3.1-master/examples/spring6/thymeleaf-examples-spring6-springmail">its GitHub repo</a>. Downloading this application, executing it and exploring its source code is highly recommended <em>(note that you will have to configure your SMTP user name and password (and your SMTP server if you are not using GMail) at <code>src/main/resources/configuration.properties</code>)</em>.</p>
</section>
<section id="sending-email-with-spring" class="level2">
<h2>Sending email with Spring</h2>
Expand Down
Loading

0 comments on commit 5cf0388

Please sign in to comment.