<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" version="2.0"><channel><title>Ivan Teoh</title><link>http://ivanteoh.com</link><description>Something personal yet public</description><lastBuildDate>Sat, 22 Dec 2012 12:36:29 GMT</lastBuildDate><generator>nikola</generator><docs>http://blogs.law.harvard.edu/tech/rss</docs><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/rss+xml" href="http://feeds.feedburner.com/IvanTeoh" /><feedburner:info uri="ivanteoh" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><item><title>Cooking: Puffed Pastry Apple Tart</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/9f7XeOs97ZY/189-cooking-puffed-pastry-apple-tart.html</link><description>&lt;p&gt;Nice shinning afternoon Sunday, we having some &lt;a class="reference external" href="http://www.deliciousiceland.com/puffed-pastry-apple-tart/"&gt;puffed pastry apply tart&lt;/a&gt; that freshly baked from a recipe from last night cooking show on Delicious Iceland by Chef Volli. You will notice the puffed pastry doesn't puff that much. That's because we get the ready-made pastry from Pampas.&lt;/p&gt;
&lt;div class="section" id="gallery"&gt;
&lt;h2&gt;Gallery&lt;/h2&gt;
&lt;ul class="thumbnails simple"&gt;&lt;li&gt;&lt;a class="reference external" href="/galleries/20120900/p189-1.jpg"&gt;&lt;img alt="tart" src="/galleries/20120900/p189-1.thumbnail.jpg"&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/9f7XeOs97ZY" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/189-cooking-puffed-pastry-apple-tart.html</guid><pubDate>Sun, 16 Sep 2012 14:17:31 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/189-cooking-puffed-pastry-apple-tart.html</feedburner:origLink></item><item><title>Python Web Templating Battle</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/8LtzSd1wDZo/188-python-web-templating-battle.html</link><description>&lt;p&gt;This is my first presentation in Python conference Australia. It is held in Hobart, Tasmania on August 18 and 19, 2012. Below are the notes that I used for the presentation.&lt;/p&gt;
&lt;p&gt;Thank you, Mark for introducing me and also thank you everyone here on interesting on this talk, Python web templating battle. This talk will be an introduction to python web templating in general.&lt;/p&gt;
&lt;p&gt;This talk will start with an introduction for releasing my stress. After that, I will be covering five Python web templatings in brief, which will be including features, template syntax and template loader. Then, we will have 5 minutes discussion or question and answer section to end this talk.&lt;/p&gt;
&lt;p&gt;Before I start, allowing me to spend a few seconds on introdution our current company, that I am working at, &lt;a class="reference external" href="http://www.pretaweb.com"&gt;Pretaweb&lt;/a&gt;. The Python web templatings that we used in this company are &lt;a class="reference external" href="http://docs.diazo.org/"&gt;Diazo&lt;/a&gt;, &lt;a class="reference external" href="https://developer.mozilla.org/en-US/docs/XSLT"&gt;Extensible Stylesheet Language Transformations or XSLT&lt;/a&gt; and &lt;a class="reference external" href="http://wiki.zope.org/ZPT/TAL/"&gt;Template Attribute Language or TAL&lt;/a&gt;. &lt;a class="reference external" href="http://www.pretaweb.com"&gt;PretaWeb&lt;/a&gt; specialises in the provision and support of high availability, dedicated and SaaS CMS solutions for government.&lt;/p&gt;
&lt;p&gt;Here, I want to disclaim that, the opinions expressed in this talk, are my own personal opinions, and do not represent my employer&amp;#8217;s view in any way.&lt;/p&gt;
&lt;p&gt;First, I will start with the definition of web template. What is web template? It is a tool used to separate content from presentation in web design, and for mass-production of web documents. It is a basic component of a web template system. Then what is web template system? It describes the software and methodologies used to produce web pages and for deployment on websites and delivery over the Internet. Such systems process web templates, using a template engine. It is a web publishing tool present in content management systems, software frameworks, HTML editors, and many other contexts.&lt;/p&gt;
&lt;p&gt;Web templating involves the presentation of information in a form which is often (but not always) intended to be readable, even attractive, to a human audience. Frequently, templating solutions involve a document (the template) which may look somewhat like the final output but perhaps in a simplified or stylized form, along with some data which must be presented using that template; combining these two things produces the final output which in web templating is usually (but not always) a Web page of some kind.&lt;/p&gt;
&lt;p&gt;There are many, many different HTML/XML templating packages and modules for Python that provide different feature sets and syntaxes. These libraries usually assume that you know how to write HTML or XML. But there are also many text based templating packages in Python. Here, I are going to discuss few of them.&lt;/p&gt;
&lt;p&gt;These are the five templating packages that I am going to discuss today:&lt;/p&gt;
&lt;ul class="simple"&gt;&lt;li&gt;Django template language is for Django web framework. It is a text based template language.&lt;/li&gt;
&lt;li&gt;Chameleon, which is a HTML or XML template package, used by Zope, Plone or Pyramid web framework.&lt;/li&gt;
&lt;li&gt;Jinja2 is another text based template language that similar with Django template language but provides function or macro expressions in the template.&lt;/li&gt;
&lt;li&gt;Diazo, is new feature in Plone 4.2. It defines a set of rules for merging Plone content with HTML wireframe from web designer and becoming Plone theme without touching the source code. It is also a HTML or XML template package.&lt;/li&gt;
&lt;li&gt;Mako is also a text based language but it allow developer to embedded Python code in the template.&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Just a quick show of hands, does anyone use all of the them? Four of the them? One of them? Good. At least most of the audience use at least one of the template language.&lt;/p&gt;
&lt;div class="section" id="django-template-language"&gt;
&lt;h2&gt;Django Template Language&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;Text based template language&lt;/li&gt;
&lt;li&gt;Define variables and basic control logic&lt;/li&gt;
&lt;li&gt;Used in Django web framework&lt;/li&gt;
&lt;li&gt;Custom tag and filter in Python code&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Django's template language is a text based template language. It designed to strike a balance between power and ease. It's designed to feel comfortable to those used to working with HTML. The Django template system provides tags which function similarly to some programming constructs - an if tag for boolean tests, a for tag for looping, etc. But these are not simply executed as the corresponding Python code, and the template system will not execute arbitrary Python expressions. Beside tags, filters and syntax that are provided by Django, you can add your own extensions to the template language as needed.&lt;/p&gt;
&lt;div class="section" id="django-template-syntax"&gt;
&lt;h3&gt;Django - Template Syntax&lt;/h3&gt;
&lt;p&gt;A template is a text document, or a normal Python string, that is marked-up using the Django template language. A template can contain block tags or variables:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;extends&lt;/span&gt; &lt;span class="s2"&gt;"base_generic.html"&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;

