Willkommen im STRATO Blog. Hier gibt es News und Tipps rund ums Hosting.

 

Menu

Veröffentlicht am: 20. April 2017

WordPress-Login bunter machen

Grauer Hintergrund, WordPress-Logo und schlichtes Formular müssen nicht sein. Mit diesen Tricks holst Du mehr aus dem Login-Bereich von WordPress raus.

Neben Theme und Backend kannst Du in WordPress auch den Login-Bereich an Deine Bedürfnisse (oder die Deiner Kunden) anpassen. So kannst Du zum Beispiel ein Hintergrundbild einfügen, ein eigenes Logo nutzen und das Formular anpassen. Alles, was Du dazu benötigst, sind

Letzteres stellt sicher, dass die Änderungen nach einem Update nicht verloren gehen.

Wie kann ich den Login-Bereich anpassen?

Für die Anpassungen benötigst Du zunächst eine CSS-Datei, die Du am besten in einem Unterordner Deines Child Themes ablegst. In unserem Beispiel legen wir dazu das Verzeichnis „login“ an und speichern darin die Datei login.css. Der Pfad sieht beim Child Theme von Twenty Seventeen dann so aus: /wp-content/themes/twentyseventeen-child/login/login.css.

Verzeichnisstruktur im FTP-Programm

Die Datei login.css wird im Child Theme abgelegt.

Damit das Theme die nachfolgenden Änderungen übernimmt, gibst Du anschließend einfach folgende Zeilen ans Ende der functions.php Deines Child Themes ein:

Hintergrundbild einfügen und Farben ändern

Nachdem das Child Theme vorbereitet ist, kannst Du in die login.css beliebige Anweisungen eingeben. Falls Du ein Hintergrundbild verwenden möchtest, lädst Du das am besten in den Ordner „login“. Mit diesem Code fügen wir zum Beispiel ein Hintergrundbild ein und färben die Links unterhalb des Formulars weiß:

WP Logo durch eigenes Logo ersetzen

Das sieht schon besser aus, es fehlt aber noch das eigene Logo. Dazu lädst Du eine 84 x 84 Pixel große Datei namens login-logo.png in den login-Ordner. Mit folgenden CSS-Zeilen bindest Du das Logo ein:

Login-Bereich mit WP-Logo und STRATO Logo

Login-Bereich mit WordPress-Logo (links) und STRATO Logo

Eingabefelder des Formulars abrunden

Darüber hinaus kannst Du auch das Formular selbst bequem anpassen: Du hättest das Formular und die Eingabefelder gern abgerundet statt eckig? Die Felder mit blauen statt grauen Rahmen? Kein Problem mit diesem Code:

Das Ergebnis ist ein WordPress-Login mit Hintergrundbild, eigenem Logo und einem schöneren Formular:

angepasster WP Login

Login kann auch bunt sein

Es ist so einfach, den Standard-Login von WordPress aufzuwerten. Als Webworker bietest Du Deinen Kunden ein angepasstes System an, das sich im wahrsten Sinne des Wortes von der grauen Masse abhebt. Zusammen mit den Backend-Anpassungen fühlt sich WordPress damit viel mehr wie etwas Eigenes, Individuelles an. So bekommst Du schon beim Einloggen gute Laute. Fazit: Machen! 😉

Tags: Wordpress

Der Autor:

Autor: Christian Lingnau

Ich heiße Christian Lingnau und bin freier Redakteur für Hosting-Themen, insbesondere WordPress.

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *
Bitte beachte, dass sich Dein Kommentar auf den Artikel beziehen sollte. Wenn Du ein persönliches Kundenanliegen besprechen möchtest, wende Dich bitte an unseren Kundenservice auf Facebook, Twitter oder über Hilfe & Kontakt.

Hier bloggen

Philipp Wolf
Online-Redakteur für Blog, Facebook und Co.

Nicole Stutterheim
Schreibt über Domains, Hosting & HiDrive

Michael Poguntke
Berichtet über Homepage-Baukasten, Webshops & Server

Bianca Restorff-Adrion
Schreibt über Karriere & die Menschen bei STRATO

Lisa Kopelmann
Online-Redakteurin für Blog, Facebook und Co.

Christian Lingnau
Bloggt über WordPress & andere CMS

Franz Neumeier
Gibt Tipps zum erfolgreichen Bloggen

Sven Hähle
Kennt sich bei Domains hervorragend aus

Jörg Geiger
Hat für Online-Speicher und Server Tipps parat

Patrick Schroeder
Erzählt Stories über uns als Arbeitgeber