Mit dem Block „Social Profiles“ können Sie auf jeder SeedProd-Seite eine Reihe von verlinkten Social-Media-Symbolen anzeigen. Jedes Symbol ist direkt mit Ihrem Profil auf einer unterstützten Plattform verknüpft, sodass Besucher Ihnen schnell im Internet folgen oder sich mit Ihnen verbinden können. Der Block enthält 12 vorgefertigte Stilvorlagen und unterstützt über 20 Plattformen, darunter Facebook, X (Twitter), Instagram, LinkedIn, YouTube, TikTok, Pinterest, Discord, WhatsApp und mehr.
Über die vorgefertigten Vorlagen hinaus haben Sie die volle Kontrolle über den Stil, die Größe, die Farbe, den Abstand und den Randradius der Symbole. Jeder Eintrag in einem sozialen Profil kann per Drag & Drop neu angeordnet, dupliziert oder unabhängig entfernt werden, sodass Sie ganz einfach genau die Plattformen pflegen können, die Sie hervorheben möchten. Mit einer benutzerdefinierten Option können Sie auch jedes Symbol aus der Symbolbibliothek von SeedProd mit seiner eigenen Farbe und URL für Plattformen hinzufügen, die nicht in der integrierten Liste enthalten sind.
Hinzufügen des Blocks „Soziale Profile“ zu Ihren Seiten
Befolgen Sie diese Schritte, um einen Block „Soziale Profile“ zu Ihrer SeedProd-Seite hinzuzufügen:
Schritt 1: Block hinzufügen
Ziehen Sie unter „Design“ > „Blöcke“ den Block „Soziale Profile“ per Drag & Drop in den gewünschten Bereich Ihrer Seite.
Schritt 2: Inhaltseinstellungen konfigurieren
Klicken Sie nach dem Hinzufügen auf den Block „Soziale Profile“, um dessen Einstellungen zu öffnen. Auf der Registerkarte „Inhalt“ können Sie im Abschnitt „Symbol“ Ihre Liste mit sozialen Profilen verwalten und Anzeigeoptionen konfigurieren.
Verwaltung von sozialen Profilen:
- Profiltyp: Verwenden Sie das Dropdown-Menü neben jedem Eintrag, um die soziale Plattform auszuwählen. Zu den unterstützten Plattformen gehören Discord, E-Mail, Facebook, Facebook Messenger, GitHub, IMDb, Instagram, LinkedIn, Medium, Telefon, Pinterest, RSS, Slack, Snapchat, SoundCloud, Telegram, TikTok, X (Twitter), Vimeo, Weibo, WhatsApp, WordPress, YouTube und Benutzerdefiniert.
- URL: Klicken Sie auf das Zahnrad-Symbol für die Einstellungen bei einem beliebigen Eintrag, um das URL-Feld zu erweitern. Geben Sie den vollständigen Link zu Ihrer Profilseite ein (einschließlich
https://). Für E-Mail-Einträge geben Sie Ihre E-Mail-Adresse ein. Für benutzerdefinierte Einträge können Sie auch ein beliebiges Symbol aus der Symbolbibliothek auswählen und eine benutzerdefinierte Farbe festlegen. - Neu anordnen: Ziehen Sie Einträge mithilfe des Ziehgriffs (Pfeilsymbol) nach oben oder unten, um die Anzeigereihenfolge der Symbole zu ändern.
- Duplizieren/Löschen: Bewegen Sie den Mauszeiger über einen Eintrag, um die Schaltflächen „Duplizieren“ und „Löschen“ für eine schnelle Verwaltung anzuzeigen.
- Neue Freigabe hinzufügen: Klicken Sie unten in der Liste auf die Schaltfläche „+ Neue Freigabe hinzufügen“, um einen weiteren Eintrag für ein soziales Profil hinzuzufügen.
Anzeigeoptionen:
- Stil: Wählen Sie zwischen „Standard“ (nur Symbol, kein Hintergrund) und „Gestapelt“ (Symbol auf einem farbigen Hintergrundquadrat).
- Größe: Legen Sie die Gesamtgröße des Symbols fest – klein, mittel oder groß.
- Ausrichtung: Legen Sie die horizontale Ausrichtung der Symbolreihe fest – links, mittig oder rechts. Unterstützt die gerätespezifische Ausrichtung für Desktop-PCs, Tablets und Mobilgeräte.
Schritt 2a: Wählen Sie einen Vorlagenstil aus.
Auf der Registerkarte „Vorlagen“ können Sie mit einem einzigen Klick einen vorgefertigten Icon-Stil auf Ihren Block „Soziale Profile“ anwenden. Es stehen 12 Stilvorlagen zur Verfügung, die von flachen quadratischen Icons bis hin zu abgerundeten, pillenförmigen und dunklen Varianten reichen. Durch die Auswahl einer Vorlage werden der Icon-Stil, die Größe, der Rahmenradius und die Farbeinstellungen des Blocks sofort an das ausgewählte Design angepasst.
Schritt 3: Design anpassen
Auf der Registerkarte „Erweitert“ können Sie das Erscheinungsbild Ihres Blocks „Soziale Profile“ feinabstimmen.
Stile:
- Stil: Wechseln Sie zwischen den Symbolstilen „Standard“ und „Gestapelt“ (entspricht der Einstellung auf der Registerkarte „Inhalt“).
- Symbolfarbe: Legen Sie eine einzige Farbe fest, die auf alle Symbole im Block angewendet wird und die Standardmarkenfarbe jeder Plattform überschreibt.
- Symbolgröße: Passen Sie die Symbolgröße in Pixeln mithilfe des Schiebereglers (0–100 px) genau an.
- Randradius: Bei Verwendung des Stacked-Stils passen Sie den Eckenradius der Hintergrundquadrate des Symbols an, um quadratische, abgerundete oder vollständig kreisförmige Formen zu erstellen (0–100 px).
- Icon-Abstand: Bei Verwendung des Stacked -Stils können Sie den Abstand zwischen dem Symbol und dem Rand seines Hintergrundcontainers steuern (0–100 px).
- Abstand zwischen: Legt den horizontalen Abstand zwischen den einzelnen Symbolen in der Zeile fest (0–100px).
- Schatten: Fügen Sie den Symbolelementen einen Schatteneffekt hinzu. Wählen Sie aus voreingestellten Größen – Keine, Haarlinie, Klein, Mittel, Groß, X Groß und 2X Groß.
Abstand:
- Rand: Steuere den äußeren Abstand um deinen Block „Soziale Profile“ (oben, rechts, unten, links). Unterstützt gerätespezifische Werte für Desktop, Tablet und Mobilgeräte.
- Abstand: Passen Sie den inneren Abstand innerhalb Ihres Blocks „Soziale Profile“ an (oben, rechts, unten, links). Unterstützt gerätespezifische Werte für Desktop, Tablet und Mobilgeräte.
Attribute:
- CSS-ID: Zeigt die automatisch generierte eindeutige Kennung für Ihren Block „Soziale Profile“ an. Diese ID wird automatisch von SeedProd erstellt und kann für benutzerdefiniertes Styling oder JavaScript-Targeting verwendet werden.
- Benutzerdefinierte Klasse: Fügen Sie benutzerdefinierte CSS-Klassen hinzu, um bestimmte Stile aus Ihrem Theme oder benutzerdefiniertem CSS anzuwenden.
- Benutzerdefinierte Attribute: Fügen Sie beliebige HTML-Attribute zum Block-Wrapper-Element hinzu. Geben Sie jedes Attribut in einer neuen Zeile im folgenden Format ein: Attributname|Wert (z. B. data-section|social).
Geräte-Sichtbarkeit:
- Auf dem Desktop ausblenden: Blendet den Block „Soziale Profile“ auf Desktop-Bildschirmen aus.
- Auf Tablet ausblenden: Blendet den Block „Soziale Profile“ auf Tablet-Geräten aus.
- Auf Mobilgeräten ausblenden: Blockt den Block „Soziale Profile“ auf Mobilgeräten aus.
Animationseffekte:
- Eingangsanimation: Wählen Sie aus verschiedenen Animationseffekten, die abgespielt werden, wenn der Block „Soziale Profile“ in den Bildschirm scrollt. Zu den Optionen gehören „Hüpfen“, „Einblenden“, „Vergrößern“, „Eindrehen“ und viele mehr.
Schritt 4: Speichern Sie Ihre Änderungen
Wenn Sie die Konfiguration des Blocks „Soziale Profile“ und die Anpassung seines Erscheinungsbilds abgeschlossen haben, speichern Sie Ihre Arbeit.
Sie haben erfolgreich einen Block „Soziale Profile“ zu Ihrer Seite hinzugefügt! Mit Unterstützung für über 20 Plattformen, 12 vorgefertigten Stilvorlagen und vollständiger Kontrolle über die Größe, Farbe, den Abstand und den Eckenradius der Symbole lässt sich mit diesem Block ganz einfach ein professioneller Social-Media-Streifen erstellen, der zu jedem Design passt. Probieren Sie die Standard- und gestapelten Stile aus, entdecken Sie die vorgefertigten Vorlagen und ordnen Sie Ihre Profile mit der Drag-and-Drop-Funktion ganz nach Ihren Wünschen an.