Individuelles HOGASHOP-Loginformular erstellen
share
1. Konfigurieren
https://toolbox-ch.hogalog.ch/customlogincreator/index.php?
Schrift
Schriftgrösse Überschrift
Schriftgrösse Text
Container
Hintergrundfarbe
Textfarbe
Rahmenfarbe
Schattentransparenz
Breite des Containers (
440
px)
Button
Hintergrundfarbe Button
Hover Button
Textfarbe Button
Textfarbe Links
Registrieren Link anzeigen
Passwort vergessen Link anzeigen
Loginmaske generieren
2. Vorschau
Vorschaufarbe festlegen
Anmeldung
Bitte geben Sie Ihren Benutzernamen und Ihr Passwort ein. Klicken Sie anschliessend "Anmelden".
Anmelden
3. Quellcode kopieren
<!--custom login //--><style type="text/css">.custom-login{background-color:#ffffff;border-radius:5px;border:1px solid #cccccc;width:100%;max-width:440px;font-size:14px;color:#000000;-webkit-box-shadow:2px 3px 7px 2px rgba(204, 204, 204,0.5);box-shadow:2px 3px 7px 2px rgba(204, 204, 204,0.5);margin:0 auto 25px auto}.custom-login h4{ font-weight:bold;display:block;text-align:center;border-bottom:1px solid #cccccc;line-height:30px;height:30px;margin:0;padding:0;font-size:16px}.custom-login form{padding:15px 15px 0px 15px}.custom-login form p{margin:0 0 15px;padding:0}.custom-login .form-input{width:100%;display:block;margin-bottom:10px;margin-left:0;margin-right:0}.custom-login .form-input .form-control{display:block;width:100%;padding:0;line-height:40px;height:40px;font-size:14px;border:1px solid #d5d5d5;border-radius:3px;text-indent:5px}.custom-login .form-input .form-control:focus{background-color:#fffde9}.custom-login .form-input .form-button{text-align:center;display:block;width:100%;line-height:40px;height:40px;font-size:14px;border:none;border-radius:3px;color:#ffffff;background-color:#999999;font-weight:700}.custom-login .form-input .form-button:hover{background-color:#cccccc} .custom-login-link{text-align:right;} .custom-login-link a{color:#999999;text-decoration:none;}</style><div class="custom-login"> <h4>Anmeldung</h4> <form name="frm_login" id="frm_login" action="https://www.hogashop.ch/login/external" method="post" target="_blank"> <p>Bitte geben Sie Ihren Benutzernamen und Ihr Passwort ein. Klicken Sie anschliessend "Anmelden". </p> <div class="form-input"> <input type="text" class="form-control" placeholder="Benutzername" name="username" value=""> </div> <div class="form-input"> <input id="password" type="password" name="password" class="form-control" placeholder="Passwort"> </div> <div class="form-input"> <button type="submit" class="form-button"> Anmelden </button> </div> <div class="form-input custom-login-link"> </div> </form> </div><!--end custom login //-->
Code in Zwischenablage kopieren
3. iFrame Code kopieren
<!--custom login //--> <style type="text/css">.hogashoplogin{border:none:margin:0px;padding:0px;width:100%;height:300px}</style> <iframe id="hogashoplogin" name="hogashoplogin" src="https://toolbox-ch.hogalog.ch/customlogincreator/login.php?" width="100%" height="300" allowtransparency="true" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" class="hogashoplogin" allowfullscreen></iframe><!--end custom login //-->
Code in Zwischenablage kopieren
