< Lightbox für Magento

Magento: Anzeigen von Bestellbedingungen in einem Fenster statt einer Textbox

Beim Bestätigen der AGB und der Widerrufsbelehrung kurz vor Bestellabschluss werden die Bedingungen in einem scrollbaren Textfeld angezeigt. Will man stattdessen einfach einen Link einsetzen, gibt es eine sehr schöne und schlanke Lösung.

Hierfür wird die Javascript-Bibliothek Lightwindow (Einbindung siehe mein vorheriger Eintrag) eingesetzt, um den Inhalt der AGB in einer Lightbox (bzw. einem Lightwindow) anzuzeigen. Die Textbox benötigt hierfür eine eindeutige HTML-ID, die in der Template-Datei checkout/onepage/agreements.phtml gesetzt werden kann:

<div id="agreement-content-<?php echo $_a->getId()?>" class="agreement-content"...

Anschließend wird ein Link an den Text hinter der Checkbox angehängt, wobei als Link die ID des darzustellenden Elements mit vorangestelltem #-Zeichen eingesetzt wird:

<a href="#agreement-content-<?php echo $_a->getId()?>" class="lightwindow" params="lightwindow_width=800,lightwindow_height=600"><?php echo $this->__('Link') ?></a>)

Dadurch wird das Textfeld automatisch versteckt und als Lightwindow bei einem Klick auf den Link wiederhergeholt.

Zusammen sieht die Datei so aus:

<?php
/**
 * @see Mage_Checkout_Block_Agreements
 */
?>

<?php if (!$this->getAgreements()) return; ?>
<form action="" id="checkout-agreements" onsubmit="return false;">
<ol class="checkout-agreements">
<?php foreach ($this->getAgreements() as $_a): ?>
    <li>
        <div id="agreement-content-<?php echo $_a->getId()?>" class="agreement-content"<?php echo ($_a->getContentHeight() ? ' style="height:' . $_a->getContentHeight() . '"' : '')?>>
            <?php if ($_a->getIsHtml()):?>
                <?php echo $_a->getContent() ?>
            <?php else:?>
                <?php echo nl2br($this->htmlEscape($_a->getContent())) ?>
            <?php endif; ?>
        </div>
        <p class="agree">
            <input type="checkbox" id="agreement-<?php echo $_a->getId()?>" name="agreement[<?php echo $_a->getId()?>]" value="1" title="<?php echo $this->htmlEscape($_a->getCheckboxText()) ?>" class="checkbox" />
            <label for="agreement-<?php echo $_a->getId()?>"><?php echo $this->htmlEscape($_a->getCheckboxText()) ?> (<a href="#agreement-content-<?php echo $_a->getId()?>" class="lightwindow" params="lightwindow_width=800,lightwindow_height=600"><?php echo $this->__('Link') ?></a>)</label>
        </p>
    </li>
<?php endforeach ?>
</ol>
</form>