So erstellen Sie mit Divi schöne mobile Social Follow Bios (Kostenloser Download!)

Wenn Sie Ihre persönliche Website erstellen, ist es hilfreich, eine Social-Follow-Bio-Seite zu haben, auf die Sie leicht verlinken können. Es ist eine großartige Online-Visitenkarte mit einer Zusammenfassung Ihrer Aktivitäten und wo die Leute Ihre Arbeit sehen können. Die Informationen, die in mobilen Social-Follow-Bios geteilt werden, beschränken sich normalerweise auf Ihr Bild, Ihren Namen, Ihre Berufsbezeichnung, eine kleine Beschreibung und Portfolio-Links. Sie können auch einen zusätzlichen CTA hinzufügen, damit Besucher mit Ihnen in Kontakt treten können.

In diesem Beitrag zeigen wir Ihnen, wie Sie mit Divi zwei schöne mobile Social-Follow-Bios erstellen. Am Ende des Tutorials geben wir auch die JSON-Dateien beider Beispiele frei, damit Sie sofort loslegen können.

Lasst uns anfangen!

Vorschau

Bevor wir in das Tutorial eintauchen, werfen wir einen kurzen Blick auf die beiden Beispiele, die wir von Grund auf neu erstellen werden.

Beispiel 1

Beispiel 2

Beginnen Sie mit der Neuerstellung von Beispiel Nr. 1

Neuen Abschnitt hinzufügen

Hintergrundfarbe

Beginnen wir mit dem ersten Beispiel! Erstellen Sie eine neue Seite oder öffnen Sie eine vorhandene und fügen Sie einen regulären Abschnitt hinzu. Öffnen Sie die Abschnittseinstellungen und fügen Sie eine weiße Hintergrundfarbe hinzu.

• Hintergrundfarbe: #ffffff

Abstand

Gehen Sie dann zu den Abstandseinstellungen des Abschnitts und nehmen Sie einige Änderungen vor. Sie werden feststellen, dass sich die Werte je nach Bildschirmgröße unterscheiden. Wir behalten das gleiche schlanke Design für verschiedene Bildschirmgrößen bei, indem wir die linke und rechte Polsterung im Laufe der Zeit ändern.

• Obere Polsterung: 50px (Desktop & Tablet), 0px (Telefon)
• Untere Polsterung: 50px (Desktop & Tablet), 0px (Telefon)
• Linke Polsterung: 36vw (Desktop), 23vw (Tablet), 0vw (Telefon)
• Rechte Polsterung: 36vw (Desktop), 23vw (Tablet), 0vw (Telefon)

Zeile 1 hinzufügen

Spaltenstruktur

Fahren Sie fort, indem Sie dem Abschnitt eine neue Zeile mit der folgenden Spaltenstruktur hinzufügen:

Hintergrundfarbe

Öffnen Sie die Zeileneinstellungen, ohne noch Module hinzuzufügen, und fügen Sie eine Hintergrundfarbe hinzu.

• Hintergrundfarbe: #333333

Größe

Gehen Sie dann zu den Größeneinstellungen auf der Registerkarte Design und entfernen Sie den gesamten benutzerdefinierten Abstand zwischen der Spalte und der Zeile.

• Machen Sie diese Zeile in voller Breite: Ja
• Benutzerdefinierte Dachrinnenbreite verwenden: Ja
• Dachrinnenbreite: 1

Box Schatten

Wir fügen auch einen Kastenschatten hinzu, um auf größeren Bildschirmgrößen etwas Tiefe zu erzeugen.

• Stärke der Box-Schattenunschärfe: 80px
• Schattenfarbe: rgba(0,0,0,0.3)

Bildmodul hinzufügen

Bild hochladen

Zeit, Module hinzuzufügen! Beginnen Sie mit einem Bildmodul mit einem Verhältnis von 1:1. Das von uns verwendete Bild hat beispielsweise eine Breite und Höhe von '500px'.

Ausrichtung

Nachdem Sie das Bild hochgeladen haben, gehen Sie zum Design-Tab und ändern Sie die Bildausrichtung.

• Bildausrichtung: Mitte

Größe

Wir verkleinern das Bild, indem wir als nächstes die Breite in den Größeneinstellungen ändern.

• Breite: 33%
• Modulausrichtung: Mitte

Grenze