&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;block&lt;/span&gt; &lt;span class="nv"&gt;title&lt;/span&gt; &lt;span class="cp"&gt;%}{{&lt;/span&gt; &lt;span class="nv"&gt;section.title&lt;/span&gt; &lt;span class="cp"&gt;}}{%&lt;/span&gt; &lt;span class="k"&gt;endblock&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;

&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;block&lt;/span&gt; &lt;span class="nv"&gt;content&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;
&amp;lt;h1&amp;gt;&lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;section.title&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;&amp;lt;/h1&amp;gt;

&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="nv"&gt;story&lt;/span&gt; &lt;span class="k"&gt;in&lt;/span&gt; &lt;span class="nv"&gt;story_list&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;
&amp;lt;h2&amp;gt;
  &amp;lt;a href="&lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;story.get_absolute_url&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;"&amp;gt;
    &lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;story.headline&lt;/span&gt;&lt;span class="o"&gt;|&lt;/span&gt;&lt;span class="nf"&gt;upper&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;
  &amp;lt;/a&amp;gt;
&amp;lt;/h2&amp;gt;
&amp;lt;p&amp;gt;&lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;story.tease&lt;/span&gt;&lt;span class="o"&gt;|&lt;/span&gt;&lt;span class="nf"&gt;truncatewords&lt;/span&gt;&lt;span class="s2"&gt;:"100"&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;&amp;lt;/p&amp;gt;
&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;endfor&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;
&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;endblock&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;A block tag is a symbol within a template that does something. For example, a block tag can output content, serve as a control structure (an "if" statement or "for" loop), grab content from a database or enable access to other template tags. Block tags are surrounded by "{%" and "%}". Example template with block tags:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="nv"&gt;is_logged_in&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;Thanks for logging in!&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;Please log in.&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;endif&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;A variable is a symbol within a template that outputs a value. Variable tags are surrounded by "{{" and "}}". Example template with variables: My first name is {{ first_name }}. My last name is {{ last_name }}. A context is a "variable name" -&amp;gt; "variable value" mapping that is passed to a template. A template renders a context by replacing the variable "holes" with values from the context and executing all block tags.&lt;/p&gt;
&lt;p&gt;You can modify variables for display by using filters. Filters look like this: {{ name|lower }}. This displays the value of the {{ name }} variable after being filtered through the lower filter, which converts text to lowercase. Use a pipe symbol (|) to apply a filter. Some filters take arguments. A filter argument looks like this: {{ bio|truncatewords:30 }}. This will display the first 30 words of the bio variable. Filter arguments that contain spaces must be quoted; for example, to join a list with commas and spaced you'd use {{ list|join:", " }}.&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="django-custom-filter"&gt;
&lt;h3&gt;Django - Custom Filter&lt;/h3&gt;
&lt;p&gt;Django's template system comes with a wide variety of built-in tags and filters designed to address the presentation logic needs of your application. Nevertheless, you may find yourself needing functionality that is not covered by the core set of template primitives. You can extend the template engine by defining custom tags and filters using Python, and then make them available to your templates using the {% load %} tag.&lt;/p&gt;
&lt;p&gt;Custom filters are just Python functions that take one or two arguments:&lt;/p&gt;
&lt;ul class="simple"&gt;&lt;li&gt;The value of the variable (input) - not necessarily a string.&lt;/li&gt;
&lt;li&gt;The value of the argument - this can have a default value, or be left out altogether.&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;For example, in the filter {{ var|foo:"bar" }}, the filter foo would be passed the variable var and the argument "bar".&lt;/p&gt;
&lt;p&gt;Filter functions should always return something. They shouldn't raise exceptions. They should fail silently. In case of error, they should return either the original input or an empty string - whichever makes more sense.&lt;/p&gt;
&lt;p&gt;Here's an example filter definition:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;lower&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;value&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt; &lt;span class="c"&gt;# Only one argument.&lt;/span&gt;
    &lt;span class="sd"&gt;"""Converts a string into all lowercase"""&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="n"&gt;value&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;lower&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;

&lt;span class="n"&gt;register&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;filter&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'lower'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;lower&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;And here's an example of how that filter would be used:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;somevariable&lt;/span&gt;&lt;span class="o"&gt;|&lt;/span&gt;&lt;span class="nf"&gt;lower&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="django-template-loader"&gt;
&lt;h3&gt;Django - Template loader&lt;/h3&gt;
&lt;p&gt;There are few ways to load django template. One of the them is using 'django.template.Template' class. When using this class, you compile the raw template code into a Template object first. Then call the render() method of the Template object with a given context:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;django.template&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;Context&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;Template&lt;/span&gt;
&lt;span class="n"&gt;t&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;Template&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"My name is {{ my_name }}."&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="n"&gt;c&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;Context&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;&lt;span class="s"&gt;"my_name"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="s"&gt;"Ivan"&lt;/span&gt;&lt;span class="p"&gt;})&lt;/span&gt;
&lt;span class="n"&gt;t&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;render&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;c&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;If you're using Django's render_to_response() shortcut to populate a template with the contents of a dictionary, your template will be passed a Context instance by default (not a RequestContext). To use a RequestContext in your template rendering, pass an optional third argument to render_to_response(): a RequestContext instance. Your code might look like this:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;some_view&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;request&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
    &lt;span class="c"&gt;# ...&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="n"&gt;render_to_response&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'my_template.html'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
                              &lt;span class="n"&gt;my_data_dictionary&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
                              &lt;span class="n"&gt;context_instance&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="n"&gt;RequestContext&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;request&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon"&gt;
&lt;h2&gt;Chameleon&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;HTML/XML template engine&lt;/li&gt;
&lt;li&gt;Compiles into Python bytecode&lt;/li&gt;
&lt;li&gt;The language used is page templates, originally a Zope invention&lt;/li&gt;
&lt;li&gt;Uses Python as the default expression language&lt;/li&gt;
&lt;li&gt;Embedded Python code&lt;/li&gt;
&lt;li&gt;Used by Pyramid, Zope, Plone and Grok projects&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Chameleon is an HTML/XML template engine for Python. It's designed to generate the document output of a web application, typically HTML markup or XML. The language used is page templates, originally a Zope invention, but available here as a standalone library that you can use in any script or application running Python 2.5 and up (including 3.x and pypy). The template engine compiles templates into Python byte-code and is optimized for speed.&lt;/p&gt;
&lt;p&gt;The template language specifications and API for the Page Templates engine are based on &lt;a class="reference external" href="http://pypi.python.org/pypi/zope.pagetemplate"&gt;Zope Page Templates&lt;/a&gt;, zope.pagetemplate. However, the Chameleon compiler and Page Templates engine is an entirely new codebase, packaged as a standalone distribution. It does require a Zope software environment. We can use Chameleon in Pyramid, Zope, Plone and Grok projects.&lt;/p&gt;
&lt;div class="section" id="chameleon-template-syntax"&gt;
&lt;h3&gt;Chameleon - Template Syntax&lt;/h3&gt;
&lt;p&gt;The page templates language is used within your document structure as special element attributes and text markup. Using a set of simple language constructs, you control the document flow, element repetition, text replacement and translation.&lt;/p&gt;
&lt;p&gt;If you've used page templates in a Zope environment previously, note that Chameleon uses Python as the default expression language (instead of path expressions). The basic language (known as the template attribute language or TAL) is simple enough to grasp from an example:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;html&lt;/span&gt; &lt;span class="na"&gt;xmlns=&lt;/span&gt;&lt;span class="s"&gt;"http://www.w3.org/1999/xhtml"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;body&amp;gt;&lt;/span&gt;
    &lt;span class="c"&gt;&amp;lt;!--! This comment will be dropped from output --&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;tal:repeat=&lt;/span&gt;&lt;span class="s"&gt;"item range(10)"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;p&lt;/span&gt; &lt;span class="na"&gt;tal:condition=&lt;/span&gt;&lt;span class="s"&gt;"repeat.item.even"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;Even&lt;span class="nt"&gt;&amp;lt;/p&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;p&lt;/span&gt; &lt;span class="na"&gt;tal:condition=&lt;/span&gt;&lt;span class="s"&gt;"repeat.item.odd"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;Odd&lt;span class="nt"&gt;&amp;lt;/p&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
    &lt;span class="c"&gt;&amp;lt;!--? This comment will be included verbatim --&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;div&amp;gt;&lt;/span&gt;
        &lt;span class="cp"&gt;&amp;lt;?python import pdb; pdb.set_trace() ?&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;ul&lt;/span&gt; &lt;span class="na"&gt;tal:switch=&lt;/span&gt;&lt;span class="s"&gt;"len(items) % 2"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
            &lt;span class="nt"&gt;&amp;lt;li&lt;/span&gt; &lt;span class="na"&gt;tal:case=&lt;/span&gt;&lt;span class="s"&gt;"True"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;odd&lt;span class="nt"&gt;&amp;lt;/li&amp;gt;&lt;/span&gt;
            &lt;span class="nt"&gt;&amp;lt;li&lt;/span&gt; &lt;span class="na"&gt;tal:case=&lt;/span&gt;&lt;span class="s"&gt;"False"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;even&lt;span class="nt"&gt;&amp;lt;/li&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;/ul&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;div class="section" id="chameleon-attribute-language"&gt;
&lt;h4&gt;Chameleon - Attribute Language&lt;/h4&gt;
&lt;p&gt;An attribute language is a programming language designed to render documents written in XML or HTML markup. The statements of the language are document tags with special attributes, and look like this:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;p&lt;/span&gt; &lt;span class="na"&gt;namespace-prefix:command=&lt;/span&gt;&lt;span class="s"&gt;"argument"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt; ... &lt;span class="nt"&gt;&amp;lt;/p&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;In the above example, the attribute namespace-prefix:command="argument" is the statement, and the entire paragraph tag is the statement's element. The statement's element is the portion of the document on which this statement operates.&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-namespace-prefixes"&gt;
&lt;h4&gt;Chameleon - Namespace Prefixes&lt;/h4&gt;
&lt;p&gt;The namespace prefixes are typically declared once, at the top of a template (note that prefix declarations for the template language namespaces are omitted from the template output):&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;html&lt;/span&gt; &lt;span class="na"&gt;xmlns=&lt;/span&gt;&lt;span class="s"&gt;"http://www.w3.org/1999/xhtml"&lt;/span&gt;
      &lt;span class="na"&gt;xmlns:tal=&lt;/span&gt;&lt;span class="s"&gt;"http://xml.zope.org/namespaces/tal"&lt;/span&gt;
      &lt;span class="na"&gt;xmlns:metal=&lt;/span&gt;&lt;span class="s"&gt;"http://xml.zope.org/namespaces/metal"&lt;/span&gt;
      &lt;span class="na"&gt;xmlns:i18n=&lt;/span&gt;&lt;span class="s"&gt;"http://xml.zope.org/namespaces/i18n"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
  ...
&lt;span class="nt"&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;Chameleon sets up defaults for tal, metal and i18n as well. Default prefixes are a special feature of Chameleon:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;html&lt;/span&gt; &lt;span class="na"&gt;xmlns=&lt;/span&gt;&lt;span class="s"&gt;"http://www.w3.org/1999/xhtml"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
  ...
