So fügen Sie Mitarbeiterprofilseiten in WordPress hinzu

Die Menschen hinter Ihrer Website zu präsentieren, ist eine großartige Möglichkeit, um das Vertrauen der Kunden zu gewinnen. Zuvor haben wir Ihnen gezeigt, wie Sie eine einfache Mitarbeiterliste in WordPress erstellen. Einige unserer Benutzer wollten ihre Mitarbeiterlisten erweitern, indem sie neben den einzelnen Mitarbeitern Links zu ihren Profilseiten hinzufügen. In diesem Artikel zeigen wir Ihnen, wie Sie in WordPress Seiten für Mitarbeiterprofile hinzufügen.

Hinweis: Dieses Tutorial erfordert einige Grundkenntnisse in WordPress-Themes und HTML / CSS. Beachten Sie außerdem, dass es dringend empfohlen wird, die Designdateien mindestens zu sichern, bevor Sie Änderungen an den Designdateien vornehmen.

Als Erstes müssen Sie das Plugin "Simple Staff Lists" installieren und aktivieren. Fügen Sie Ihre Mitarbeiter hinzu, indem Sie besuchen Mitarbeiter »Neu hinzufügen. Weitere Anweisungen zum Hinzufügen von Mitarbeitern finden Sie in diesem Lernprogramm.

Nachdem Sie Ihre Mitarbeiter hinzugefügt haben, können Sie sie anzeigen, indem Sie eine neue WordPress-Seite erstellen und den folgenden Kurzcode hinzufügen:

[simple-staff-list]

Bisher haben wir eine einfache Mitarbeiterlistenseite erstellt, in der alle Mitarbeiter aufgelistet sind.

Der nächste Teil besteht darin, für jeden Mitarbeiter eine einzige Seite zu erstellen, in der die vollständigen Profile angezeigt werden.

Das Plug-In für einfache Personallisten erstellt einen benutzerdefinierten Beitragstyp Mitarbeiter um Mitarbeiterprofile zu speichern. Durch das Platzieren des Kurzcodes auf einer Seite haben wir diese Seite in eine benutzerdefinierte Beitragstyp-Archivseite für den Beitragstyp des Mitarbeiters umgewandelt.

In WordPress erhält jeder Beitrag eine eigene Seite, unabhängig davon, in welchem ​​Beitragstyp er gespeichert ist. Standardmäßig zeigt das Plugin diese einzelne Seite nicht an. In den nächsten Schritten ändern wir unser WordPress-Theme, um die einzelne Mitarbeiter-Seite anzuzeigen.

Zuerst musst du zu gehen Mitarbeiter »Vorlagen. Ersetzen Sie die Vorlage, die Sie unter sehen Staff-Loop-Vorlage mit diesem Code:

 [staff_loop]     [Personalname-formatiert] [Personalposition formatiert] [Bio-Mitarbeiterformat] [Personal-E-Mail-Link] [/ Staff_loop] 

Vergessen Sie nicht, example.com durch Ihren eigenen Domainnamen zu ersetzen.

Öffnen Sie nun Ihre Mitarbeiterlistenseite, und Sie werden sehen, dass die Mitarbeiterprofile und -fotos mit den jeweiligen Profilseiten verlinkt werden. Durch Klicken auf diese Seiten wird jedoch nur eine Seite mit dem Namen des Mitarbeiters angezeigt.

Hinzufügen einer Mitarbeiterprofilvorlage in Ihrem WordPress-Theme

Um Ihren einzelnen Mitarbeiter anzuzeigen, müssen Sie eine Vorlage in Ihrem WordPress-Design erstellen, um den Beitragstyp des Mitarbeiters zu bearbeiten. Erstellen Sie zunächst eine neue Datei in Ihrem WordPress-Designverzeichnis (wp-content / themes / yourthemename /)..

Benennen Sie diese Datei single-staff-member.php. Verwenden Sie einen benutzerdefinierten Beitragstypnamen mit dem Wort Single, Wir haben eine einzelne Beitragsvorlage für den benutzerdefinierten Beitragstyp der Mitarbeiter erstellt.

Diese Mitarbeiter-Vorlage ist noch leer, also füllen wir sie aus. Öffne dein Thema single.php Datei und Kopie fügen Sie den Inhalt in die Vorlage "single-staff-member.php" ein.

Ein Problem, auf das Sie beim Kopieren von Inhalten Ihrer Website stoßen werden single.php Datei ist, dass einige Themes Inhaltsvorlagen in der Datei single.php verwenden. Das Standarddesign von Twenty Thirteen verwendet beispielsweise Inhaltsvorlagen in der Datei single.php wie folgt:

Wenn Ihr Design Schablonenteile verwendet, müssen Sie die Vorlagendatei (content.php) öffnen und den Inhalt in Ihre Datei single-staff-member.php einfügen. Dabei wird die Zeile get_template_part ersetzt.

Zu diesem Zeitpunkt ist Ihre single-staff-member.php-Datei genau dieselbe wie Ihre single.php-Datei. Jetzt müssen wir es vorbereiten, damit es die Felder der Mitarbeiter anzeigen kann.

Hier ist unser single-staff-member.php Die Datei basiert auf der single.php-Datei von Twenty Thirteen. Sehen Sie sich zuerst den Code an.

 ';  else $ t_photo_url = "; $ t_photo =";  $ email_mailto = '' .antispambot ($ email). ''; ?> 
            
Facebook | Twitter
      

Im ersten Teil des Codes direkt nach dem Laden des Headers haben wir Daten aus unserem benutzerdefinierten Beitrag in Variablen gesammelt. Innerhalb der Schleife haben wir diese Variablen verwendet, um Felder aus dem benutzerdefinierten Beitragstyp anzuzeigen.

Das ist alles. Möglicherweise müssen Sie das Erscheinungsbild Ihrer Profilseiten mit CSS anpassen. Wir haben dieses CSS verwendet, um den Mitarbeiter bio um das Foto herum anzupassen.

 img.staff-member-page-photo float: left; Marge: 5px;  

Wir hoffen, dass dieser Artikel Ihnen geholfen hat, Mitarbeiterprofilseiten in WordPress hinzuzufügen. Fühlen Sie sich frei, mit den Vorlagen herumzuspielen, um das gewünschte Ergebnis zu erhalten.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie unseren YouTube-Kanal für weitere WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Google+.