Tesla CMS Helpdesk

Het is mogelijk om met templating binnen tesla standaar d breadcrums toe te voegen. Dit laten we zien door onderstaande html om te zetten naar een dynamische omgeving.

<ul class="inline-list">
	<li>
		<a href="/home"><img src="/home-icon.png"></a>
	</li>
	<li>
		<a href="/page/" class="">Pagina</a>
	</li>
	<li class="last">
		<a href="/page/subpage/">Sub pagina</a>
	</li>
</ul>

Deze aanpassing willen we uiteraard niet zichtbaar hebben op de home pagina maar wel op alle andere pagina’s. Daarom gaan we eerst naar het bestand waarin we het bovenstaande moeten wijzigen.

We openen de map /root/public/templates/onze_template/content

Omdat we het op alle pagina’s willen hebben behalve in home openen we index.tpl

We plaatsen de volgende code {breadcrumbs=@breadcrumbs.tpl} op de plaats waar we de breadcrumbs verwachten. Laten we een dichter bekijken wat deze code inhoudt.

                {                                             Geeft aan dat het gaat om het begin van een template code

                Breadcrumbs                    Geeft aan dat het om breadcrumbs gaat

                =@                                        Geeft aan dat we 1 element terug verwachten

                Breadcrumbs.tpl             De naam van het bestand waar we de data verder in specificieren

                }                                             Geeft aan dat het gaat om het einde van de template code

We slaan nu ons index.tpl bestandt op.

We navigeren nu naar de map /root/public/templates/onze_template/components/navigation

En maken daar het bestand breadcrumbs.tpl aan.

We openen het bestand breadcrumbs.tpl en vervangen de dynamische herhaalbare elementen met de volgende code {breadcrumbs=list.tpl}. Laten we deze code eens van dichterbij bekijken.

                {                              Geeft aan dat het hier gaat om het begin van een template code

                Breadcrumbs            Geeft aan dat het gaat om de breadcrumbs

                =                             Geeft aan dat we meerdere elementen terug verwachten

                List.tpl                     De naam van het bestand waarin we de verdere data zullen specificeren

                }                              Geeft aan dat het gaat om het einde van een template code

Onze code zal er nu als volgt uit moeten zien

<ul class="inline-list">
	<li>
		<a href="/home"><img src="/home-icon.png"></a>
	</li>
		{breadcrumbs=list.tpl}
</ul>

We slaan het bestand op!

We navigeren nu naar de volgende map /root/public/templates/onze_template/components/navigation/elements/breadcrumbs/

In deze map maken we het bestand list.tpl aan en openen het bestand

We kunnen nu gebruik maken van de volgende codes

                {$label}                De naam van de pagina

                {$url}                   De url van de pagina

                {$last}                  hier komt “last” te staan als het gaat om het laatste element

Onze code zou er dan als volgt uit zien

<li class="{$last}">
	<a href="{$url}">{$label}</a>
</li>

We slaan het bestand op.

Gefeliciteerd u heeft nu de breadcrumbs geimplementeerd.