&lt;span class="nt"&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-switch-and-case"&gt;
&lt;h4&gt;Chameleon - Switch and Case&lt;/h4&gt;
&lt;p&gt;The switch and case construct is a short-hand syntax for evaluating a set of expressions against a parent value. The tal:switch statement is used to set a new parent value and the tal:case statement works like a condition and only allows content if the expression matches the value. These statements are only available in Chameleon 2.x and not part of the ZPT specification:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;ul&lt;/span&gt; &lt;span class="na"&gt;tal:switch=&lt;/span&gt;&lt;span class="s"&gt;"len(items) % 2"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;li&lt;/span&gt; &lt;span class="na"&gt;tal:case=&lt;/span&gt;&lt;span class="s"&gt;"True"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;odd&lt;span class="nt"&gt;&amp;lt;/li&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;li&lt;/span&gt; &lt;span class="na"&gt;tal:case=&lt;/span&gt;&lt;span class="s"&gt;"False"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;even&lt;span class="nt"&gt;&amp;lt;/li&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/ul&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-repeat"&gt;
&lt;h4&gt;Chameleon - Repeat&lt;/h4&gt;
&lt;p&gt;The tal:repeat statement replicates a sub-tree of your document once for each item in a sequence. The expression should evaluate to a sequence. If the sequence is empty, then the statement element is deleted, otherwise it is repeated for each value in the sequence. If the expression is default, then the element is left unchanged, and no new variables are defined. The variable_name is used to define a local variable and a repeat variable. For each repetition, the local variable is set to the current sequence element, and the repeat variable is set to an iteration object. Both even and odd are repeat variables. Even is True when even-indexed repetitions (0, 2, 4, ...). And odd is True when odd-indexed repetitions (1, 3, 5, ...):&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;tal:repeat=&lt;/span&gt;&lt;span class="s"&gt;"item range(10)"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;p&lt;/span&gt; &lt;span class="na"&gt;tal:condition=&lt;/span&gt;&lt;span class="s"&gt;"repeat.item.even"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;Even&lt;span class="nt"&gt;&amp;lt;/p&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;p&lt;/span&gt; &lt;span class="na"&gt;tal:condition=&lt;/span&gt;&lt;span class="s"&gt;"repeat.item.odd"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;Odd&lt;span class="nt"&gt;&amp;lt;/p&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-expression-type"&gt;
&lt;h4&gt;Chameleon - Expression Type&lt;/h4&gt;
&lt;p&gt;The default expression type is Python. The Zope reference engine defaults to a path expression type, which is closely tied to the Zope framework. This expression is not implemented in Chameleon (but it&amp;#8217;s available in a Zope framework compatibility package). Python expressions are executed natively within the translated template source code. There is no built-in security apparatus:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;tal:repeat=&lt;/span&gt;&lt;span class="s"&gt;"item range(10)"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
    ...
&lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-embedded-python-code"&gt;
&lt;h4&gt;Chameleon - Embedded Python Code&lt;/h4&gt;
&lt;p&gt;The &amp;lt;?python ... ?&amp;gt; notation allows you to embed Python code in templates. The scope of name assignments is up to the nearest macro definition, or the template, if macros are not used. Note that code blocks can span multiple line and start on the next line of where the processing instruction begins:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="cp"&gt;&amp;lt;?python import pdb; pdb.set_trace() ?&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-comment-statement"&gt;
&lt;h4&gt;Chameleon - Comment statement&lt;/h4&gt;
&lt;p&gt;You can apply the "!" and "?" modifiers to change how comments are processed:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="c"&gt;&amp;lt;!--! This comment will be dropped from output --&amp;gt;&lt;/span&gt;
&lt;span class="c"&gt;&amp;lt;!--? This comment will be included verbatim --&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-extension"&gt;
&lt;h4&gt;Chameleon - Extension&lt;/h4&gt;
&lt;p&gt;You can extend the language through the expression engine by writing your own expression compiler.&lt;/p&gt;
&lt;p&gt;Let's try and write an expression compiler for an expression type that will simply uppercase the supplied value. We'll call it upper.&lt;/p&gt;
&lt;p&gt;You can write such a compiler as a closure:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="nn"&gt;ast&lt;/span&gt;

&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;uppercase_expression&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;string&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
    &lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;compiler&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;target&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;engine&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
        &lt;span class="n"&gt;uppercased&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="bp"&gt;self&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;string&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;uppercase&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
        &lt;span class="n"&gt;value&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;ast&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;Str&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;uppercased&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;ast&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;Assign&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;targets&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="n"&gt;target&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="n"&gt;value&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="n"&gt;value&lt;/span&gt;&lt;span class="p"&gt;)]&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="n"&gt;compiler&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;To make it available under a certain prefix, we'll add it to the expression types dictionary:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;chameleon&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;PageTemplate&lt;/span&gt;
&lt;span class="n"&gt;PageTemplate&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;expression_types&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="s"&gt;'upper'&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;uppercase_expression&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;Alternatively, you could subclass the template class and set the attribute expression_types to a dictionary that includes your expression:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;chameleon&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;PageTemplateFile&lt;/span&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;chameleon.tales&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;PythonExpr&lt;/span&gt;

&lt;span class="k"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;MyPageTemplateFile&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;PageTemplateFile&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
    &lt;span class="n"&gt;expression_types&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="s"&gt;'python'&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="n"&gt;PythonExpr&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
        &lt;span class="s"&gt;'upper'&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="n"&gt;uppercase_expression&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;You can now uppercase strings natively in your templates:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;tal:content=&lt;/span&gt;&lt;span class="s"&gt;"upper: hello, world"&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;It&amp;#8217;s probably best to stick with a Python expression:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;tal:content=&lt;/span&gt;&lt;span class="s"&gt;"'hello, world'.upper()"&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="chameleon-template-loader"&gt;
&lt;h3&gt;Chameleon - Template loader&lt;/h3&gt;
&lt;p&gt;There are several template constructor classes available, one for each of the combinations text or xml, and string or file.&lt;/p&gt;
&lt;p&gt;The file-based constructor requires an absolute path. To set up a templates directory once, use the template loader class:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="nn"&gt;os&lt;/span&gt;

