Tip: using before and after to output mark-up wrapping a repeating region

The perch:before and perch:after tags can be included in your templates and used to add mark-up to the page that will be displayed before and after the perch content.

In the below example the content in perch:before and perch:after would only show if a concert had been added for this region:

<perch:before>
<h2>Upcoming concerts</h2>
</perch:before>
<h3><perch:content id="concert_title" label="Title" type="text" /></h3>
<perch:content id="Summary" label="Summary" type="textarea" />
<perch:after>
<p><a href="/concerts">Concerts for 2012</a>.</p>
</perch:after>

These tags become very useful if you have repeated regions in your page. For example you might want to enable the user to add content to a list, you can use perch:before and perch:after to only show the opening and closing list elements if an item, or more than one item has been added to the list.

perch:before will always output before the first item in the region and perch:after will output after the last item.

<perch:before>
<ul>
</perch:before>
<li><h3><perch:content id="concert_title" label="Title" type="text" /></h3>
<perch:content id="Summary" label="Summary" type="textarea" /></li>
<perch:after>
</ul>
</perch:after>

Documentation for perch:before and perch:after