Wir verwandeln das Bild auch in einen Kreis, indem wir '50vw' zu jeder der Ecken in den Rahmeneinstellungen hinzufügen. Darüber hinaus fügen wir mit den folgenden Einstellungen einen weißen Rahmen hinzu:

• Rahmenbreite: 8px
• Rahmenfarbe: #ffffff

Box Schatten

Zu guter Letzt fügen Sie einen Boxschatten hinzu, um ein dimensionales Design zu erstellen.

• Vertikale Position des Kastenschattens: 40px
• Stärke der Box-Schattenunschärfe: 100px
• Schattenfarbe: #000000

Textmodul #1 hinzufügen

H3-Inhalt hinzufügen

Auf zum nächsten Modul! Fügen Sie direkt unter dem Bildmodul ein Textmodul mit einigen H3-Inhalten hinzu.

H3-Texteinstellungen

Fahren Sie fort, indem Sie zur Registerkarte Design gehen und die H3-Texteinstellungen ändern.

• Überschrift 3 Schriftart: Open Sans
• Überschrift 3 Schriftstärke: Halbfett
• Überschrift 3 Textausrichtung: Mitte
• Überschrift 3 Textfarbe: #ffffff
• Überschrift 3 Zeilenhöhe: 0.1em

Abstand

Wir fügen auch einen oberen Rand hinzu, um Platz zwischen dem Bildmodul und diesem Textmodul zu schaffen.

• Oberer Rand: 30px

Textmodul #2 hinzufügen

Inhalt hinzufügen

Das nächste Modul, das wir brauchen, ist ein weiteres Textmodul. Fügen Sie Ihre Berufsbezeichnung zum Inhaltsfeld hinzu.

Texteinstellungen

Gehen Sie dann zur Registerkarte Design und ändern Sie die Texteinstellungen.

• Textschriftart: Open Sans
• Schriftstärke des Textes: Regular
• Textfarbe: #919191
• Textausrichtung: Mitte

Textmodul #3 hinzufügen

Inhalt hinzufügen

Fahren Sie fort, indem Sie ein weiteres Textmodul mit einer kurzen Beschreibung Ihrer Person hinzufügen.

Texteinstellungen

Gehen Sie zu den Texteinstellungen und nehmen Sie einige Änderungen vor.

• Textschriftart: Open Sans
• Textfarbe: #b7b7b7
• Textzeilenhöhe: 1,6em
• Textausrichtung: Mitte

Größe

Ändern Sie auch die Breite des Moduls.

• Breite: 68 %
• Modulausrichtung: Mitte

Abstand

Und fügen Sie etwas oberen und unteren Rand hinzu, um zusätzlichen Platz zu schaffen.

• Oberer Rand: 30px
• Unterer Rand: 30px

Schaltflächenmodul hinzufügen

Kopie hinzufügen

Das nächste und letzte Modul, das wir in dieser Reihe benötigen, ist ein Button-Modul. Fügen Sie eine Kopie hinzu.

Ausrichtung

Wechseln Sie dann zur Registerkarte Design und ändern Sie die Ausrichtung der Schaltflächen, um sie mit den vorherigen Modulen abzugleichen.

• Tastenausrichtung: Mitte

Tasteneinstellungen

Fahren Sie fort, indem Sie das Aussehen der Schaltfläche in den Schaltflächeneinstellungen ändern.

• Benutzerdefinierte Stile für Schaltfläche verwenden: Ja
• Schaltflächentextgröße: 13px
• Schaltflächentextfarbe: #ffffff
• Farbe 1: #ad32ff
• Farbe 2: #32baff
• Verlaufsrichtung: 96deg
• Breite des Tastenrahmens: 0px
• Schaltflächenrandradius: 30px
• Schaltflächenschrift: Open Sans
• Schriftstärke: Ultra Bold
• Schriftstil: Großbuchstaben

Abstand

Fügen Sie als nächstes einen benutzerdefinierten Rand und eine Auffüllung hinzu.

• Unterer Rand: 50px
• Obere Polsterung: 15px
• Untere Polsterung: 15px
• Linke Polsterung: 50px
• Rechte Polsterung: 50px

Box Schatten

Und vervollständigen Sie das Schaltflächendesign, indem Sie einen Kastenschatten hinzufügen.

• Vertikale Position des Kastenschattens: 20px
• Stärke der Box-Schattenunschärfe: 80px
• Schattenfarbe: rgba(0,0,0,0.69)

Zeile 2 hinzufügen

Spaltenstruktur

Auf in die nächste Reihe! Verwenden Sie die folgende Spaltenstruktur:

Hintergrund mit Farbverlauf

Öffnen Sie die Zeileneinstellungen, ohne noch Module hinzuzufügen, und fügen Sie einen Verlaufshintergrund hinzu:

• Farbe 1: #1e1e1e
• Farbe 2: #3f3f3f
• Verlaufstyp: Radial
• Radiale Richtung: Oben links
• Startposition: 26%
• Farbverlauf über dem Hintergrundbild platzieren: Ja

Hintergrundbild

Speichern Sie das folgende Bild auf Ihrem Computer und verwenden Sie es als Hintergrundbild für die Zeile:

Zusammen mit den folgenden Hintergrundeinstellungen:

• Hintergrundbildgröße: Tatsächliche Größe
• Position des Hintergrundbilds: Mitte
• Hintergrundbild wiederholen: Keine Wiederholung
• Hintergrundbild-Mischung: Hartes Licht

Größe

Gehen Sie dann zur Registerkarte Design und entfernen Sie den gesamten Raum zwischen den Spalten und der Zeile. Dies wird uns helfen, den Zeilenraum, den wir erhalten, voll auszunutzen.

• Machen Sie diese Zeile in voller Breite: Ja
• Benutzerdefinierte Dachrinnenbreite verwenden: Ja
• Dachrinnenbreite: 1

Abstand

Fügen Sie als nächstes einige benutzerdefinierte Polster hinzu.

• Obere Polsterung: 84px
• Untere Polsterung: 84px
• Linke Polsterung: 4vw (Desktop), 7vw (Tablet), 14vw (Telefon)
• Rechte Polsterung: 4vw (Desktop), 7vw (Tablet), 14vw (Telefon)

Box Schatten

Zusammen mit einem Kastenschatten.

• Stärke der Box-Schattenunschärfe: 80px
• Schattenfarbe: rgba(0,0,0,0.3)

Anzeige

Um sicherzustellen, dass alle Social Follow-Symbole nebeneinander angezeigt werden, fügen wir dem Hauptelement der Zeile eine einzelne Zeile CSS-Code hinzu.

display: flex;

Fügen Sie das Social Media Follow-Modul zu Spalte 1 hinzu

Ausrichtung

Das erste Modul, das wir in Spalte 1 benötigen, ist ein Social Media Follow Module. Nachdem Sie das Modul hinzugefügt haben, ändern Sie die Elementausrichtung auf der Registerkarte Design.

• Artikelausrichtung: Mitte

Neues soziales Netzwerk hinzufügen

Fahren Sie fort, indem Sie ein neues soziales Netzwerk hinzufügen. In diesem Beispiel verwenden wir Dribbble.

Verknüpfung

Fügen Sie einen Link zu Ihrem Dribbble-Profil hinzu.

Hintergrund mit Farbverlauf

Ändern Sie dann den Verlaufshintergrund mit den folgenden Einstellungen:

• Farbe 1: #ea0061
• Farbe 2: #ea4c8d
• Verlaufsrichtung: 136deg

Abstand

Und erhöhen Sie die Größe des Moduls, indem Sie benutzerdefinierte Polster hinzufügen.

• Obere Polsterung: 20px
• Untere Polsterung: 20px
• Linke Polsterung: 20px
• Rechte Polsterung: 20px

Grenze

Wir verwandeln das Modul auch in einen Kreis, indem wir '20vw' zu jeder der Ecken in den Rahmeneinstellungen hinzufügen.

Box Schatten

Zu guter Letzt fügen Sie einen Boxschatten hinzu.

• Vertikale Position des Kastenschattens: 20px
• Stärke der Box-Schattenunschärfe: 80px
• Schattenfarbe: #000000

Textmodul Nr. 1 zu Spalte 1 hinzufügen

Inhalt hinzufügen

Fügen Sie als nächstes ein Textmodul in die erste Spalte ein.

Texteinstellungen

Ändern Sie die Texteinstellungen.

• Textschriftart: Open Sans
• Schriftstärke des Textes: Ultra Bold
• Textfarbe: #ffffff
• Textausrichtung: Mitte

Textmodul #2 zu Spalte 1 hinzufügen

Inhalt hinzufügen

Fügen Sie einen weiteren unter dem vorherigen hinzu.

Texteinstellungen

Ändern Sie auch die Texteinstellungen dieses Moduls.

