Login-Form css-IDs?

  • Hello,

    weiß jemand vielleicht wie bei der LogIn-Maske die Formularfeldtitel 'Benutzername', 'Passwort' und 'E-Mail' via Css einzeln anzusprechen sind? Sitz zwar schon Stunden davor, aber irgendwie steh ich glaub ich derzeit auf der Leitung. Danke!

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Wieder eine Frage, die ich mir selbst beantworte: gar nicht! Für Registrierung, Anmeldung etc. stehen KEINE css-IDs zur Verfügung. Man kann lediglich alles gleich formatieren, aber bei Repositionierung von Elementen, muss auf die wp-login.php zu gegriffen und diese um IDs erweitert werden. Super, oder.

  • Das stimmt so nicht, denn ich hab ein vollkommen dem Design der Seite angepassten Login (sowohl unter WP 2.6.5 als auch WP 2.7).

    http://www.code-styling.de/wp-content/upl…anmeldung-2.png

    id="login"
    id="loginform"
    id="user_login"
    id="user_pass"
    id="rememberme"
    id="wp-submit"
    id="nav"


    [FONT=Verdana]und einige class Angaben gibt es ebenfalls. Einfach mal in den Quelltext der Login Seite schauen, hätte dir auch bereits geholfen :)
    [/FONT]

  • naja. nicht ganz. die verschachtelung ist ja

    Code
    <p><label><input>

    und die ID hängt nur am input. Den Block als ganzes zu verschieben, so dass ich zB Benutzername links und E-Mail rechts hab, geht leider nicht. Eine unterschiedliche Formatierung der labels/Titeltexte ist so ziemlich schwer, weil du mit der ID ja nur das input-Feld angreifen kannst oder eben alle p>label>input... Bin ja leider kein Programmierer und ned so bsonders gut mit diesen Dingen. Korrigier mich bitte, falls ich was nicht ganz richtig kapiert hab. Danke für die Hilfe!

    Wenn Du schon dabei bist, hätte ich eine andere Frage auch noch. LINK Wie kommt es, dass ich bei meinem Seitenhintergrund die Hintergrundfarbe (r&l vom giv) nicht bis ganz nach unten bekomme?

    Firebug laden! Foreregeln bitte lesen. FAQ. Bitte keine Anfragen per PN.

    Einmal editiert, zuletzt von kaiser (25. Januar 2009 um 15:09)

  • Also den "weissen Rest" unten würde ich so wegbekommen:

    Code
    <p id="backtoblog" [COLOR=Red][B]style="position:relative;height:800px;"[/B][/COLOR]>


    Hab das mal im inline Style aufgeschrieben. Also die id="backtolog" ebenfalls relative und 800px hoch, weil der Fluss ja durch die relative Angabe der login Box unterbrochen wurde. Den in backtolog folgenden a kann man ja wieder absolute machen und top/left oben antackern lassen.

  • na sehr fein. Danke! Hab´s jetzt einmal so gemacht und es funktioniert:

    Code
    #backtoblog {
    position:relative;
    height:420px;
    }
    #backtoblog a {
    position:absolute; top:-800px; left:0px;
    }

    insgesamt ist mir ja eh bewusst, dass ich einen Haufen Topfen und Wiederholungen im meinem Stylesheet habe, aber leider muss ich da durch :mrgreen:

  • hm. Wirklich lösen tut sich mein Problem dann doch nicht. Weil sobald eine Fehlermeldung (zB Feld nicht ausgefüllt o. Ä.) zwischen Info & Logo kommt, stimmt die Höhe wieder nicht. D.h.: Ich müsste heigth auf soviel Pixel setzen, dass sich die maximal längste Fehlermeldung ausgeht (+ ~300px). Leider kann man dann ewig ins 'Leere' scrollen. Den #login, #registerform div kann ich auch nicht absolute; setzen, weil ich ihn sonst nicht zentrieren kann...

    sollte ich also eher die Formularfelder alle relative; setzen, oder ...?

    außerdem quält mich noch was anderes: Ich weiß nicht so recht, ob ich den Submit-button richtig anspreche. Eigentlich wollte ich eine Background-Grafik verwenden, die ich je nach status (hover, active) um 1/3tel verschiebe. So brauch ich die anderen Stati (ist das die Mehrzahl?) nicht separat laden. Irgendwie greift die background-position: 0px 23px; nicht wirklich bei hover und active... Außerdem wird ja derselbe Login-Button beim Registrieren, Einloggen und Passwort zusenden verwendet. D.h.: mit einer absoluten position rutscht mir der Button hunderte Pixel zu weit nach unten um in den kleineren Formularen nutzbar zu sein.

    Firebug laden! Foreregeln bitte lesen. FAQ. Bitte keine Anfragen per PN.

    Einmal editiert, zuletzt von kaiser (25. Januar 2009 um 20:42)

  • Zum Verständnis, dein Hintergrundbild besteht aus mehreren vertikalen Einzelbildern, die 23px hoch sind. Wenn du den Hintergrund vertikal positionieren willst, ist y Angabe nicht positiv sondern negativ:

    Code
    background:transparent url(http://xxxxx.com/wp-content/themes/xxxxxxx/images/button-registrieren.png) [B][COLOR=Red]no-[/COLOR][/B]repeat scroll left [COLOR=Red][B]-23[/B][/COLOR]px;

    Die Oberkante deines Buttons wird somit auf dem Offset von 23px vertical dargestellt (0,0) Button ist (0,23px) im Image. Durch die -23px wird dein Hintergrundbild um 23px nach oben verschoben und der Button bekommt so das Bild ab 23px v-Offset.

  • Alles klar. Hatte es mit 'background-position' zwar probiert zu positionieren, funktionierte aber nicht. Dank und Anerkennung!

    Hast Du vielleicht noch einen Ansatz, wie ich das Problem mit dem Login/Passwort-Formular und dem Button (zu weit unten) in den Griff bekommen könnte?

  • so. jetzt hab ich ganz was essentielles kapiert: verschachtelung beim ansprechen... meine css-datei wird zwar riesig, weil ich mit alle elemente, die ich separat ansprechen muss, mit jeweils dem "prefix" #registerform, #loginform und #lostpasswordform versehen muss, aber es funktioniert. danke nochmals für die hilfe!

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!