Texthinweise im Magento-Checkout: Statische Blöcke oberhalb und unterhalb der Zusammenfassung einbauen

Diese Anleitung zeigt, wie man eigene Texthinweise im letzten Checkout-Schritt anzeigen lassen kann. Die Inhalte werden über statische Blöcke verwaltet, die dann über ein Layout-Update eingebunden werden.

Wir gehen davon aus, dass im Shop German Setup verwendet wird, es ist aber keine Voraussetzung. Wir wollen oberhalb der Zusammenfassung „Bei Zahlungseingang vor 15:00 Uhr erfolgt die Lieferung noch am gleichen Tag.“ und unterhalb „Bei Lieferungen in das Nicht-EU-Ausland fallen zusätzliche Zölle, Steuern und Gebühren an.“ anzeigen. Der zweite Hinweis ist für das Bestehen der TrustedShops-Zertifizierung erforderlich.

Der nachfolgende Screenshot demonstriert das Ergebnis:

Texte als statische Blöcke

Statische Blöcke lassen sich im Backend bequem verwalten. Deshalb sollen die beiden Hinweise als statische Blöcke angelegt werden. Wir legen zwei statische Blöcke mit den folgenden Bezeichnern an (die Namen wurden frei gewählt):

  • checkout_review_before
  • checkout_review_after

Der Inhalt des Blocks checkout_review_before ist:

<div style="border-color: #D9DDE3; border-style: solid; border-width: 0 1px; padding: 7px;">
Bei Zahlungseingang vor 15:00 Uhr erfolgt die Lieferung noch am gleichen Tag.
</div>

Der Inline-Style wurde aus der CSS-Regel-Definition für .opc .checkout-agreements aus styles.css übernommen, der CSS-Datei des Magento-Base-Themes. Die Gestaltung sorgt für die Fortsetzung des hellgrauen Rahmens und des Abstands des Texts vom Rand.

Der Inhalt des Blocks checkout_review_after ist:

<div style="border-width: 0 2px; border-style: none solid; padding-left: 10px;">
Bei Lieferungen in das Nicht-EU-Ausland fallen zus&auml;tzliche Z&ouml;lle, Steuern und Geb&uuml;hren an.
</div>

Auch hier sorgt der Inline-Style für die Fortsetzung des schwarzen Rahmens, der nach der Button-Lösung vorgeschrieben und für das Bestehen der TrustedShops-Zertifizierung erforderlich ist.

Der schwarze Rahmen wird von German Setup in skin/frontend/base/default/css/germansetup/checkout.css gestaltet. Der Inline-Style wurde von dort übernommen.

Statische Blöcke über Layout-Update im Checkout anzeigen

Über ein Layout-Update, ganz ohne Template-Anpassung, lassen sich statische Blöcke in Checkout-Schritte integrieren. Die vorher angelegte statische Blöcke können mit dem folgenden XML-Layout-Code oberhalb und unterhalb des letzten Checkout-Schritts eingebaut werden:

<?xml version="1.0"?>
<layout version="0.1.0">

    <checkout_onepage_review>
        <reference name="checkout.onepage.review.info.items.before">
            <block type="cms/block" name="checkout_review_before_block" before="-">
                <action method="setBlockId">
                    <block_id>checkout_review_before</block_id>
                </action>
            </block>
        </reference>

        <reference name="checkout.onepage.review.info.items.after">
            <block type="cms/block" name="checkout_review_after_block" after="-">
                <action method="setBlockId">
                    <block_id>checkout_review_after</block_id>
                </action>
            </block>
        </reference>
    </checkout_onepage_review>

</layout>

Der XML-Layout-Code wird in der Datei local.xml in app/design/frontend/default/default/layout/ oder im entsprechenden Theme-Verzeichnis gespeichert. Legen Sie die Datei an, falls sie noch nicht existiert.

Der Layout-Handle checkout_onepage_review und die beiden referenzierten Blöcke checkout.onepage.review.info.items.before und checkout.onepage.review.info.items.after werden in app/design/frontend/base/default/layout/checkout.xml erstmalig definiert und von German Setup in germansetup.xml (gleiches Verzeichnis) noch weiter modifiziert. Diese Anleitung wird also auch ohne installierten German Setup funktionieren.

Die beiden statischen Blöcke werden über XML-Layout-Code definiert. Da die Blöcke checkout.onepage.review.info.items.before und checkout.onepage.review.info.items.after als Strukturblöcke definiert wurden (type=core/text_list), werden die Inhalte aller untergeordneten Blöcke, also auch der statischen Blöcke, ausgegeben.

Nach dem Update des Layout-Cache in System > Cache Verwaltung sind die beiden Blöcke im Checkout sichtbar.

 

Weiterlesen:

Dieser Beitrag wurde unter Tutorials abgelegt und mit , , , verschlagwortet. Setze ein Lesezeichen auf den Permalink.

Schreib einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *