[phpBB3] Modul Wechsel-Account Problem mit "value"

[Peter Steele]

URL-Adresse des Forums: http://www.throughtheashes.com/
Rang/Funktion im Forum: Admin
Forenversion: phpBB3 pro silver
Browser: Firefox
Persönliches CSS(Ja/Nein): ja
Templateänderungen(Ja/Nein): ja

Guten Abend!

ich habe einen Account-Switcher bei uns eingebaut. Ich bin zunächst dieser Anleitung gefolgt: Tutorial für's Modul.

Da mir das aber irgendwie zu mühsam war, das Modul freizustellen oder eben nach oben zu verschieden, habe ich mir gedacht, es muss doch einfacher gehen. Also habe ich ganz todesmutig und risikofreudig den Code aus dem Tutorial voneinander getrennt. Der abgetrennte Scrypt wurde bei "index-body" eingfügt und das CSS ganz normal im Stylesheet. Ein paar persönliche Einstellungen wurden vorgenommen und das Ganze sah dann so aus:

Code:

      <!-- BEGIN switch_user_logged_in -->
    <br><div id="accountswitch">
<script type="text/javascript">
function switch_accounts() {
  jQuery.get(document.getElementById('logout').href, function() {
  jQuery.post('/login', 'login=1&username='+document.getElementById('switch_username').value+'&password='+document.getElementById('switch_password').value, function () {
  window.parent.location.reload();
  });
  });
}
</script>
<span id="username">Switch to:&nbsp;&nbsp;<input type="text" id="switch_username" /></span>&nbsp;&nbsp;<span id="password">Password:&nbsp;&nbsp;<input type="password" id="switch_password" /></span>&nbsp;&nbsp;<input class="button2" value="Wechseln" onclick="switch_accounts();" />
</div><br>
      <!-- END switch_user_logged_in -->

Ihr seht also, dass der Switcher nur für angemeldete Mitglieder zu sehen ist. Hier das dazugehörige CSS:

Code:

#accountswitch {
    text-align: center;
  font-family: Calibri;
  padding:5px;
  border-radius:10px;
}
#username, #password {
    font-size: 11px;
    display: inline-box;
    margin-bottom: 8px;
    text-align: left;
    border-radius:10px;
}
#switch_username, #switch_password {
    background: #ffffff none repeat scroll 0 0; /*Anpassung an das Forum*/
    border: 1px solid #bcbcbc; /*Anpassung an das Forum*/
    border-radius: 10px;
    height: auto;
    padding: 3px;
    width: 140px;
}
#switch_username:hover, #switch_username:focus, #switch_password:hover, #switch_password:focus {
    border: 1px solid #3793ff; border-radius:10px; /*Anpassung an das Forum*/
}
div#accountswitch input.button2 {
    cursor: pointer;
    max-width: 120px;
    text-align: center;
  border-radius:10px;
 }

Nun das EIGENTLICHE PROBLEM:
Die Value-Class mit dem Wortlaut "Wechseln" ist eigentlich ja als Button gedacht zum Bestätigen. Per Enter-Taste funktioniert das auch. Wenn ich dort allerdings mit der Maus drauf klicke, habe ich plötzlich ein Eingabefeld und kann den Wortlaut "Wechseln" ändern. Sonst funktioniert aber alles. Es ist nur dieses Eingabefeld, das eigentlich ein Button sein sollte.

Braucht ihr noch einen Screenshot oder das komplette Index-Body-Template?

Danke für eure Mühen!

[inde]

Hallo @Peter Steele,

kann man davon ausgehen das Du sonst keine anderen Module im Forum nutzt?

Da mir das aber irgendwie zu mühsam war, das Modul freizustellen oder eben nach oben zu verschieden, habe ich mir gedacht, es muss doch einfacher gehen. Also habe ich ganz todesmutig und risikofreudig den Code aus dem Tutorial voneinander getrennt. Der abgetrennte Scrypt wurde bei "index-body" eingfügt und das CSS ganz normal im Stylesheet.

Dann hattest Du den komplizierteren Weg gewählt.

Hinweis: Auch empfiehlt es sich nicht immer gleich die Templates zu bearbeiten, da dort dann eventuelle Updates dann im Nachhinein von Hand eingesetzt werden müssten.

---

Wenn Du nur ein Modul im Forum verwenden solltest, dann könntest Du ja auch diese Variante wählen um Dein Modul freizustellen.

Code:

<div style="position: absolute; top: 100px; right: 70px; z-index: 10000;">Dein Code bzw. Modulinhalt</div>

Vergesse bitte nicht alle Arbeitsschritte aus dem erwähnten Tutorial abzuarbeiten, dazu gehört auch noch etwas CSS.

Solltest Du mit der Positionierung Probleme haben, dann setze bitte das Modul für alle User incl. Gäste ein, sodass wir auch als Gast dann einen Einblick für die Position haben.

Hilft Dir das weiter?

LG inde

[inde]

So nun habe ich mir das heute Morgen noch einmal angeschaut, es geht ja auch noch alles viel einfacher. Schau Dir das bitte einmal hier an. Meintest Du es in etwa so? Ja es ist in einem Modul und kann für Gäste auch abgestellt sowie frei positioniert werden.

---

Nehme einen Eintrag in das persönliche CSS mit nachfolgendem Inhalt vor.

Code:

/*Module auf der rechten Seite verstecken für BB3*/
#right {
  width:0px !important;
  margin-right:0px !important;
}
#content-container div#content {
  margin-right:0px !important;
}

	Verändere das Aussehen des Forums durch hinzufügen eines CSS-Codes.  Wie mache ich einen Eintrag in das CSS?

