Added more examples for user task placeholders

Author: jjoderis

content/developer/bpmn/bpmn-user-tasks.mdx

@@ -199,8 +199,9 @@ the User Task.
 
 For this, the HTML Code of the User Task must make use of placeholders to access and use process variables.
 It is easy and keeps templates readable by limiting tags to variables and
-statements ("for" and "if"). Usually you only
-need {% %} for accessing the desired variable.
+statements ("for" and "if").
+
+Usually you only need `\{%[variable-name]%\}` for accessing the desired variable.
 
 In this example, the variables `firstname` and `surname` are shown inside this
 User Task
@@ -221,6 +222,103 @@ User Task
 This is what is shown in the tasklist of the engine when encountering the User Task `Show full name`:
 ![User Task in Tasklist](/images/tasklist/show-variables.png)
 
+For more complex object types variables of the form `{ [attribute-name]: [attribute-value], ... }` subscripts can be used to access nested values.
+To do that use a placeholder of the form:
+\
+`\{%[variable-name].[attribute-name]%\}`
+
+In this example the entry `name` of the variable `user` which has the value `{ name: 'Max Mustermann' }` is shown inside the user task.
+The ouput is the same as for the previous example.
+
+```
+<form class="form">
+  <div id="i3jcu">
+  <b id="i4m1">Hello, {%user.name%}!
+  </b>
+  </div>
+  <img id="inmmd" src="https://cdn.pixabay.com/photo/2015/07/02/10/40/writing-828911_1280.jpg"/>
+  <div id="if91m">Welcome to this User Task! Just click the Submit button to complete this task!
+  </div>
+  <button type="submit" class="button">Submit</button>
+</form>
+```
+
+For more complex cases if and for statements are supported.
+
+If part of the html should only be shown when a specific variable is true or has a value you can use if statements of the form:
+\
+`\{%if [variable-name]%\}[conditional-part]\{%/if%}`
+
+You can also use comparisons to show parts of the html only if a variable has (or does not have) a specific value:
+\
+`\{%if [variable-name] == '[string-value]'%\}[conditional-part]\{%/if%\}`
+\
+`\{%if [variable-name] != '[string-value]'%\}[conditional-part]\{%/if%\}`
+
+In this example the text `Hello Max!` is shown when the variable `firstname` has the value `Max`.
+Otherwise the text `Welcome` is shown.
+
+```
+<form class="form">
+  <div id="i3jcu">
+    {%if firstname == 'Max'%}Hello Max!{%/if%}
+    {%if firstname != 'Max'%}Welcome{%/if%}
+  </div>
+  <button type="submit" class="button">Submit</button>
+</form>
+```
+
+This is what will be the output html when the value of `firstname` is `Max`.
+
+```
+<form class="form">
+  <div id="i3jcu">
+    Hello Max!
+  </div>
+  <button type="submit" class="button">Submit</button>
+</form>
+```
+
+If a part of the html should shown for every entry in an array typed variable you can use a for statement of the form:
+\
+`\{%for [loop-variable] in [variable-name]%\}[html part]\{%/for%\}`
+
+Inside the loop you can then use `loop-variable` to access the values of the entry.
+
+In this example the variable `users` has the following value:
+
+```
+[
+  { firstname: 'Max', surname: 'Mustermann' },
+  { firstname: 'John', surname: 'Doe' }
+]
+```
+
+The given html is:
+
+```
+<form class="form">
+  <ul>
+    {%for user in users%}
+      <li>{%user.firstname%} {%user.surname%}</li>
+    {%/for%}
+  </ul>
+  <button type="submit" class="button">Submit</button>
+</form>
+```
+
+The resulting html is:
+
+```
+<form class="form">
+  <ul>
+    <li>Max Mustermann</li>
+    <li>John Doe</li>
+  </ul>
+  <button type="submit" class="button">Submit</button>
+</form>
+```
+
 {/*
 
 ## OLD: FROM Alessandro