Mehrfaches Einbinden von Bausteinen

Lesezeit 6 min

Die Templates sind so gestaltet, dass jeder Baustein bei Bedarf nicht nur mehrfach genutzt werden kann, sondern auch einen eigenen relativ einfach erstellt werden kann. Wie das geht, kläre ich in diesem Artikel.

Bestehenden Baustein mehrfach einbinden

Nehmen wir an, du möchtest den USP-Bereich auch im Footer angezeigt haben.

Der USP-Bereich wird standardmäßig nur auf der Startseite angezeigt. Dafür ist die Vorlage „/page/index.tpl“ verantwortlich. Diese schauen wir uns etwas genauer an:

{get_navigation_full linkgroupIdentifier='templateUSP' assign='Actioncontainer'}
{if isset($Actioncontainer)}
<section class="panel panel-default actions wow bounceInDown animated">
    <div class="row">
    {foreach name=tplAction from=$Actioncontainer->Links item=Link}
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="wrap">
                {get_cms_content kLink=$Link->kLink}
            </div>
        </div>
    {/foreach}
    </div>    
</section>
{/if}

Was ist zu tun?

Als Erstes, da wir diesen Baustein mehrfach verwenden möchten, empfielt es sich ihn in eine Extra-Datei auszulagern.

  1. Erstelle im Child-Template unter /snippets/ eine neue Datei namens „usp.tpl„. Fall es den Ordner „snippets“ noch nicht gibt, erstelle einen.
  2. Packe den Inhalt, welcher weiter oben aufgeführt ist, in die Datei und speichere sie ab.

Jetzt haben wir den USP-Bereich in eine Datei ausgelagert, die sich relativ einfach über include einbinden lässt. Nachfolgend ein Beispiel anhand des Footers:

Footer um den USP-Bereich erweitern

Ich füge den USP-Bereich direkt nach der Newsletter-Leiste, so, dass dieser zwischen dem Newsletter und „Über uns“-Zeile zu sehen ist.

  1. Öffne die Vorlage „/layout/footer.tpl“ in deinem Child-Template.
  2. Füge nach der Zeile mit {extends …} diese Zeile ein:
{block name="footer-teaser"}
    {include file='snippets/usp.tpl'}
    {$smarty.block.parent}
{/block}

Da den USP-Bereich direkt nach „.row“ eingefügt ist, muss unsere Anweisung um eine Spalte (Grid-System) erweitert werden. Ich ergänze unser Code weiter oben, wie folgt:

{block name="footer-teaser"}
    <div class="col-xs-12">
        {include file='snippets/usp.tpl'}
    </div>
    {$smarty.block.parent}
{/block}

Das Ergebnis sieht jetzt, wie folgt aus:

An weiteren Stellen einbinden

Du kannst den USP-Bereich per include-Befehl überall einbinden, wo du ihn hinhaben möchtest. Achte allerdings darauf, dass alle Anpassungen nur im Child-Ordner zu machen sind.

{include file='snippets/usp.tpl'}

Wie kann ich einen weiteren Bereich einrichten?

  1. Erstelle im Shopbackend unter <Inhalte <Eigene Seiten> eine neue Linkgruppe z.B. „Produktdetails„.
  2. Erstelle in der Gruppe eine neue Seite z.B. „Vorteile„.

Der Templatename ist der Name welcher im Template später zur Identifikation benötigt wird. Bitte hier keine Leerzeichen oder Sonderzeichen verwenden.

Wir gehen wieder wie oben vor und erstellen eine neue Dateivorlage „cms_inhalt.tpl„. Die Vorlage legen wir im Child-Template, im Verzeichnis /snippets ab.

Der Inhalt der Vorlage sieht wie folgt aus:

{if isset($Identifier)}
    {get_navigation_full linkgroupIdentifier=$Identifier assign='Actioncontainer'}
    {if isset($Actioncontainer)}
        {foreach name=tplAction from=$Actioncontainer->Links item=Link}
            {get_cms_content kLink=$Link->kLink}
        {/foreach}
    {/if}
{/if}

Jetzt können wir unsere Vorlage im Template einbinden und den Namen der Linkgruppe an die Datei  übergeben:

{include file='snippets/cms_inhalt.tpl' Identifier='Produktdetails'}

Ausgegeben werden uns die Inhalte der Linkgruppe „Produktdetails„.