&lt;span class="n"&gt;path&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;os&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;path&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;dirname&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;__file__&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;chameleon&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;PageTemplateLoader&lt;/span&gt;
&lt;span class="n"&gt;templates&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;PageTemplateLoader&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;os&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;path&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;join&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;path&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s"&gt;"templates"&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;Then, to load a template relative to the provided path, use dictionary syntax:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="n"&gt;template&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;templates&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="s"&gt;'hello.pt'&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;Alternatively, use the appropriate template class directly. Let&amp;#8217;s try with a string input:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;chameleon&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;PageTemplate&lt;/span&gt;
&lt;span class="n"&gt;template&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;PageTemplate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"&amp;lt;div&amp;gt;Hello, ${name}.&amp;lt;/div&amp;gt;"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;All template instances are callable. Provide variables by keyword argument:&lt;/p&gt;
&lt;pre class="code bash literal-block"&gt;
&amp;gt;&amp;gt;&amp;gt; template&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="nv"&gt;name&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s1"&gt;'John'&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt;
&lt;span class="s1"&gt;'&amp;lt;div&amp;gt;Hello, John.&amp;lt;/div&amp;gt;'&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="jinja2"&gt;
&lt;h2&gt;Jinja2&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;Function/macros&lt;/li&gt;
&lt;li&gt;Text based template language&lt;/li&gt;
&lt;li&gt;Compiles down to the python bytecode&lt;/li&gt;
&lt;li&gt;Heavily inspired by Django and Python&lt;/li&gt;
&lt;li&gt;General purpose template language&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Jinga2 is a text based template language. The template syntax is heavily inspired by Django and Python. It also compiles down to the python bytecode. A template is simply a text file. It can generate any text-based format (HTML, XML, CSV, LaTeX, etc.). It doesn&amp;#8217;t have a specific extension, .html or .xml are just fine. A template contains variables or expressions, which get replaced with values when the template is evaluated, and tags, which control the logic of the template.&lt;/p&gt;
&lt;div class="section" id="jinja2-template-syntax"&gt;
&lt;h3&gt;Jinja2 - Template Syntax&lt;/h3&gt;
&lt;p&gt;This covers the default settings. The application developer might have changed the
syntax from {% foo %} to &amp;lt;% foo %&amp;gt; or something similar:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="cp"&gt;&amp;lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;html&lt;/span&gt; &lt;span class="na"&gt;lang=&lt;/span&gt;&lt;span class="s"&gt;"en"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;head&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;title&amp;gt;&lt;/span&gt;My Webpage&lt;span class="nt"&gt;&amp;lt;/title&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;/head&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;body&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;ul&lt;/span&gt; &lt;span class="na"&gt;id=&lt;/span&gt;&lt;span class="s"&gt;"navigation"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
        {% for user in users if not user.hidden %}
            &lt;span class="nt"&gt;&amp;lt;li&amp;gt;&lt;/span&gt;{{ user.username|e }}&lt;span class="nt"&gt;&amp;lt;/li&amp;gt;&lt;/span&gt;
        {% endfor %}
        &lt;span class="nt"&gt;&amp;lt;/ul&amp;gt;&lt;/span&gt;
        {# this is comment #}
        &lt;span class="nt"&gt;&amp;lt;h1&amp;gt;&lt;/span&gt;My Webpage&lt;span class="nt"&gt;&amp;lt;/h1&amp;gt;&lt;/span&gt;
        {{ my_variable }}
    &lt;span class="nt"&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;There are two kinds of delimiters. {% ... %} and {{ ... }}. The first one is used to
execute statements such as for-loops or assign values, the latter prints the result of the expression to the template.&lt;/p&gt;
&lt;div class="section" id="jinja2-variables"&gt;
&lt;h4&gt;Jinja2 - Variables&lt;/h4&gt;
&lt;p&gt;The application passes variables to the templates you can mess around in the template. Variables may have attributes or elements on them you can access too:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;my_variable&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="jinja2-filters"&gt;
&lt;h4&gt;Jinja2 - Filters&lt;/h4&gt;
&lt;p&gt;Variables can be modified by filters. Filters are separated from the variable by a pipe symbol (|) and may have optional arguments in parentheses. Multiple filters can be chained. The output of one filter is applied to the next. {{ name|striptags|title }} for example will remove all HTML Tags from the name and title-cases it. Filters that accept arguments have parentheses around the arguments, like a function call. This example will join a list by commas: {{ list|join(&amp;#8217;,&amp;#8217;) }}:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;user.username&lt;/span&gt;&lt;span class="o"&gt;|&lt;/span&gt;&lt;span class="nf"&gt;e&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="jinja2-comments"&gt;
&lt;h4&gt;Jinja2 - Comments&lt;/h4&gt;
&lt;p&gt;To comment-out part of a line in a template, use the comment syntax which is by
default set to {# ... #}. This is useful to comment out parts of the template for
debugging or to add information for other template designers or yourself:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="c"&gt;{# this is comment #}&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="jinja2-control-structures"&gt;
&lt;h4&gt;Jinja2 - Control Structures&lt;/h4&gt;
&lt;p&gt;A control structure refers to all those things that control the flow of a program - conditionals (i.e. if/elif/else), for-loops, as well as things like macros and blocks. Control structures appear inside {% ... %} blocks in the default syntax. For example, for, it loops over each item in a sequence:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="nv"&gt;user&lt;/span&gt; &lt;span class="k"&gt;in&lt;/span&gt; &lt;span class="nv"&gt;users&lt;/span&gt; &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="k"&gt;not&lt;/span&gt; &lt;span class="nv"&gt;user.hidden&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;
    &amp;lt;li&amp;gt;&lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;user.username&lt;/span&gt;&lt;span class="o"&gt;|&lt;/span&gt;&lt;span class="nf"&gt;e&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;&amp;lt;/li&amp;gt;
&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;endfor&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="jinja2-call"&gt;
&lt;h3&gt;Jinja2 - Call&lt;/h3&gt;
&lt;p&gt;Macros are comparable with functions in regular programming languages. They are useful to put often used idioms into reusable functions to not repeat yourself. In some cases, it can be useful to pass a macro to another macro. For this purpose, you can use the special call block. The following example shows a macro that takes advantage of the call functionality and how it can be used:&lt;/p&gt;
&lt;pre class="code django literal-block"&gt;
&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;macro&lt;/span&gt; &lt;span class="nv"&gt;render_dialog&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="nv"&gt;title&lt;/span&gt;&lt;span class="o"&gt;,&lt;/span&gt; &lt;span class="nv"&gt;class&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;&amp;#8217;&lt;/span&gt;&lt;span class="nv"&gt;dialog&lt;/span&gt;&lt;span class="p"&gt;&amp;#8217;&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; -&lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;
&amp;lt;div class="&lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;class&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;"&amp;gt;
    &amp;lt;h2&amp;gt;&lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;title&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;&amp;lt;/h2&amp;gt;
    &amp;lt;div class="contents"&amp;gt;
        &lt;/span&gt;&lt;span class="cp"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;caller&lt;/span&gt;&lt;span class="o"&gt;()&lt;/span&gt; &lt;span class="cp"&gt;}}&lt;/span&gt;&lt;span class="x"&gt;
    &amp;lt;/div&amp;gt;
&amp;lt;/div&amp;gt;
&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt;- &lt;span class="k"&gt;endmacro&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;

&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;call&lt;/span&gt; &lt;span class="nv"&gt;render_dialog&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="p"&gt;&amp;#8217;&lt;/span&gt;&lt;span class="nv"&gt;Hello&lt;/span&gt; &lt;span class="nv"&gt;World&lt;/span&gt;&lt;span class="p"&gt;&amp;#8217;&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;&lt;span class="x"&gt;
    This is a simple dialog rendered by using a macro and
    a call block.
&lt;/span&gt;&lt;span class="cp"&gt;{%&lt;/span&gt; &lt;span class="k"&gt;endcall&lt;/span&gt; &lt;span class="cp"&gt;%}&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="jinja2-template-loader"&gt;
&lt;h3&gt;Jinja2 - Template Loader&lt;/h3&gt;
&lt;p&gt;Jinja2 uses a central object called the template Environment. Instances of this class are used to store the configuration, global objects and are used to load templates from the file system or other locations. The simplest way to configure Jinja2 to load templates for your application looks roughly like this:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;jinja2&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;Environment&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;PackageLoader&lt;/span&gt;
&lt;span class="n"&gt;env&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;Environment&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;loader&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="n"&gt;PackageLoader&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'yourapplication'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s"&gt;'templates'&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
&lt;span class="n"&gt;template&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;env&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;get_template&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'mytemplate.html'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="k"&gt;print&lt;/span&gt; &lt;span class="n"&gt;template&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;render&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;the&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s"&gt;'variables'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;go&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s"&gt;'here'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;This will create a template environment with the default settings and a loader that looks up the templates in the templates folder inside the 'yourapplication' python package. To load a template from this environment you just have to call the get_template() method which then returns the loaded Template. To render it with some variables, just call the render() method.&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="diazo-and-xslt"&gt;
&lt;h2&gt;Diazo and XSLT&lt;/h2&gt;
&lt;p&gt;Diazo allows you to apply a theme contained in a static HTML web page to a dynamic website created using any server-side technology. With Diazo, you can take an HTML wireframe created by a web designer and turn it into a theme for your favourite CMS, redesign the user interface of a legacy web application without even having access to the original source code, or build a unified user experience across multiple disparate systems, all in a matter of hours, not weeks. When using Diazo, you will work with syntax and concepts familiar from working with HTML and CSS. And by allowing you seamlessly integrate XSLT into your rule files, Diazo makes common cases simple and complex requirements possible:&lt;/p&gt;
&lt;div class="section" id="diazo-template-syntax"&gt;
&lt;h3&gt;Diazo - Template Syntax&lt;/h3&gt;
&lt;p&gt;Inside the diazo folder, you will need at least two files, theme.xml and rules.html.&lt;/p&gt;
&lt;p&gt;The theme.html is a static HTML design from web designer. It might come with placeholder content and images, stylesheets and JavaScript resources included via relative links. You would normally be able to test the theme by opening it with web browser:&lt;/p&gt;
&lt;pre class="code html literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;html&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;head&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;title&amp;gt;&lt;/span&gt;My own Diazo&lt;span class="nt"&gt;&amp;lt;/title&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;/head&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;body&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;h1&lt;/span&gt; &lt;span class="na"&gt;id=&lt;/span&gt;&lt;span class="s"&gt;"title"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;My own Diazo home page&lt;span class="nt"&gt;&amp;lt;/h1&amp;gt;&lt;/span&gt;
        &lt;span class="nt"&gt;&amp;lt;div&lt;/span&gt; &lt;span class="na"&gt;id=&lt;/span&gt;&lt;span class="s"&gt;"content"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;
            &lt;span class="c"&gt;&amp;lt;!-- Placeholder --&amp;gt;&lt;/span&gt;
            Lorem ipsum ...
        &lt;span class="nt"&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;The rules.xml is Diazo rule file. It contains the Diazo directives that merge the content (the thing we are applying the theme to) into the theme, replacing placeholders with real content. I will explain later what are drop and replace directive statements mean:&lt;/p&gt;
&lt;pre class="code xml literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;rules&lt;/span&gt;
    &lt;span class="na"&gt;xmlns=&lt;/span&gt;&lt;span class="s"&gt;"http://namespaces.plone.org/diazo"&lt;/span&gt;
    &lt;span class="na"&gt;xmlns:css=&lt;/span&gt;&lt;span class="s"&gt;"http://namespaces.plone.org/diazo/css"&lt;/span&gt;
    &lt;span class="na"&gt;xmlns:xsl=&lt;/span&gt;&lt;span class="s"&gt;"http://www.w3.org/1999/XSL/Transform"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;

    &lt;span class="nt"&gt;&amp;lt;theme&lt;/span&gt; &lt;span class="na"&gt;href=&lt;/span&gt;&lt;span class="s"&gt;"theme.html"&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;

    &lt;span class="nt"&gt;&amp;lt;drop&lt;/span&gt; &lt;span class="na"&gt;theme=&lt;/span&gt;&lt;span class="s"&gt;"/html/head/title"&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;drop&lt;/span&gt; &lt;span class="na"&gt;css:theme=&lt;/span&gt;&lt;span class="s"&gt;"#title"&lt;/span&gt; &lt;span class="na"&gt;css:if-content=&lt;/span&gt;&lt;span class="s"&gt;"#content.wide"&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;replace&lt;/span&gt; &lt;span class="na"&gt;css:theme-children=&lt;/span&gt;&lt;span class="s"&gt;"#content"&lt;/span&gt; &lt;span class="na"&gt;css:content-children=&lt;/span&gt;&lt;span class="s"&gt;".content"&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;

&lt;span class="nt"&gt;&amp;lt;/rules&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;The rules file contains an XML document that is is rooted in a tag called &amp;lt;rules /&amp;gt;. Here we have defined three namespaces: the default namespace is used for rules and XPath selectors. The css namespace is used for CSS3 selectors. These are functionally equivalent to the XPath selectors. In fact, CSS selectors are replaced by the equivalent XPath selector during the pre-processing step of the compiler. Thus, they have no performance impact. The xsl namespace is used if you want to add inline XSLT directives for fine-grained control.&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="diazo-directives"&gt;
&lt;h3&gt;Diazo - Directives&lt;/h3&gt;
&lt;p&gt;The following directives are allowed inside the &amp;lt;rules /&amp;gt; element in the rules file:&lt;/p&gt;
&lt;pre class="code xml literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;theme&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;notheme&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;replace&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;before&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;after&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;drop&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;strip&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;merge&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;span class="nt"&gt;&amp;lt;copy&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;Here, we will be discussing three directives, theme, drop and replace.&lt;/p&gt;
&lt;p&gt;The &amp;lt;theme /&amp;gt; is used to specify the theme file.&lt;/p&gt;
&lt;p&gt;The &amp;lt;replace /&amp;gt; is used to replace an element in the theme entirely with an element in the content.&lt;/p&gt;
&lt;p&gt;The &amp;lt;drop /&amp;gt; is used to drop elements from the theme or the content. This is the only element that accepts either theme or content attributes (or their css: and -children equivalents), but not both.&lt;/p&gt;
&lt;div class="section" id="diazo-attributes"&gt;
&lt;h4&gt;Diazo - Attributes&lt;/h4&gt;
&lt;p&gt;theme or theme-children or css:theme or css:theme-children - Used to specify the node(s) in the theme that is to be replaced. When using theme-children, all elements inside the tag that matches the XPath or CSS expression will be replaced, but the matched tag itself will remain intact.&lt;/p&gt;
&lt;p&gt;content or content-children or css:content or css:content-children - Used to specify the node in the content that is to replace the matched node(s) in the theme. When using content-children, all elements inside the tag that matches the XPath or CSS expression will be used, but the matched tag itself will be left out.&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="diazo-conditional-rules"&gt;
&lt;h4&gt;Diazo - Conditional Rules&lt;/h4&gt;
&lt;p&gt;Sometimes, it is useful to apply a rule only if a given element appears or does not appear in the markup. The if, if-content and if-path attributes can be used with any rule, as well as the &amp;lt;theme /&amp;gt; and &amp;lt;notheme /&amp;gt; directives. if-content should be set to an XPath expression. You can also use css:if-content with a CSS3 expression. If the expression matches a node in the content, the rule will be applied.&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="diazo-xslt"&gt;
&lt;h3&gt;Diazo - XSLT&lt;/h3&gt;
&lt;p&gt;There is no loop logic in Diazo? Wait!&lt;/p&gt;
&lt;pre class="code literal-block"&gt;
&amp;lt;replace css:theme="#details"&amp;gt;
    &amp;lt;dl id="details"&amp;gt;
        &amp;lt;xsl:for-each css:select="ul#details &amp;gt; li"&amp;gt;
            &amp;lt;dt&amp;gt;&amp;lt;xsl:copy-of select="a" /&amp;gt;&amp;lt;/dt&amp;gt;
            &amp;lt;dd&amp;gt;&amp;lt;xsl:copy-of select="img" /&amp;gt;&amp;lt;/dd&amp;gt;
        &amp;lt;/xsl:for-each&amp;gt;
    &amp;lt;/dl&amp;gt;
&amp;lt;/replace&amp;gt;
&lt;/pre&gt;
&lt;p&gt;Here come the mix of XSLT with Diazo. It is possible to insert XSLT instructions into the compiled theme in this manner. This code is looping &amp;lt;li&amp;gt; in &amp;lt;ul id=&amp;#8221;details&amp;#8221;&amp;gt; of the content. And then copy anchor element (&amp;lt;a&amp;gt;) in definition term element (&amp;lt;dt&amp;gt;) and image element (&amp;lt;img&amp;gt;) in definition description element (&amp;lt;dd&amp;gt;).&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="diazo-compilation"&gt;
&lt;h3&gt;Diazo - Compilation&lt;/h3&gt;
&lt;p&gt;Once you have written your rules file, you need to compile it to an XSLT for deployment. In some cases, you may have an application server that does this on the fly, e.g. if you are using the plone.app.theming package with Plone. For deployment to a web server like Apache or Nginx, however, you will need to perform this step manually.&lt;/p&gt;
&lt;p&gt;The easiest way to invoke the Diazo compiler is via the diazocompiler command line script which is installed with the diazo egg.&lt;/p&gt;
&lt;p&gt;This will print the compiled XSLT file to the standard output. You can save it to a file instead using:&lt;/p&gt;
&lt;pre class="code bash literal-block"&gt;
&lt;span class="nv"&gt;$ &lt;/span&gt;bin/diazocompiler -o theme.xsl -r rules.xml
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="diazo-test-run"&gt;
&lt;h3&gt;Diazo - Test Run&lt;/h3&gt;
&lt;p&gt;To test the compiled theme, you can apply it to a static file representing the content. The easiest way to do this is via the diazorun script:&lt;/p&gt;
&lt;pre class="code bash literal-block"&gt;
&lt;span class="nv"&gt;$ &lt;/span&gt;bin/diazorun -o output.html -r rules.xml content.html
&lt;/pre&gt;
&lt;/div&gt;
&lt;div class="section" id="diazo-template-loader"&gt;
&lt;h3&gt;Diazo - Template Loader&lt;/h3&gt;
&lt;p&gt;We can use Diazo in few ways. One of them is in Plone. When using in Plone, we have to include plone.app.theming package in Plone buildout configuration file. Then register Diazo folder in configure.zcml file.&lt;/p&gt;
&lt;pre class="code xml literal-block"&gt;
&lt;span class="nt"&gt;&amp;lt;configure&lt;/span&gt;
    &lt;span class="na"&gt;xmlns=&lt;/span&gt;&lt;span class="s"&gt;"http://namespaces.zope.org/zope"&lt;/span&gt;
    &lt;span class="na"&gt;xmlns:i18n=&lt;/span&gt;&lt;span class="s"&gt;"http://namespaces.zope.org/i18n"&lt;/span&gt;
    &lt;span class="na"&gt;xmlns:plone=&lt;/span&gt;&lt;span class="s"&gt;"http://namespaces.plone.org/plone"&lt;/span&gt;
    &lt;span class="na"&gt;i18n_domain=&lt;/span&gt;&lt;span class="s"&gt;"plonetheme.custom"&lt;/span&gt;&lt;span class="nt"&gt;&amp;gt;&lt;/span&gt;

   &lt;span class="c"&gt;&amp;lt;!-- Register the /++theme++plonetheme.custom/ static resource directory --&amp;gt;&lt;/span&gt;
    &lt;span class="nt"&gt;&amp;lt;plone:static&lt;/span&gt; &lt;span class="na"&gt;directory=&lt;/span&gt;&lt;span class="s"&gt;"static"&lt;/span&gt; &lt;span class="na"&gt;type=&lt;/span&gt;&lt;span class="s"&gt;"theme"&lt;/span&gt; &lt;span class="nt"&gt;/&amp;gt;&lt;/span&gt;

&lt;span class="nt"&gt;&amp;lt;/configure&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="mako"&gt;
&lt;h2&gt;Mako&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;is an embedded Python (i.e. Python Server Page) language&lt;/li&gt;
&lt;li&gt;text based template language&lt;/li&gt;
&lt;li&gt;compiles down to the python bytecode&lt;/li&gt;
&lt;li&gt;function/macros&lt;/li&gt;
&lt;li&gt;control structures constructed from real Python code (i.e. loops, conditionals)&lt;/li&gt;
&lt;li&gt;straight Python blocks, inline or at the module-level&lt;/li&gt;
&lt;/ul&gt;&lt;div class="section" id="mako-template-syntax"&gt;
&lt;h3&gt;Mako - Template Syntax&lt;/h3&gt;
&lt;pre class="code mako literal-block"&gt;
&lt;span class="cp"&gt;&amp;lt;%&lt;/span&gt;&lt;span class="nb"&gt;inherit&lt;/span&gt; &lt;span class="na"&gt;file=&lt;/span&gt;&lt;span class="s"&gt;"base.html"&lt;/span&gt;&lt;span class="cp"&gt;/&amp;gt;&lt;/span&gt;&lt;span class="x"&gt;
&lt;/span&gt;&lt;span class="cp"&gt;&amp;lt;%&lt;/span&gt;
    &lt;span class="n"&gt;rows&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[[&lt;/span&gt;&lt;span class="n"&gt;v&lt;/span&gt; &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="n"&gt;v&lt;/span&gt; &lt;span class="ow"&gt;in&lt;/span&gt; &lt;span class="nb"&gt;range&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;)]&lt;/span&gt; &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="n"&gt;row&lt;/span&gt; &lt;span class="ow"&gt;in&lt;/span&gt; &lt;span class="nb"&gt;range&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;)]&lt;/span&gt;
&lt;span class="cp"&gt;%&amp;gt;&lt;/span&gt;&lt;span class="x"&gt;
&amp;lt;table&amp;gt;
&lt;/span&gt;    &lt;span class="cp"&gt;%&lt;/span&gt; &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="n"&gt;row&lt;/span&gt; &lt;span class="ow"&gt;in&lt;/span&gt; &lt;span class="n"&gt;rows&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="x"&gt;
        &lt;/span&gt;&lt;span class="cp"&gt;${&lt;/span&gt;&lt;span class="n"&gt;makerow&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;row&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;&lt;span class="cp"&gt;}&lt;/span&gt;
    &lt;span class="cp"&gt;%&lt;/span&gt;&lt;span class="k"&gt; endfor&lt;/span&gt;&lt;span class="x"&gt;
&amp;lt;/table&amp;gt;
&lt;/span&gt;&lt;span class="cp"&gt;## this is a comment.&lt;/span&gt;&lt;span class="x"&gt;
&lt;/span&gt;&lt;span class="cp"&gt;&amp;lt;%&lt;/span&gt;&lt;span class="nb"&gt;def&lt;/span&gt; &lt;span class="na"&gt;name=&lt;/span&gt;&lt;span class="s"&gt;"makerow(row)"&lt;/span&gt;&lt;span class="cp"&gt;&amp;gt;&lt;/span&gt;&lt;span class="x"&gt;
    &amp;lt;tr&amp;gt;
&lt;/span&gt;    &lt;span class="cp"&gt;%&lt;/span&gt; &lt;span class="k"&gt;for&lt;/span&gt; &lt;span class="n"&gt;name&lt;/span&gt; &lt;span class="ow"&gt;in&lt;/span&gt; &lt;span class="n"&gt;row&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="x"&gt;
        &amp;lt;td&amp;gt;&lt;/span&gt;&lt;span class="cp"&gt;${&lt;/span&gt;&lt;span class="n"&gt;name&lt;/span&gt;&lt;span class="cp"&gt;}&lt;/span&gt;&lt;span class="x"&gt;&amp;lt;/td&amp;gt;
&lt;/span&gt;    &lt;span class="cp"&gt;%&lt;/span&gt;&lt;span class="k"&gt; endfor&lt;/span&gt;&lt;span class="x"&gt;
    &amp;lt;/tr&amp;gt;
&lt;/span&gt;&lt;span class="cp"&gt;&amp;lt;/%&lt;/span&gt;&lt;span class="nb"&gt;def&lt;/span&gt;&lt;span class="cp"&gt;&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;div class="section" id="mako-control-structures"&gt;
&lt;h4&gt;Mako - Control Structures&lt;/h4&gt;
&lt;p&gt;A control structure refers to all those things that control the flow of a program &amp;#8211; conditionals (i.e. if/else), loops (like while and for), as well as things like try/except. In Mako, control structures are written using the % marker followed by a regular Python control expression, and are &amp;#8220;closed&amp;#8221; by using another % marker with the tag &amp;#8220;end&amp;lt;name&amp;gt;&amp;#8221;, where &amp;#8220;&amp;lt;name&amp;gt;&amp;#8221; is the keyword of the expression&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="mako-def-tag"&gt;
&lt;h4&gt;Mako - Def Tag&lt;/h4&gt;
&lt;p&gt;The %def tag defines a Python function which contains a set of content, that can be called at some other point in the template.
The %def tag is a lot more powerful than a plain Python def, as the Mako compiler provides many extra services with %def that you wouldn&amp;#8217;t normally have, such as the ability to export defs as template &amp;#8220;methods&amp;#8221;, automatic propagation of the current Context, buffering / filtering / caching flags, and def calls with content, which enable packages of defs to be sent as arguments to other def calls (not as hard as it sounds).&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="mako-inherit-tag"&gt;
&lt;h4&gt;Mako - Inherit Tag&lt;/h4&gt;
&lt;p&gt;Inherit allows templates to arrange themselves in inheritance chains. This is a concept familiar in many other template languages. When using the %inherit tag, control is passed to the topmost inherited template first, which then decides how to handle calling areas of content from its inheriting templates. Mako offers a lot of flexibility in this area, including dynamic inheritance, content wrapping, and polymorphic method calls.&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="mako-python-blocks"&gt;
&lt;h4&gt;Mako - Python Blocks&lt;/h4&gt;
&lt;p&gt;Any arbitrary block of python can be dropped in using the &amp;lt;% %&amp;gt; tags. Within &amp;lt;% %&amp;gt;, you&amp;#8217;re writing a regular block of Python code. While the code can appear with an arbitrary level of
preceding whitespace, it has to be consistently formatted with itself. Mako&amp;#8217;s compiler will adjust the block of Python to be consistent with the surrounding generated Python code.&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="mako-module-level-blocks"&gt;
&lt;h3&gt;Mako - Module-level Blocks&lt;/h3&gt;
&lt;pre class="code mako literal-block"&gt;
&lt;span class="cp"&gt;&amp;lt;%!&lt;/span&gt;
    &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="nn"&gt;mylib&lt;/span&gt;
    &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="nn"&gt;re&lt;/span&gt;

    &lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;filter&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;text&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="n"&gt;re&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;sub&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;r'^@'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s"&gt;''&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;text&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="cp"&gt;%&amp;gt;&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;A variant on &amp;lt;% %&amp;gt; is the module-level code block, denoted by &amp;lt;%! %&amp;gt;. Code within these tags is executed at the module level of the template, and not within the rendering function of the template. Therefore, this code does not have access to the template&amp;#8217;s context and is only executed when the template is loaded into memory (which can be only once per application, or more, depending on the runtime environment). Use the &amp;lt;%! %&amp;gt; tags to declare your template&amp;#8217;s imports, as well as any pure-Python functions you might want to declare:&lt;/p&gt;
&lt;p&gt;Any number of &amp;lt;%! %&amp;gt; blocks can be declared anywhere in a template; they will be rendered in the resulting module in a single contiguous block above all render callables, in the order in which they appear in the source template.&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="mako-template-loader"&gt;
&lt;h3&gt;Mako - Template Loader&lt;/h3&gt;
&lt;p&gt;A Template can also load its template source code from a file, using the filename keyword argument:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;mako.template&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;Template&lt;/span&gt;
&lt;span class="n"&gt;mytemplate&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;Template&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;filename&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s"&gt;'/docs/mytmpl.txt'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="k"&gt;print&lt;/span&gt; &lt;span class="n"&gt;mytemplate&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;render&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;For improved performance, a Template which is loaded from a file can also cache the source code to its generated module on the filesystem as a regular Python module file (i.e. a .py file). To do this, just add the module_directory argument to the template:&lt;/p&gt;
&lt;pre class="code python literal-block"&gt;
&lt;span class="kn"&gt;from&lt;/span&gt; &lt;span class="nn"&gt;mako.template&lt;/span&gt; &lt;span class="kn"&gt;import&lt;/span&gt; &lt;span class="n"&gt;Template&lt;/span&gt;
&lt;span class="n"&gt;mytemplate&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="n"&gt;Template&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;filename&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s"&gt;'/docs/mytmpl.txt'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;module_directory&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s"&gt;'/tmp/mako_modules'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="k"&gt;print&lt;/span&gt; &lt;span class="n"&gt;mytemplate&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="n"&gt;render&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
&lt;/pre&gt;
&lt;p&gt;When the above code is rendered, a file /tmp/mako_modules/docs/mytmpl.txt.py is created containing the source code for the module. The next time a Template with the same arguments is created, this module file will be automatically re-used.&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="section" id="summary"&gt;
&lt;h2&gt;Summary&lt;/h2&gt;
&lt;p&gt;I would like to apologize that the title is a bit misleading. There is no battle in the round that one of web template will win. Everyone is a winner I believe every single web templates have their own place in this market. They have their own unique feature that stand out from the rest. Some influence from other templates. Everyone learn from each other. After all, all is open source. Do you think they should combine into one standard Python web templating? We can see there are lots of similarity of each of them. Some web frameworks are supporting to have more than one web templating?&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="discussion-question-and-answer"&gt;
&lt;h2&gt;Discussion / Question and Answer&lt;/h2&gt;
&lt;p&gt;Any questions from the floor? Do you guys have any bad experience on any of the web templating to share?&lt;/p&gt;
&lt;/div&gt;
&lt;div class="section" id="thank-you"&gt;
&lt;h2&gt;Thank You&lt;/h2&gt;
&lt;p&gt;Thank you everyone that are coming to this talk.&lt;/p&gt;
&lt;iframe width="425" height="344" src="http://www.youtube.com/embed/eZ6mC5-Dz4w?rel=0&amp;amp;hd=1&amp;amp;wmode=transparent"&gt;
&lt;/iframe&gt;
&lt;/div&gt;
&lt;div class="section" id="reference"&gt;
&lt;h2&gt;Reference&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;&lt;a class="reference external" href="https://speakerdeck.com/u/ivanteoh/p/python-web-templating-battle"&gt;Slide of this talk&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://www.youtube.com/watch?v=eZ6mC5-Dz4w"&gt;Video&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://docs.diazo.org/"&gt;Diazo&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="https://developer.mozilla.org/en-US/docs/XSLT"&gt;Extensible Stylesheet Language Transformations or XSLT&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://wiki.zope.org/ZPT/TAL/"&gt;Template Attribute Language or TAL&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://chameleon.repoze.org/"&gt;Chameleon&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://www.djangoproject.com/"&gt;Django Template Language&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://jinja.pocoo.org/"&gt;Jinja2&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://www.makotemplates.org/"&gt;Mako&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://pypi.python.org/pypi/zope.pagetemplate"&gt;Zope Page Templates&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://pydanny.blogspot.com.au/2010/12/stupid-template-languages.html)"&gt;Stupid Template Languages&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://blog.penzilla.net/2010/02/python-template-language-performance.html"&gt;Python template language performance (Chameleon is cool!)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://rhodesmill.org/brandon/static/2008/grok-walk-duck.pdf"&gt;Using Grok to Walk Like a Duck&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://www.simple-is-better.org/template/"&gt;Template Engines&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://www.kuwata-lab.com/tenjin/"&gt;Tenjin&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/8LtzSd1wDZo" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/188-python-web-templating-battle.html</guid><pubDate>Sat, 18 Aug 2012 11:40:34 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/188-python-web-templating-battle.html</feedburner:origLink></item><item><title>Setup Python Development Environment on Mountain Lion</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/-KRev93wHHo/187-setup-python-development-environment-on-mountain-lion.html</link><description>&lt;p&gt;By default, Mac OS X Mountain Lion comes with Python 2.7 same as Mac OS X Lion. So far, I am facing some glitches on setup Python development environment on Mac OS X Mountain Lion as below:&lt;/p&gt;
&lt;ul class="simple"&gt;&lt;li&gt;Running 'brew doctor' warns us that 'X11 is not installed', when I was using &lt;a class="reference external" href="http://mxcl.github.com/homebrew/"&gt;Homebew&lt;/a&gt;. Mac OS X Mountain Lion is not supporting X11 app and Xgrid.&lt;/li&gt;
&lt;li&gt;Need to install 'Command line tools for Xcode' from &lt;a class="reference external" href="https://developer.apple.com/downloads/"&gt;Apple Developer&lt;/a&gt; after &lt;a class="reference external" href="https://developer.apple.com/xcode/"&gt;Xcode&lt;/a&gt; installed. Installing 'Command line tools' from &lt;a class="reference external" href="https://developer.apple.com/xcode/"&gt;Xcode&lt;/a&gt; preference does not work for me. I was facing this problem while running &lt;a class="reference external" href="http://www.virtualenv.org/"&gt;virtualenv&lt;/a&gt;.&lt;/li&gt;
&lt;/ul&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/-KRev93wHHo" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/187-setup-python-development-environment-on-mountain-lion.html</guid><pubDate>Wed, 01 Aug 2012 20:41:33 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/187-setup-python-development-environment-on-mountain-lion.html</feedburner:origLink></item><item><title>Upgrading to Mountain Lion Experience</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/7oXykTrNnUY/1186-upgrading-to-mountain-lion-experience.html</link><description>&lt;p&gt;It wasn't good experience on upgrading Mac OS X to Mountain Lion comparing to upgrading to Lion. After downloading the operating system, double clicking the installer, 'Install OS X Mountain Lion', and waiting for restarting the system, the error message occurred. Upgrading failed. I also tried the clean installation. It also failed. 'There was a problem installing Mac OS X. Try reinstalling.' was the last error message. The final solution that works for me is resetting my Mac's PRAM and NVRAM.&lt;/p&gt;
&lt;div class="section" id="references"&gt;
&lt;h2&gt;References&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;&lt;a class="reference external" href="http://apple.stackexchange.com/questions/57811/mountain-lion-installer-doesnt-start-after-reboot"&gt;Mountain Lion installer doesnt start after reboot&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://support.apple.com/kb/HT1379"&gt;Resetting your Mac's PRAM and NVRAM&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/7oXykTrNnUY" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/1186-upgrading-to-mountain-lion-experience.html</guid><pubDate>Tue, 31 Jul 2012 22:20:25 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/1186-upgrading-to-mountain-lion-experience.html</feedburner:origLink></item><item><title>Cooking: Vegetarian Miso Noodle Soup</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/Q9Cw58SeWPg/185-cooking-vegetarian-miso-noodle-soup.html</link><description>&lt;p&gt;Overdose with miso. We are having something light tonight, vegetarian miso noodle soup.&lt;/p&gt;
&lt;p&gt;Ingredients:&lt;/p&gt;
&lt;ul class="simple"&gt;&lt;li&gt;tofu&lt;/li&gt;
&lt;li&gt;button mushroom&lt;/li&gt;
&lt;li&gt;wakame Seaweed&lt;/li&gt;
&lt;li&gt;baby bok choy&lt;/li&gt;
&lt;li&gt;fish stock or dashi soup stock&lt;/li&gt;
&lt;li&gt;red or white miso paste&lt;/li&gt;
&lt;li&gt;noodle&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Method:&lt;/p&gt;
&lt;ol class="arabic simple"&gt;&lt;li&gt;Bring the water to boil.&lt;/li&gt;
&lt;li&gt;Add in all the vegetables into the water.&lt;/li&gt;
&lt;li&gt;Add fish stock or dashi soup stock.&lt;/li&gt;
&lt;li&gt;Add miso paste and dissolve well.&lt;/li&gt;
&lt;li&gt;Turn off the heat just before water begins to boil again.&lt;/li&gt;
&lt;li&gt;Serve with noodle.&lt;/li&gt;
&lt;/ol&gt;&lt;div class="section" id="gallery"&gt;
&lt;h2&gt;Gallery&lt;/h2&gt;
&lt;ul class="thumbnails simple"&gt;&lt;li&gt;&lt;a class="reference external" href="/galleries/20120700/p185-1.jpg"&gt;&lt;img alt="soup" src="/galleries/20120700/p185-1.thumbnail.jpg"&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;
&lt;div class="section" id="references"&gt;
&lt;h2&gt;References&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;&lt;a class="reference external" href="http://en.wikipedia.org/wiki/Miso"&gt;Miso&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://en.wikipedia.org/wiki/Dashi"&gt;Dashi&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://en.wikipedia.org/wiki/Wakame"&gt;Wakame&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/Q9Cw58SeWPg" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/185-cooking-vegetarian-miso-noodle-soup.html</guid><pubDate>Sun, 22 Jul 2012 20:19:06 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/185-cooking-vegetarian-miso-noodle-soup.html</feedburner:origLink></item><item><title>Nexus 7: Unlock Screen Rotation</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/X7MwoI49_Ho/184-nexus-7-unlock-screen-rotation.html</link><description>&lt;p&gt;Screen rotation is locked by default in &lt;a class="reference external" href="http://http://www.google.com/nexus/#/7/"&gt;Nexus 7&lt;/a&gt;. It took a night to notice the icon. Well, I am still new to &lt;a class="reference external" href="http://www.android.com/"&gt;Google Android&lt;/a&gt;. I am not sure whether it is &lt;a class="reference external" href="http://www.android.com/about/jelly-bean/"&gt;Android 4.1, Jelly Bean&lt;/a&gt; default behaviour. After swiping the screen from top, you will see the tiny rotate icon with a lock next the time / date. Clicking that icon will toggle between lock screen rotation or auto screen rotation.&lt;/p&gt;
&lt;div class="section" id="gallery"&gt;
&lt;h2&gt;Gallery&lt;/h2&gt;
&lt;ul class="thumbnails simple"&gt;&lt;li&gt;&lt;a class="reference external" href="/galleries/20120700/p184-1.jpg"&gt;&lt;img alt="lock" src="/galleries/20120700/p184-1.thumbnail.jpg"&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="/galleries/20120700/p184-2.jpg"&gt;&lt;img alt="unlock" src="/galleries/20120700/p184-2.thumbnail.jpg"&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;
&lt;div class="section" id="references"&gt;
&lt;h2&gt;References&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;&lt;a class="reference external" href="http://http://www.google.com/nexus/#/7/"&gt;Nexus 7&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://www.android.com/"&gt;Google Android&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a class="reference external" href="http://www.android.com/about/jelly-bean/"&gt;Android 4.1, Jelly Bean&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/X7MwoI49_Ho" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/184-nexus-7-unlock-screen-rotation.html</guid><pubDate>Fri, 20 Jul 2012 06:11:47 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/184-nexus-7-unlock-screen-rotation.html</feedburner:origLink></item><item><title>Cooking: Stir-fried Eggplant with Miso</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/GPPDEw5udAs/183-cooking-stir-fried-eggplant-with-miso.html</link><description>&lt;p&gt;Maruyu Yumehiroba or Maruyu City Supermarket is my favourite Japanese shop in Sydney. Ground floor is Japanese food section. On the other hand, everything is AU$2.50 at first shop. Mainly are household, gift and toiletries. It is small but full of gems. One of them is free Japanese food recipe. I got few of them few days ago. Today I decided to try stir-fried eggplant with miso.&lt;/p&gt;
&lt;p&gt;Ingredients (4 Serve):&lt;/p&gt;
&lt;ul class="simple"&gt;&lt;li&gt;3 small eggplants (750g total)&lt;/li&gt;
&lt;li&gt;3 tablespoons of miso paste&lt;/li&gt;
&lt;li&gt;1 1/2 tablespoon of mirin&lt;/li&gt;
&lt;li&gt;1 1/2 tablespoon of sugar&lt;/li&gt;
&lt;li&gt;2 tablespoons of vegetable oil&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Method:&lt;/p&gt;
&lt;ol class="arabic simple"&gt;&lt;li&gt;Cut eggplants into bites size and soak them in a bowl of water for 10 mins and drain. Dried with paper towels.&lt;/li&gt;
&lt;li&gt;Mix miso, mirin, and sugar in a small bowl and set aside. (I use red miso).&lt;/li&gt;
&lt;li&gt;Heat oil in a medium skillet and fried eggplant on medium heat until softened, then turn down the heat to low.&lt;/li&gt;
&lt;li&gt;Add miso mixture and stir with the ingredient quickly then turn off the heat.&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;It tastes nice. Go and check out both the recipes and shop.&lt;/p&gt;
&lt;div class="section" id="gallery"&gt;
&lt;h2&gt;Gallery&lt;/h2&gt;
&lt;ul class="thumbnails simple"&gt;&lt;li&gt;&lt;a class="reference external" href="/galleries/20120700/p183-1.jpg"&gt;&lt;img alt="eggplant" src="/galleries/20120700/p183-1.thumbnail.jpg"&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;
&lt;div class="section" id="references"&gt;
&lt;h2&gt;References&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;&lt;a class="reference external" href="http://www.au.timeout.com/sydney/shopping/venues/3676/maruyu-city-supermarket"&gt;Maruyu Yumehiroba&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/GPPDEw5udAs" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/183-cooking-stir-fried-eggplant-with-miso.html</guid><pubDate>Thu, 19 Jul 2012 21:23:42 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/183-cooking-stir-fried-eggplant-with-miso.html</feedburner:origLink></item><item><title>My First Tablet: Nexus 7</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/-jSXbaQSGYE/182-my-first-tablet-nexus-7.html</link><description>&lt;p&gt;No embarrassing unboxing video. Just my thought on my first tablet - &lt;a class="reference external" href="http://http://www.google.com/nexus/#/7/"&gt;Nexus 7&lt;/a&gt;. I got an notice the device is shipped on 17 July and expected to arrive on 19 July, which is today. I got it this afternoon. It comes with a very tight cover box. It took me awhile to see what is inside the box.&lt;/p&gt;
&lt;p&gt;What&amp;#8217;s in the box:&lt;/p&gt;
&lt;ul class="simple"&gt;&lt;li&gt;nexus 7&lt;/li&gt;
&lt;li&gt;warranty booklet&lt;/li&gt;
&lt;li&gt;quick start guide&lt;/li&gt;
&lt;li&gt;usb charging unit with Australian plug&lt;/li&gt;
&lt;li&gt;micro usb cable&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Beside AU$25, it comes with preloaded contents in my library:&lt;/p&gt;
&lt;ul class="simple"&gt;&lt;li&gt;Transformers: Dark of the Moon (movie)&lt;/li&gt;
&lt;li&gt;Nexus 7 Guidebook by Google Inc. (ebook)&lt;/li&gt;
&lt;li&gt;Wonderful Stories for Children by Hans Christian Andersen (ebook)&lt;/li&gt;
&lt;li&gt;Frankenstein, or, The Modern Prometheus by Mary Wollstonecraft Shelley (ebook)&lt;/li&gt;
&lt;li&gt;Bleak House by Charles Dickens (ebook)&lt;/li&gt;
&lt;li&gt;The Drop by Michael Connelly (ebook)&lt;/li&gt;
&lt;li&gt;Pride and Prejudice by Jane Austen (ebook)&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Most of the reviews, that I read, commented that this tablet is super fast and best value among all the 7 inch tablet in the market right now. 16G version costs me AU$299 plus AU$19.99 shipping cost. I can see the animation transition is smooth, with very bright screen. All the google products work really well on this device. I particularly like the voice search. Yet to try the NFC feature.&lt;/p&gt;
&lt;p&gt;Excitement didn&amp;#8217;t last long. It is much heavier than I thought. For this price, I am not complain when the device only have 1.2MP front-facing camera, support wifi and bluetooth. After entering &lt;a class="reference external" href="http://play.google.com/"&gt;Google Play&lt;/a&gt;, most of the time I see this message, &amp;#8216;Your device isn&amp;#8217;t compatible with this version.&amp;#8217;, which means I can&amp;#8217;t install most of the Android applications yet on this device. I am frustrated that I can&amp;#8217;t rotate &lt;a class="reference external" href="http://www.google.com/chrome/"&gt;Google Chrome&lt;/a&gt;. No landscape for &lt;a class="reference external" href="http://www.google.com/chrome/"&gt;Google Chrome&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;Summary, this device will become my needy toys when I need to check something quickly on internet, by talking to him.&lt;/p&gt;
&lt;div class="section" id="gallery"&gt;
&lt;h2&gt;Gallery&lt;/h2&gt;
&lt;ul class="thumbnails simple"&gt;&lt;li&gt;&lt;a class="reference external" href="/galleries/20120700/p182-1.jpg"&gt;&lt;img alt="nexus7" src="/galleries/20120700/p182-1.thumbnail.jpg"&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;
&lt;div class="section" id="references"&gt;
&lt;h2&gt;References&lt;/h2&gt;
&lt;ul class="simple"&gt;&lt;li&gt;&lt;a class="reference external" href="http://http://www.google.com/nexus/#/7/"&gt;Nexus 7&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;
&lt;div class="section" id="updates-20-jul-2012"&gt;
&lt;h2&gt;Updates: 20 Jul 2012&lt;/h2&gt;
&lt;p&gt;I was wrong. I can rotate Google Chrome, by &lt;a class="reference external" href="/posts/184-nexus-7-unlock-screen-rotation.html"&gt;unlock the screen rotation&lt;/a&gt;.&lt;/p&gt;
&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/-jSXbaQSGYE" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/182-my-first-tablet-nexus-7.html</guid><pubDate>Thu, 19 Jul 2012 19:30:00 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/182-my-first-tablet-nexus-7.html</feedburner:origLink></item><item><title>Back to Basic</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/3qfpJoVtRwY/181-back-to-basic.html</link><description>&lt;a class="reference external" href="http://wordpress.org/"&gt;WordPress&lt;/a&gt;, to static website using site generator, &lt;a class="reference external" href="http://nikola.ralsina.com.ar/"&gt;Nikola&lt;/a&gt; almost comes to the end. Just a few things for tidying up. Not say that &lt;a class="reference external" href="http://wordpress.org/"&gt;WordPress&lt;/a&gt; not good. It always my first choice of blogging platform that used Php. Now, I want something really simple and using language that I using daily basic, &lt;a class="reference external" href="http://www.python.org/"&gt;Python&lt;/a&gt;. &lt;a class="reference external" href="http://nikola.ralsina.com.ar/"&gt;Nikola&lt;/a&gt; is written in &lt;a class="reference external" href="http://www.python.org/"&gt;Python&lt;/a&gt; and has features that I need. If you like this site, give it a try.&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/3qfpJoVtRwY" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/181-back-to-basic.html</guid><pubDate>Wed, 18 Jul 2012 21:55:51 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/181-back-to-basic.html</feedburner:origLink></item><item><title>In Progress</title><link>http://feedproxy.google.com/~r/IvanTeoh/~3/XdpSGk8jEIc/180-in-progress.html</link><description>&lt;p&gt;I am working on converting my personal site from &lt;a class="reference external" href="http://wordpress.org/"&gt;WordPress&lt;/a&gt; to static website using &lt;a class="reference external" href="http://nikola.ralsina.com.ar/"&gt;Nikola&lt;/a&gt;, static website and blog generator in &lt;a class="reference external" href="http://www.python.org/"&gt;Python&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;Meanwhile, you still can visit old site that still using &lt;a class="reference external" href="http://wordpress.org/"&gt;WordPress&lt;/a&gt; until the completion of conversion.&lt;/p&gt;
&lt;div class="section" id="updates-18-jul-2012"&gt;
&lt;h2&gt;Updates: 18 Jul 2012&lt;/h2&gt;
&lt;p&gt;Conversion completed. Now, the old site is closed.&lt;/p&gt;
&lt;/div&gt;&lt;img src="http://feeds.feedburner.com/~r/IvanTeoh/~4/XdpSGk8jEIc" height="1" width="1"/&gt;</description><guid isPermaLink="false">http://ivanteoh.com/posts/180-in-progress.html</guid><pubDate>Sun, 17 Jun 2012 18:23:01 GMT</pubDate><feedburner:origLink>http://ivanteoh.com/posts/180-in-progress.html</feedburner:origLink></item></channel></rss>
