Wir wollten für ein Kundenprojekt ein Mini Login in den Header der Seite einbauen. Und zwar sollte es einer sein, der verschwindet, wenn sich der Kunde eingeloggt hat.
Eine schöne Möglichkeit bietet sich mit folgender Vorgehensweise:
1. Eine neue Datei im Ordner
/app/design/frontend/[base oder default]/[IhrTemplate]/template/customer
erstellen mit dem Namen
welcome.phtml
In diese dann folgendes kopieren:
<ul class="header-links"> <li class="first"><?php echo $this->getLayout()->getBlock('header')->getWelcome() ?></li> <li><a href="<?php echo $this->getUrl('customer/account/') ?>" title="My Account">Mein Konto</a></li> <li class="last"><a href="<?php echo $this->getUrl('customer/account/logout/') ?>" title="Logout">Logout</a></li> </ul>
2. Die Datei
mini.login.phtml
im Ordner
/app/design/frontend/[base oder default]/[IhrTemplate]/template/customer/from
komplett ändern zu
<form id="mini_login_form" action="<?php echo $this->getPostActionUrl() ?>" method="post"> <div> <input id="email" type="text" class="input-text required-entry" name="login[username]" value="<?php echo $this->helper('catalogSearch')->getEscapedQueryText() ?>" title="<?php echo $this->__('Email Address') ?>" /> <input id="pass" type="password" class="input-text required-entry validate-password" name="login[password]" value="<?php echo $this->helper('catalogSearch')->getEscapedQueryText() ?>" /> <input type="image" src="<?php echo $this->getSkinUrl('images/btn_go.png') ?>" alt="<?php echo $this->__('Go') ?>"/><br /> <h6> Neu hier? <a href="<?php echo $this->getUrl('customer/account/create/') ?>" title="Logout">Registrieren</a> | <a href="<?php echo $this->getUrl('customer/account/forgotpassword/') ?>" title="Logout">Passwort vergessen?</a></h6> <script type="text/javascript"> var searchForm = new Varien.searchForm('mini_login_form', 'email', '<?php echo $this->helper('catalogSearch')->__('Email Address') ?>'); new Varien.searchForm('mini_login_form', 'pass', '<?php echo $this->helper('catalogSearch')->__('Password') ?>'); </script> </div> </form>
3. Dann in die
header.phtml
im Ordner
/app/design/frontend/[base oder default]/[IhrTemplate]/template/page/html
folgende Zeile an die Stelle kopieren an der das Login Form später auftauchen soll:
<div class="mini-login"><?php echo $this->getChildHtml('mini_login') ?><?php echo $this->getChildHtml('welcome') ?></div>
4. Im Ordner
/app/design/frontend/[base oder default]/[IhrTemplate]/layout/
die Datei
page.xml
öffnen und ca. in Zeile 69 direkt unter
<block type="page/html_header" name="header" as="header">
die Zeile
<block type="customer/form_login" name="mini_login" template="customer/form/mini.login.phtml" /> <block type="core/template" name="welcome" template="customer/welcome.phtml" />
einfügen.
5. Nun kann in der zugehörigen CSS Datei noch das Aussehen der Mini Login Box angepasst werden. Ein Beispiel wäre
/* Mini-Login Form */ .mini-login { background: transparent; float:right; margin-top:0px; margin-right:3px; height:40px;} .mini-login { color:#444; text-align:right;} .mini-login .header-links { padding-left:8px; } .mini-login .header-links, .mini-login .header-links li { display:inline;} .mini-login .header-links li { padding:0 4px 0 1px; } .mini-login .header-links a, .mini-login .header-links a:hover { color:#444; } .mini-login .header-links a { padding:0 7px 0 0; background:url(../images/links_separator.gif) no-repeat 100% 50%; } .mini-login .header-links .last a { padding:0; background:none; } .mini-login-td { height:36px;} .mini-login div h6 { font-size:10px; text-align: left; }
Einen Beitrag wie man Links nur dann anzeigt wenn man angemeldet ist, gibt es hier.
Genutzt in Magento Version 1.7. Fragen, Kommentare, Vorschläge? Gerne direkt oder als Kommentar.
“folgende Zeile an die Stelle kopieren an der das Login Form später auftauchen soll.”
Welche Zeile? Wäre nett wenn ihr das berichtigen könntet, VG, Dominic
Das ist von Template zu Template verschieden. Am besten einfach den Cache deaktivieren. In die header.phtml reinkopieren, hochladen und schauen, wo es auftaucht. Dann eben immer wieder verschieben.
Meinen Cache hab ich deaktiviert. Ich meinte nur, dass in diesem Artikel nach “folgende Zeile an die Stelle kopieren an der das Login Form später auftauchen soll.” keine folgende Zeile steht.
Kommt dort vielleicht getChildHtml(‘mini_login’) ?> rein?
VG, Dominic 🙂
Also irgendwie bekomme ich das nicht hin. Könntet ihr die Files vielleicht als Download freigeben, oder sie mir per E-Mail schicken? Das würde mir sehr helfen. VG, Dominic
Uuuups…. nun aber. Sollte nun passen 🙂 Danke für den Hinweis.
GESCHAFFT! Allerdings gab es ein Paar Hürden. Wenn man alles wie in diesem Tutorial beschrieben nachbaut, hat man ein funktionierendes Loginfeld. Wenn man sich jedoch einloggt ist es immer noch da. Ich möchte diesem Beitrag hinzufügen, dass man außerdem noch in
/app/design/frontend/[base oder default]/[IhrTemplate]/layout/
eine Datei namens ‘customer.xml’ erstellen muss. Darin muss das stehen:
Danach hat man das passende Ergebnis. Trd danke für das super Tutorial 🙂
http://www.magentocommerce.com/boards/viewthread/5835/
Ein tolles Script..
Hat bei mir auf Anhieb super geklappt. Musste nur die ”-Zeichen in “-Zeichen und die ’-Zeichen in ‘-Zeichen umwandeln..
Das einzige, was bei mir nicht funktioniert, ist, dass das Login im eingeloggtem Zustand immer noch erscheint..
Woran kann dies liegen ??
MfG
Silberschlag