---

Aktiviere die Rechte Modulreihe der Indexmodule

Index-Module anzeigen: Ja
Breite der 1. Kolonne (Links): 0
Breite der 3. Kolonne (Rechts): ca. 192
Raum zwischen den Zeilen: 0
Raum zwischen Spalten: 0
Absenden  

---

Erstellen eines persönlichen Moduls

Name des Moduls: Wechsel-Account
Die Standardaufstellung nutzen: Nein
Inhalt des Moduls:

Code:

<style type="text/css">
#accountswitch {
    display: block;
    left: 50%;
    margin-left: 350px;/*Abstand von links, auch ein negativer Wert ist möglich*/
    position: absolute;
    text-align: center;
    top: 140px;/*Abstand von oben*/
}
#username, #password {
    font-size: 11px;
    display: inline-block;
    margin-bottom: 8px;
    text-align: left;
}
#switch_username, #switch_password {
    background: #ffffff none repeat scroll 0 0; /*Anpassung an das Forum*/
    border: 1px solid #bcbcbc; /*Anpassung an das Forum*/
    border-radius: 3px;
    height: auto;
    padding: 3px;
    width: 140px;
}
#switch_username:hover, #switch_username:focus, #switch_password:hover, #switch_password:focus {
    border: 1px solid #3793ff; /*Anpassung an das Forum*/
}
div#accountswitch input.button2 {
    cursor: pointer;
    max-width: 120px;
    text-align: center;
}
</style>
<div id="accountswitch">
  <script type="text/javascript">
function switch_accounts() {
  jQuery.get(document.getElementById('logout').href, function() {
  jQuery.post('/login', 'login=1&username='+document.getElementById('switch_username').value+'&password='+document.getElementById('switch_password').value, function () {
  window.parent.location.reload();
  });
  });
}
</script><span id="username">Benutzername:<br /><input type="text" id="switch_username" /></span><br /><span id="password">Passwort:<br /><input type="password" id="switch_password" /></span><br /><input class="button2" value="Wechseln" onclick="switch_accounts();" />
</div>

Absenden

---

Einfügen des persönlichen Moduls

Widget Wechsel-Account in die 3. Kolonne je nach Befugnissen einsetzen. (Haken bei Gästen entfernen)  

---

Positionierung des Moduls

Gleich in der ersten Class "#accountswitch" kannst Du die Positionierung im CSS des Moduls festlegen.

Jetzt sollte es doch funktionieren oder?

LG inde

[Peter Steele]

Hey Inde,
guten Morgen!

Vielen Dank für deine Hilfe. Dass du dir das alles nochmal angeschaut hast, finde ich klasse!

Im Grunde funktioniert der Code. Und der Button auch. Mich stört nur der Cursor, der auf dem Button erscheint, wenn man ihn aktivieren will Das sieht wirklich fast aus wie ein Eingabefeld.

Nein, ich verwende keine anderen Module.

Freistehend will ich das auch nicht so gern haben. Eben weil viele von uns mobil die klassische Version anschauen und wenn ich das freistehend mache, rückt das Modul auf dem Handy irgendwo in die Mitte des Index. Und das sieht wirklich blöd aus ^^

[inde]

Würdest Du bitte einmal auf einem Screenshot aufzeichnen wo Du das hin haben möchtest und wie der Button dort aussieht. Auch lässt sich doch über das CSS das Aussehen des Buttons verändern. Ich benötige da schon eine gute Beschreibung dafür, da ich ansonsten zu viel Zeit hineinstecke und wir dabei nicht wirklich weiter kommen.

LG inde

[Peter Steele]

Na klar, kein Problem!

Bisher ist der Code in der Index-Body an oberster Stelle. Quasi direkt unter dem Overall-Header.

Screen dazu: *klick*. Ich werde ihn aber wohl ganz unten auf die Startseite packen. Es ist einfach irritierend für die User, wenn sie nach dem Einloggen einen neuen Einloggbefehl sehen. Dann würde wieder Index-Body verwendet. Nur eben recht weit unten im Template.

Hier nochmal das Problem herangezoomt:

[inde]

Nun Du hast ja alles komplett umgebaut, ich bin bei Deiner Beschreibung davon ausgegangen das es Probleme mit der Positionierung gäbe.
Das müsste ich mir dann nach dem fertigen Umbau in Deinem Forum vor Ort in Deinem Forum anschauen.

Baue das erst einmal an gewünschter Stelle ein und dann würde ich mir das einmal im Forum anschauen.

LG inde

[inde]

Du meinst also das der Blinkende Cursor (|) im Wortlaut "Wechseln" störend ist? Das ist vom Browser her so bedingt, das bekommst Du auch nicht weg.
Selbst wenn Du dort eine Grafik einbauen würdest, hat das weiterhin so bestand. Das ist durch das Script so gegeben.

LG inde

---

EDIT: Klick einmal in das Suchfeld im Browser oder bei Google, dann wirst Du feststellen das es an den Browsern liegt.

[Peter Steele]

Oh. Okay. Tja so einfach kann die Lösung sein

Danke für deine Mühen!

P.S.: Und weil ich dich beschäftigt halten will, eröffne ich gleich noch ein Thema bzgl "Style-Switcher"^^

Thema erledigt. Danke.

[inde]

Bitte, ich habe auch noch andere Beschäftigungen. In dem Script wird das als Textfeld ausgewiesen und in Textfeldern blinkt nun einmal der Cursor, das ist selbst hier im Editor so.
Abstellen kannst Du es nur für Dich persönlich und das in Deinem System. Klick

LG inde