• Textschriftart: Open Sans
• Textfarbe: #898989
• Textgröße: 11px
• Textausrichtung: Mitte

Module in Spalte 1 zweimal klonen und Duplikate in verbleibende Spalten platzieren

Sobald Sie alle Module in Spalte 1 angepasst haben, können Sie sie zweimal klonen. Platzieren Sie die Duplikate in den beiden verbleibenden Spalten der Zeile.

Soziale Netzwerke ändern

Natürlich müssen Sie die sozialen Netzwerke ändern.

Links zu sozialen Netzwerken ändern

Zusammen mit den Links.

Ändern Sie die Farbverlaufshintergründe für soziale Netzwerke

Und die Netzwerk-Gradientenhintergründe.

• Farbe 1: #0043ff
• Farbe 2: #00aced

• Farbe 1: #ea2c59
• Farbe 2: #fed270

Beginnen Sie mit der Neuerstellung von Beispiel #2

Neuen Abschnitt hinzufügen

Hintergrundfarbe

Auf zum nächsten Beispiel! Fügen Sie einen neuen Abschnitt mit einer weißen Hintergrundfarbe hinzu.

• Hintergrundfarbe: #ffffff

Abstand

Fügen Sie als nächstes einige benutzerdefinierte Polster hinzu.

• Obere Polsterung: 50px (Desktop & Tablet), 0px (Telefon)
• Untere Polsterung: 50px (Desktop & Tablet), 0px (Telefon)
• Linke Polsterung: 36vw (Desktop), 23vw (Tablet), 4vw (Telefon)
• Rechte Polsterung: 36vw (Desktop), 23vw (Tablet), 4vw (Telefon)

Zeile 1 hinzufügen

Spaltenstruktur

Fahren Sie fort, indem Sie eine neue Zeile mit der folgenden Spaltenstruktur hinzufügen:

Größe

Ohne noch Module hinzuzufügen, gehen Sie zum Design-Tab der Zeileneinstellungen und ändern Sie die Größeneinstellungen.

• Machen Sie diese Zeile in voller Breite: Ja
• Benutzerdefinierte Dachrinnenbreite verwenden: Ja
• Dachrinnenbreite: 1

Bildmodul hinzufügen

Bild hochladen

Zeit, Module hinzuzufügen! Das erste Modul, das wir brauchen, ist ein Bildmodul mit einem Verhältnis von 1:1.

Ausrichtung

Ändern Sie die Bildausrichtung.

• Bildausrichtung: Mitte

Größe

Ändern Sie auch die Breite.

• Breite: 33%
• Modulausrichtung: Mitte

Grenze

Und fügen Sie '20px' zu jeder der Ecken in den Rahmeneinstellungen hinzu.

Box Schatten

Vervollständigen Sie das Bilddesign, indem Sie einen subtilen Kastenschatten hinzufügen.

• Stärke der Box-Schattenunschärfe: 51px
• Schattenfarbe: rgba(0,0,0,0.37)

Textmodul #1 hinzufügen

H3-Inhalt hinzufügen

Das nächste Modul, das wir brauchen, ist ein Textmodul. Fügen Sie einen H3-Gehalt Ihrer Wahl hinzu.

H3-Texteinstellungen

Ändern Sie die H3-Texteinstellungen auf der Registerkarte Design.

• Überschrift 3 Schriftart: Open Sans
• Überschrift 3 Schriftstärke: Ultra Bold
• Überschrift 3 Schriftstil: Großbuchstaben
• Überschrift 3 Textausrichtung: Mitte
• Überschrift 3 Textfarbe: #000000
• Überschrift 3 Buchstabenabstand: -1px
• Überschrift 3 Zeilenhöhe: 0,9em

Abstand

Fügen Sie als nächstes einen oberen Rand hinzu.

• Oberer Rand: 30px

Textmodul #2 hinzufügen

Inhalt hinzufügen

Fügen Sie ein weiteres Textmodul hinzu.

Texteinstellungen

Ändern Sie die Texteinstellungen.

• Textschriftart: Open Sans
• Textfarbe: #919191
• Textausrichtung: Mitte

Zeile 2 hinzufügen

Spaltenstruktur

Fahren Sie fort, indem Sie eine neue Zeile mit der folgenden Spaltenstruktur hinzufügen:

Hintergrundfarbe

Öffnen Sie die Zeileneinstellungen, ohne noch Module hinzuzufügen, und ändern Sie die Hintergrundfarbe der Zeile.

