Magento: (statisch)blok toevoegen aan webshop

Het toevoegen van een extra blok aan een pagina

Vaak is het handig om extra blokken toe te voegen aan de webshop. Bijvoorbeeld voor het weergeven van extra informatie. Links naar leveranciers bijvoorbeeld. Laten we eens gaan kijken hoe dat werkt.

Om te beginnen is het handig om te weten welke blokken al bestaan en waar ze zich bevinden. Dit doe je door de template hints aan te zetten via Systeem –> Configuratie –> Ontwikkelaar –> Store View –> Hints Template pad aanzetten, Bloknamen aan Hints toevoegen.

Het is overigens wel handig om je eigen(publieke) ip-adres even in te vullen als het een live site is. Anders wordt dit voor de hele wereld zichtbaar, en dat wil je natuurlijk niet.

In dit geval willen we een blok Company Links toevoegen, die we als statisch blok gaan aanmaken. Het statische blok krijgt de identifier company-links mee. Deze gaan we straks aanroepen in ons phtml bestand.

We maken een bestand aan met de naam rechts.phtml onder app\design\frontend\default\TEMPLATENAAM\callouts

Hierin zetten we het volgende:

?>
<div class="block block-banner">

    <div class="block-title">
        <strong><span><?php echo $this->__(‘Company Links’) ?></span></strong>
    </div>
<div class="block-content">
       <?php echo $this->getLayout()->createBlock(‘cms/block’)->setBlockId(‘company-links’)->toHtml() ?>

</div></div>
 

Het is overigens handig om even te spieken welke classes gebruikt worden in de andere blokken, zodat je de styling hetzelfde hebt. In dit geval hebben we dus block, block-banner, block-title en block-content

Met   <?= $this->getLayout()->createBlock(‘cms/block’)->setBlockId(‘company-links’)->toHtml() ?> 

roepen we een statisch blok aan met als id company-links.

Echter, er is nog niets zichtbaar, omdat we het blok nog niet in de layout hebben opgenomen. Dus zoeken we naar het xml bestand dat de blokken aanroept. Hiervoor kwamen de template hints van pas.

We gaan nu naar app\design\frontend\default\TEMPLATENAAM\layout\catalog.xml

Hierin worden de diverse blokken aangeroepen.

We willen het blok rechts hebben, dus zoeken we naar reference name=right

Hier voegen we het blok in (vet):

 <reference name="right">
            <block type="catalog/product_compare_sidebar" before="cart_sidebar" name="catalog.compare.sidebar" template="catalog/product/compare/sidebar.phtml"/>
            <!–   <block type="core/template" name="right.permanent.callout" template="callouts/right_col.phtml"/> –>
             <block type="core/template" name="rechts.links" template="callouts/rechts.phtml"/>
        </reference>

Nu rest ons alleen nog het aanmaken van het statische blok met de juiste id en voila!

Plaatje van statisch blok

 

MAAR ER IS OOK EEN METHODE OM DIT VIA DE BACKEND TE DOEN

Als je een statisch blok wilt toevoegen aan de homepage, dan kun je het volgende doen.
Ga naar de homepage in je backend. Kies ontwerp –> Layout UPDATE XML

Hierin plaats je dan de volgende code:

<reference name="right">
             <block type="cms/block" name="Reclameblok" before="-">
        <action method="setBlockId"><block_id>reclameblok1</block_id></action>
    </block>  
        </reference>

Aan de rechterkant ("right") wordt nu een blok toegevoegd. Het id van het blok is reclameblok1. Natuurlijk moet je daarna via CMS –> Statische Blokken  nog een statisch blok aanmaken met deze identifier. Daarna zal deze verschijnen op de homepage. Handig,  om bijvoorbeeld reclame aan de homepage toe te voegen.

 

Geef een reactie