cyon Webmail in Ihre Website einbinden


Unsere Entwickler haben für Sie eine Möglichkeit entwickelt, um den Anmelde-Bereich für das Webmail auf der eigenen Website einzubauen.

Fügen Sie einfach folgenden Code an der gewünschten Stelle in Ihre Website ein:

<form id="cyon-wm-login_form" action="https://webmail.cyon.ch/" method="POST">
    <input type="text" value="" id="cyon-wm-username" name="username">
    <input type="password" value="" id="cyon-wm-password" name="password">
    <input type="hidden" value="" id="cyon-wm-domain" name="domain">
    <input type="submit" value="Ins Webmail einloggen" id="cyon-wm-submitbt" name="submitbt">
</form>
<div id="cyon-wm-login-message"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://webmail.cyon.ch/plugins/cyon_mod/static/easyXDM.min.js"></script>
<script type="text/javascript" src="https://webmail.cyon.ch/plugins/cyon_mod/static/loginForm.js"></script>

Domain als Standard festlegen

Als besonderes Feature können Sie das Formular auf eine gewünschte Domain beschränken. Somit sind danach nur Anmeldungen mit E-Mail-Adressen der gesetzten Domain möglich. In unserem Beispiel mit @oliverorange.ch.

Tragen Sie dazu beim Input-Feld name="domain" im HTML-Tag value="" den Namen Ihrer Domain ein.

<input type="hidden" value="oliverorange.ch" id="cyon-wm-domain" name="domain">

Eigene Formatierung

Das Formular können Sie beliebig noch ergänzen mit <label> um die Eingabefelder noch zu beschriften und das ganze kann über CSS gestaltet werden.

Beachten Sie, dass die IDs der Formularfelder sowie die drei Javascript-Dateien am Schluss nicht verändert oder weggelassen werden, da das Formular sonst nicht mehr funktioniert.

Beispiel

Als Beispiel wurde das Login auf der Website von The Music Monkeys eingebaut. Die Domain wurde auf themusicmonkeys.ch beschränkt und die Felder mit der oben erwähnten Beschriftung ergänzt.

Webmail-Login auf themusicmonkekys.ch
Webmail-Login auf themusicmonkeys.ch

Der Code dazu sieht dann wie folgt aus:

<h1>Anmeldung Webmail</h1>
<article id="webmail-login">                
    <form id="cyon-wm-login_form" action="https://webmail.cyon.ch/" method="POST">
        <label for="cyon-wm-username">Benutzername</label>
      <input type="text" value="" id="cyon-wm-username" name="username">
      <p>@themusicmonkeys.ch</p>
      <label for="cyon-wm-password">Passwort</label>
      <input type="password" value="" id="cyon-wm-password" name="password">
      <input type="hidden" value="themusicmonkeys.ch" id="cyon-wm-domain" name="domain">
      <input type="submit" value="Login" id="cyon-wm-submitbt" name="submitbt">
    </form>
    <div id="cyon-wm-login-message"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://webmail.cyon.ch/plugins/cyon_mod/static/easyXDM.min.js"></script>
    <script type="text/javascript" src="https://webmail.cyon.ch/plugins/cyon_mod/static/loginForm.js"></script>
</article>
Weitere Artikel zum Thema E-Mail