• Hintergrundfarbe: #ffffff

Spalte 2 Hintergrundfarbe

Fügen Sie auch der zweiten Spalte eine Hintergrundfarbe hinzu.

• Spalte 2 Hintergrundfarbe: #effef

Ausrichtung

Stellen Sie sicher, dass Sie die linke Zeilenausrichtung verwenden.

• Reihenausrichtung: Links

Größe

Gehen Sie als nächstes zu den Größeneinstellungen und nehmen Sie einige Änderungen vor.

• Benutzerdefinierte Breite verwenden: Ja
• Einheit: %
• Benutzerdefinierte Breite: 67 %
• Benutzerdefinierte Dachrinnenbreite verwenden: Ja
• Dachrinnenbreite: 1
• Spaltenhöhen ausgleichen: Ja

Abstand

Außerdem fügen wir der Zeile und ihren Spalten einige benutzerdefinierte Auffüllungen hinzu.

• Obere Polsterung: 0px
• Untere Polsterung: 0px
• Spalte 1 obere Polsterung: 20px
• Spalte 1 untere Polsterung: 20px
• Spalte 2 obere Polsterung: 20px
• Spalte 2 untere Polsterung: 20px

Grenze

Fügen Sie '14px' zur oberen linken, oberen rechten und unteren linken Ecke hinzu.

Box Schatten

Und vervollständigen Sie das Reihendesign, indem Sie einen subtilen Kastenschatten hinzufügen.

• Stärke der Box-Schattenunschärfe: 80px
• Schattenfarbe: rgba(0,0,0,0.17)

Fügen Sie das Social Media Follow-Modul zu Spalte 1 hinzu

Ausrichtung

In der ersten Spalte benötigen wir ein Social Media Follow-Modul. Ändern Sie die Elementausrichtung.

• Artikelausrichtung: Mitte

Neues soziales Netzwerk hinzufügen

Fügen Sie dann ein neues soziales Netzwerk hinzu. Wir verwenden Dribbble.

Verknüpfung

Fügen Sie den Link zu Ihrem Dribbble-Portfolio hinzu.

Hintergrund mit Farbverlauf

Und ändern Sie den Farbverlaufshintergrund des sozialen Netzwerks.

• Farbe 1: #ea0061
• Farbe 2: #ea4c8d
• Verlaufsrichtung: 136deg

Abstand

Fügen Sie als nächstes einige benutzerdefinierte Abstandswerte hinzu.

• Obere Polsterung: 20px
• Untere Polsterung: 20px
• Linke Polsterung: 20px
• Rechte Polsterung: 20px

Grenze

Und fügen Sie '10px' zu jeder Ecke des sozialen Netzwerks hinzu.

Box Schatten

Vervollständigen Sie das Moduldesign, indem Sie einen subtilen Kastenschatten hinzufügen.

• Stärke der Box-Schattenunschärfe: 80px
• Schattenfarbe: rgba(0,0,0,0.3)

Textmodul Nr. 1 zu Spalte 2 hinzufügen

Inhalt hinzufügen

Fügen Sie der zweiten Spalte ein Textmodul hinzu.

Texteinstellungen

Ändern Sie die Texteinstellungen entsprechend:

• Textschriftart: Open Sans
• Schriftstärke des Textes: Ultra Bold
• Textfarbe: #000000
• Textausrichtung: Mitte

Abstand

Schaffen Sie Platz, indem Sie als nächstes einen oberen Rand hinzufügen.

• Oberer Rand: 10px

Textmodul #2 zu Spalte 2 hinzufügen

Inhalt hinzufügen

Das zweite Modul, das wir in Spalte 2 benötigen, ist ein weiteres Textmodul.

Texteinstellungen

Ändern Sie die Texteinstellungen.

• Textschriftart: Open Sans
• Textfarbe: #898989
• Textgröße: 11px
• Textausrichtung: Mitte

Zeile 2 klonen

Sobald Sie mit dem Ändern der Zeile fertig sind, können Sie sie einmal klonen.

Module tauschen

Tauschen Sie als nächstes die Module aus.

Hintergrundfarbe für Spalte 1 hinzufügen

Fügen Sie dann der duplizierten Zeile eine Hintergrundfarbe für Spalte 1 hinzu.

• Spalte 1 Hintergrundfarbe: #dbdbdb

Hintergrundfarbe von Spalte 2 entfernen

