WordPress Autor-Template erstellen

WordPress Autor-Template erstellen

Ein Autor-Template macht Dein Blog persönlicher. Wir zeigen Dir in diesem Beitrag, wie Du eine Vorlage für das Theme Twenty Seventeen erstellst.

Ein Autor-Template bestimmt, wie die Archiv-Seite Deiner Beiträge aussieht. Wenn Du in einem Beitrag auf Deinen Namen klickst, findest Du in der Regel lediglich eine chronologische Auflistung der letzten Beiträge. In nur wenigen Schritten verwandelst Du Dein Archiv in eine individuelle Autoren-Seite mit Bild, biografischen Infos und Kontaktdaten. Alles was Du dafür benötigst, sind ein STRATO Webhosting-Paket, eine WordPress-Installation inklusive Twenty Seventeen und CSS-Kenntnisse.

Child Theme erstellen

Zunächst erstellst Du ein Child Theme für Twenty Seventeen. Auf diese Weise stellst Du sicher, dass die Änderungen bei einem Update nicht verloren gehen. Wie man ein Child Theme erstellt, haben wir in diesem Beitrag beschrieben. Nach der Aktivierung (Design -> Themes) kannst Du zum nächsten Schritt übergehen.

Template hochladen

Um die Archiv-Seite mit einem Autoren-Profil zu versehen, verbinden wir den Code der archive.php von Twenty Seventeen mit diesem Template. Mit der Funktion get_avatar binden wir das Autorenbild ein. Keine Sorge, den kompletten Code der author.php gibt es hier zum Kopieren. Das Template musst Du in das Hauptverzeichnis des Child Themes laden.

FTP-Verzeichnis
Die Datei author.php wird im Hauptverzeichnis des Child Themes von Twenty Sventeen abgelegt.

Profil im Backend ausfüllen

Das Template kann Profilbild, biografische Angaben und Kontaktinfos nur anzeigen, wenn Du diese im Backend eingetragen hast (Benutzer -> Dein Profil). Als Profilbild verwendet Twenty Seventeen das beim Dienst Gravatar hochgeladene Foto. Damit das funktioniert, musst Du Dich dort mit der gleichen E-Mail-Adresse wie im Blog anmelden und ein Bild einstellen. Deine E-Mail-Adresse wird automatisch verlinkt und damit zur Kontaktadresse.

Profil-Einstellungen im Backend
Für ein vollständiges Autoren-Profil brauchst Du nur die Felder im Backend auszufüllen.

CSS anpassen

Per CSS kannst Du anschließend Farben und Abstände anpassen. Die Anweisungen schreibst Du in die style.css Deines Child Themes oder in den Customizer (Design -> Themes -> Customizer -> Zusätzliches CSS). In unserem Beispiel färben wir die Links orange, fügen hellgraue Hintergründe und auf der linken Seite blaue Balken ein.

a {
color: #ff9900;
}

#profile {
background-color: #f4f4f4;
padding: 8px;
float: right;
border-left: solid 8px #0164a5;
}

#profile img {
float: left;
margin-right: 12px;
}

#contact {
background-color: #f4f4f4;
padding: 8px;
line-height: 2;
border-left: solid 8px #0164a5;
}

Fertig! Links siehst Du die originale Archiv-Seite, rechts die angepasste Variante mit Profil:

Autorenprofil vorher und nachher

Persönlich statt Standard

Vor allem der persönliche Charakter unterscheidet ein Blog von einem Nachrichtenportal. Wenn ein Leser auf Deinen Namen klickt, will er mehr über Dich erfahren. Mit dem vorgestellten Template erfüllst Du diese Erwartung besser als mit einem Standard-Archiv. Einmal eingerichtet, wirst Du das Autor-Template nicht mehr missen wollen. 🙂

Schlagworte: ,

Teilen

Sie können erst kommentieren, wenn Sie unseren Datenschutzbestimmungen und den Cookies zugestimmt haben. Aus Datenschutzrechtlichen Gründen dürfen wir andernfalls keine personenbezogenen Daten von Ihnen aufzeichnen.

Klicken Sie dazu einfach unten im Browser Fenster auf den blauen Button Akzeptieren. Nach dem Neuladen der Seite können Sie Ihr Kommentar schreiben.

 

Diese Webseite verwendet Cookies, um die Nutzung der Seite zu verbessern, den Erfolg von Werbemaßnahmen zu messen und interessengerechte Werbung anzuzeigen. Durch die Nutzung dieser Seite erklären Sie sich damit einverstanden. Informationen