From 2bcc840b959462523e78be6bf89ef0bbd8050fd6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yi=C4=9Fit=20FINDIKLI?= <yigitfindikli@gmail.com>
Date: Tue, 20 Apr 2021 11:58:32 +0300
Subject: [PATCH] Doc for #10137

---
 src/app/showcase/components/tree/treedemo.html | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/src/app/showcase/components/tree/treedemo.html b/src/app/showcase/components/tree/treedemo.html
index a495c5abf5b..5d70db7c6a3 100644
--- a/src/app/showcase/components/tree/treedemo.html
+++ b/src/app/showcase/components/tree/treedemo.html
@@ -331,6 +331,18 @@ <h5>Icons</h5>
             <p>Icon of a treenode is defined using the icon property, if you need an icon depending on the expand or collapse state, use
                 <i>expandedIcon</i> and <i>collapsedIcon</i> instead.</p>
 
+            <h5>Sections</h5>
+            <p>Header and Footers sections can be customized using <i>header</i> and <i>footer</i> templates.</p>
+<app-code lang="markup" ngNonBindable ngPreserveWhitespaces>
+&lt;p-tree [value]="files"&gt;
+    &lt;ng-template pTemplate="header"&gt;
+        Header Content
+    &lt;/ng-template&gt;
+    &lt;ng-template pTemplate="footer"&gt;
+        Footer Content
+    &lt;/ng-template&gt;
+&lt;/p-tree&gt;
+</app-code>
             <h5>Templating</h5>
             <p>By default label of a treenode is displayed inside a tree node, in case you need to place custom content define a pTemplate that gets
                 the treenode as an implicit variable. Example below places an input field to create editable treenodes.</p>