Entfernen Sie als nächstes die Hintergrundfarbe von Spalte 2.

Zeilenausrichtung ändern

Ändern Sie auch die Zeilenausrichtung.

• Zeilenausrichtung: Rechts

Zeilengröße ändern

Zusammen mit der benutzerdefinierten Breite in den Größeneinstellungen.

• Benutzerdefinierte Breite: 66,99 %

Zeilenrahmen ändern

Wir stellen außerdem sicher, dass '14px' nur der oberen rechten und unteren rechten Ecke zugewiesen wird.

Social Follow-Netzwerk ändern

Fahren Sie fort, indem Sie das soziale Netzwerk ändern.

Ändern Sie den Farbverlaufshintergrund des sozialen Netzwerks

Zusammen mit dem Farbverlaufshintergrund.

• Farbe 1: #0043ff
• Farbe 2: #00aced

Klonen Sie beide Social-Follow-Zeilen

Sobald Sie beide Zeilen für soziale Follower erstellt haben, können Sie jede von ihnen klonen.

Rahmen von Duplikat Nr. 1 ändern

Ändern Sie die abgerundeten Ecken des ersten Duplikats.

Ändern Sie das Social-Follow-Netzwerk von Duplicate #1

Zusammen mit dem sozialen Netzwerk.

Farbverlaufshintergrund von Duplikat Nr. 1 ändern

Und der Hintergrund mit Farbverlauf.

• Farbe 1: #ea2c59
• Farbe 2: #fed270

Ändern Sie die Grenze des Duplikats #2

Fahren Sie fort, indem Sie auch die abgerundeten Ecken des zweiten Duplikats ändern.

Ändern Sie das Social-Follow-Netzwerk von Duplicate #2

Zusammen mit dem sozialen Netzwerk.

Ändern Sie den Farbverlaufshintergrund von Duplikat #2

Und noch einmal der Verlaufshintergrund, der dem sozialen Netzwerk zugeordnet ist.

• Farbe 1: #00306b
• Farbe 2: #007bb6

Laden Sie das Mobile Social Follow Bios KOSTENLOS herunter

Um die kostenlosen mobilen Social-Follow-Abschnitte in die Hände zu bekommen, müssen Sie sie zuerst über die Schaltfläche unten herunterladen. Um Zugang zum Download zu erhalten, müssen Sie unsere Divi Daily-E-Mail-Liste abonnieren, indem Sie das untenstehende Formular verwenden. Als neuer Abonnent erhalten Sie jeden Montag noch mehr Divi-Güte und ein kostenloses Divi-Layout-Paket! Wenn Sie bereits auf der Liste stehen, geben Sie einfach unten Ihre E-Mail-Adresse ein und klicken Sie auf Download. Sie werden nicht „erneut abonniert“ oder erhalten zusätzliche E-Mails.

Laden Sie die Dateien herunter

Kostenlos herunterladen

Melden Sie sich beim Divi-Newsletter an und wir senden Ihnen eine Kopie des ultimativen Divi-Landing-Page-Layout-Pakets sowie jede Menge anderer fantastischer und kostenloser Divi-Ressourcen, Tipps und Tricks per E-Mail zu. Folgen Sie mit und Sie werden in kürzester Zeit ein Divi-Meister. Wenn Sie bereits abonniert sind, geben Sie einfach unten Ihre E-Mail-Adresse ein und klicken Sie auf Download, um auf das Layout-Paket zuzugreifen.

HERUNTERLADEN

Sie haben sich erfolgreich abonniert. Bitte überprüfen Sie Ihre E-Mail-Adresse, um Ihr Abonnement zu bestätigen und Zugang zu kostenlosen wöchentlichen Divi-Layout-Paketen zu erhalten!

Vorschau

Nachdem wir nun alle Schritte durchgegangen sind, werfen wir einen letzten Blick auf das Ergebnis beider Beispiele, die wir neu erstellt haben.

Beispiel 1

Beispiel 2

Abschließende Gedanken

In diesem Beitrag haben wir Ihnen gezeigt, wie Sie beeindruckende Social-Follow-Bios für mobile Geräte erstellen. Sie können diese Designs als Ihre Online-Visitenkarte verwenden und Personen auf diese Seite umleiten, damit sie sich mit Ihnen in Verbindung setzen oder Ihre Portfolio-Links anzeigen können. Wenn Sie Fragen oder Anregungen haben, hinterlassen Sie einen Kommentar im Kommentarbereich unten!