Eine Team-Seite mit Foto, Name und Aufgabe zeigt, wer hinter einer Firma steckt. In Divi 5 baust du sie mit dem Modul „Person“, ein Plugin brauchst du nicht. Das Modul ist ein kleiner Steckbrief: Bild, Name, Position, Text und Links zu sozialen Netzwerken.
Ich baue hier einen Team-Bereich mit drei Personen nebeneinander, das Bild jeweils über dem Text. Getestet mit Divi 5.13 (deutsche Oberfläche), Stand Oktober 2026. Die Namen und Porträts in meinem Beispiel sind Platzhalter.
Eine Zeile mit drei Spalten
Lege auf deiner Seite zuerst eine Zeile mit drei gleich breiten Spalten an. Wenn du Zeilen und Spalten noch nicht kennst: Beim Einfügen einer neuen Zeile bietet Divi die Spaltenlayouts zur Auswahl an. Wähle das mit drei gleichen Spalten. Pro Person kommt ein Modul in eine Spalte.
Das Modul „Person“ einfügen
Fahr mit der Maus in die erste Spalte und klick auf das Plus. Im Dialog „Modul Oder Zeile Einfügen“ tippst du Person ins Suchfeld und wählst das Modul „Person“.
Das Modul heißt „Person“.Das Modul erscheint mit Platzhalterbild links und den Texten „Name Goes Here“ und „Position“ daneben. Die Einstellungen öffnen sich sofort.
So sieht „Person“ direkt nach dem Einfügen aus.Name, Position und Text eintragen
Im Reiter „Inhalt“ liegt in der Gruppe „Text“ alles Wichtige:
- Name: der Name der Person
- Arbeitsstelle: hier trägst du die Position oder Aufgabe ein, zum Beispiel „Geschäftsführung“. Im Modul erscheint sie unter dem Namen
- URL Des Facebook-Profils, X-Profil URL und URL Des LinkedIn-Profils Eingeben.: optionale Links, dazu später mehr
- Fließtext: ein kurzer Text zur Person
Stolperfalle im Fließtext: Wenn du einfach in den Editor tippst, bleibt der Platzhaltertext „Dein Inhalt steht hier …“ stehen und dein Text hängt sich davor. Markiere vorher alles (am Mac Cmd+A, sonst Strg+A) und lösche es.
Fließtext im Editor, der Canvas zeigt es sofort.Das Bild einsetzen
Öffne die Gruppe „Bild“ und klick auf die Vorschau. Es öffnet sich der Dialog „Bild auswählen“ mit den Reitern „Dateien hochladen“ und „Mediathek“. Hier lädst du ein neues Foto hoch oder nimmst eines aus der Mediathek. Ein Klick auf ein Bild zeigt rechts die „Anhang-Details“. Zum Übernehmen klickst du unten rechts auf den blauen Knopf, der bei mir „Ein Bild hochladen“ heißt (die Beschriftung ist etwas irreführend, gemeint ist „übernehmen“).
Bild aus der Mediathek wählen.Beim zweiten Öffnen landet der Dialog übrigens gleich in der Mediathek, das spart einen Klick. Wiederhole das Ganze für die Spalten zwei und drei.
Bild über den Text setzen
Standardmäßig steht das Bild links neben dem Text. Für ein Team-Raster ist es meist schöner über dem Text. Wechsel in den Reiter „Design“ und öffne die Gruppe „Layout“. Dort steht „Layout-Stil: Flex“, und darunter gibt es „Layout-Richtung“, vier Symbole ohne Beschriftung. Beim dritten Symbol erscheint der Tooltip „Spalte“. Das ist der Schalter: Bild oben, Text darunter. Außerdem gibt es „Inhalt Ausrichten“, „Elemente Ausrichten“, „Layout-Umbruch“ sowie „Horizontaler Abstand“ (30 px) und „Vertikaler Abstand“ (20 px).
Die dritte Layout-Richtung („Spalte“) setzt das Bild über den Text.Das musst du für jedes der drei Module einzeln einstellen. Danach sieht der Bereich so aus:
Drei Personen, jeweils Bild oben.Links zu sozialen Netzwerken
Die Felder für Facebook, X und LinkedIn stehen in der Gruppe „Text“. Trag dort die Adresse des Profils ein. Ich habe das nicht ausprobiert, weil meine Beispielpersonen kein Profil haben. Lass die Felder leer, wenn du keine Links willst.
Speichern und prüfen
Klick auf „Speichern“ und schau dir die Seite im Frontend an. Bei mir stehen die drei Personen nebeneinander, jeweils mit Bild, Name, Position und Text.
Der fertige Team-Bereich auf der Live-Seite.Die Bilder werden in diesem Layout recht groß. Mit der Gruppe „Größe Einstellen“ im Reiter „Design“ kannst du das ändern. Auch das habe ich nicht ausprobiert. Bei Kundenfotos lohnt sich ein einheitliches Format (alle quadratisch), sonst wirken die drei Karten schief.
Stolperfallen
- Der Platzhaltertext bleibt im Fließtext stehen: Erst alles markieren und löschen, dann tippen.
- Wo steht die Position? Im Feld „Arbeitsstelle“.
- Bild bleibt links vom Text: Im Reiter „Design“, Gruppe „Layout“, bei „Layout-Richtung“ das Symbol „Spalte“ wählen, und zwar bei jeder Person.
- Der blaue Knopf „Ein Bild hochladen“ lädt nichts hoch: Er übernimmt das markierte Bild aus der Mediathek.
Du arbeitest noch nicht mit Divi? Preise und Lizenzen findest du direkt bei Elegant Themes (Werbung).
