WordPress 2.7 Login Design anpassen

bueltge.de [by:ltge.de] wird von Frank Bültge geführt, administriert und gestaltet. Alle Inhalte sind persönlich von mir ausgewählt und erstellt, nach bestem Gewissen und Können, was die Möglichkeit von Fehlern nicht ausschließt.

Kommentare

  
  1. Ralf sagt:

    Eine weitere Möglichkeit das Login-Formular zu verwenden, ist den Login auf der Startseite anzubieten. Dies ist sehr nützlich wenn ein Blog z.B. Kommentare nur für registrierte Nutzer geöffnet hat. Dadurch entfällt das leidige hin- und her gehopse zwischen Blog und Login-Seite. WordPress merkt sich nämlich leider nicht von welcher Seite aus man den Login aufruft. In der Regel landet man nach dem Login im Benutzer-Profil bzw. Backend.

    Möchte man nun seinen Besuchern einen Login auf der Startseite anbieten, muss man sich nur die entsprechenden Zeilen aus wp-login.php kopieren und eine Zeile anpassen.
    In WP V2.6 sind dies die Zeilen 456-476. In älteren Versionen findet man die entsprechende Stelle indem man nach form name="loginform" sucht. Alles zwischen [form...] und [/form] kopiert man sich einfach und packt es am besten in eine eigene Datei (z.B. frontpagelogin.php). Diese Datei kann man dann in seinem Theme einfach includieren. Oder man bastelt sich ein Widget daraus*
    In den Zeilen muss man nun noch eine kleine Änderung vornehmen. Und zwar gibt es ein verstecktes Input-Feld (input type="hidden" name="redirect_to"). Dieses gibt an wohin nach dem Login umgeleitet werden soll. Ist der Wert $redirect_to nicht gesetzt, wird auf das Backend/Profil umgeleitet.
    Also setzen wir dort bei value="..." das ein, wohin der Besucher umgeleitet werden soll. Zum Beispiel die Startseite mit <?PHP bloginfo('home'); ?>. Oder richtig luxuriös zu der Seite, von der aus der Login durchgeführt wurde: <?PHP echo get_bloginfo('url').$_SERVER['REQUEST_URI']; ?>

    Loggt sich nun ein Besucher von der Startseite ein, wird er auch direkt dorthin zurück befördert. Bei der zweiten Variante wird er sogar ggf. zu einen aufgerufenen Artikel zurück umgeleitet. Natürlich lassen sich so auch die Klassen und IDs ändern und an das Theme anpassen.

    Dieses Mini-Login hat allerdings auch nur zwei Eingabefelder! Benutzername und Passwort. Dazu noch halt die RememberMe-Checkbox. Möchte man noch den Link für ein vergessenes Passwort hinzufügen, ergänzt man diesen durch <a href="<?PHP bloginfo('home');?>/wp-login.php?action=lostpassword">...</a>. Dann wird der Besucher halt wieder zum "normalen" Login-Formular umgeleitet (ohne Redirect). Aber Schusseligkeit muss halt bestraft werden 😉

    * Wenn ich jetzt noch raus bekomme wie man ein Widget schreibt, dann packe ich das alles mal in ein Widget und stelle es zum Download bereit 😉

    PS: Sind meine Kommentare eigentlich zu lang?

  2. Ahmet Topal sagt:

    Danke 🙂 Wenn die Vollversion draußen ist, mach ich mir ein Anmeldebereich 🙂

  3. Jared sagt:

    Gute Erklärung zum neuen Loginbereich. Jetzt muss ich nur noch mein kleines Tutorial anpassen.

    Zum Glück hat sich nicht extrem viel geändert.

  4. Wuggi sagt:

    Super, besten Dank für das Tutorial.
    Endlich konnte ich auch diesen Schönheitsfehler abstellen.

  5. Leon sagt:

    Das alles ist noch ein wenig unverständlich für den, der CSS noch nicht gewachsen ist. Dadurch weiß dieser nicht, was für was steht, und was was ändert. Deswegen hilft dieses Tutorial nicht wirklich, wenn man keine Ahnung von CSS hat. Mir zum Beispiel hat es nicht wirklich geholfen, obwohl ich CSS einigermaßen verstehe.

    • Klar, ohne Kenntnisse in CSS ist da nix zu holen. Das Tutorial erklärt auch nur, wie man bei WP einhaken kann. Um Design via CSS muss man sich dann selbst kümmern oder ein Plugin nutzen.

  6. Jared sagt:

    @Leon

    Also wenn du wirklich ein wenig von CSS verstehst, dann müsstest du eigentlich wissen was zu tun ist 🙂 und selbst wenn nicht, probieren geht über studieren. Zu anfang kann Farben austauschen und merkt schnell was wo passiert.

    Und wer wirklich nix von CSS versteht, der sollte die Finger vom Login-Design lassen 😉 dafür gibt es nämlich zig Plugins, deren Installation schneller gehen.

    lg

  7. Super vielen Dank, allerdings wenn wir schon bei der Corporate Identity sprechen: Ich suche auch nach Möglichkeiten dem Backend ein eigenes Design zu verpassen.

    • @Jürgen: das Anpassen kann vielschichtig sein, entweder komplett anders oder nur in den Farben, wie ich es vorrangig mache. Weitere Änderungen mache ich mit meinem Plugin Adminimize. Ein Tutorial zum Backend Design habe ich aber, zumindest wie man die Vorgaben hinzufügt. Ansonsten muss natürlich das CSS laden und eventuell die "alten" CSS deaktivieren, insofern man alles neu machen will.

  8. Leon sagt:

    @Jared
    Ich meine, ich weiß ja, was passiert, wenn ich die Farben austausche, und da ist es für mich ziemlich uninteressant, was passiert, wenn ich z.B. background color durch was anderes ersetze. Bis alles richtig proffesionel wirkt und auch zu meinem Blog passt, wäre ich ja schon alt und grau...

  9. Alexander sagt:

    Um Link und Titel des Bildes auf der Login-Seite an Blogurl und Blogtitle anzupassen:

    In die functions.php:
    function custom_login_img_url() {
    return bloginfo('url');
    }
    add_filter ('login_headerurl', 'custom_login_img_url');

    function custom_login_img_title() {
    return bloginfo('name');
    }
    add_filter ('login_headertitle', 'custom_login_img_title');

    Oder alternativ direckt die wp-login.php im root Verzeichniss des Blogs bearbeiten (Datei wird bei Updates überschrieben):
    <a href="" title="">

  10. madav sagt:

    Thanks for this wonderful post.I am unable to understand your language but Google chrome translated it for me.

    Thanks
    Madav

  11. ubuntuxx sagt:

    Ich würde gerne wissen, welche Dateien editiert werden müssen, wenn man direkt im wp-admin Verzeichnis den Login anpassen möchte. Das Logo habe ich schon ausgetauscht, würde jedoch auch noch gerne den Link hinter dem Logo ändern und den Text (Powered by WordPress) entfernen bzw. austauschen. lg ubuntuxx

  12. Michael sagt:

    Hallo Frank!
    Der Artikel ist zwar schon etwas älter, scheint aber immer noch zu funktionieren. Vielleicht eine Anmerkung, da Child-Themes ja ganz schön in Mode gekommen sind: Wenn man sein Logo inkl. CSS im Child-Theme Ordner unterbringt, greift get_bloginfo('template_directory') nicht mehr. Da wird dann immer das Verzeichnis des Parent-Themes angesteuert. Hier muss man die Funktion get_stylesheet_directory_uri()nehmen. Diese bleibt dann im Child-Theme Ordner.

Trackbacks

  1. [...] und Anhängen freuen. Die Verbesserung der Versionierung, Integration von OpenID und themabhängiger Login sind ebenso Ideen für die kommenden [...]

© 2016, since 2005 bueltge.de [by:ltge.de] · Theme is built by ThemeShift