Wie man Icon Blocks einrichtet

ℹ️ Note: Dieser Artikel wurde automatisch mit AI übersetzt und kann Ungenauigkeiten enthalten. Wenn etwas falsch aussieht, kontaktieren Sie bitte unser Support-Team.

Erfahren Sie, wie Sie Icon-Blöcke hinzufügen und konfigurieren, um die wichtigsten Wertversprechen Ihres Shops wie kostenlosen Versand, sichere Kasse, einfache Rücksendungen, schnelle Lieferung und mehr hervorzuheben.

Icon Blocks helfen, das Kundenvertrauen zu verbessern und wichtige Storefront-Informationen visuell ansprechender zu gestalten.

✅ Schritt 1: Open Icon Blocks Einstellungen

1️� Gehen Sie zu Shopify Admin → Apps → Hoppy Trust Badges App.

2️� Klicken Sie auf Erstellen Sie ein neues Badge.

✅ Schritt 2: Wählen Sie Ihre Platzierung

Wählen Sie aus den verfügbaren Platzierungsoptionen aus, wo die Icon-Blöcke angezeigt werden sollen.

📍 Verfügbare Platzierungstypen

Produktseite

• Icon Blocks direkt auf Produktseiten anzeigen
• Hilft Kunden, sich vor dem Kauf sicherer zu fühlen

Fuß

• Anzeige von Icon-Blöcken im Footer-Bereich
• Haltet Trust Messaging über die Storefront sichtbar

Schwimmende Icons

• Display Floating Icon Blocks während Kunden scrollen
• Normalerweise in Bildschirmecken für eine bessere Sichtbarkeit positioniert

Warenkorbschublade

• Icon Blocks im Mini Cart oder Slide-Out Cart anzeigen
• Verstärkt das Vertrauen während der Cart-Erfahrung

Warenkorbseite

• Display Icon Blockiert direkt auf der Warenkorbseite vor dem Checkout
• Hilft, das Zögern vor dem Kauf zu reduzieren

Checkout Seite

• Display Icon Blocks während der Shopify Checkout-Prozess
• Hilft, das Vertrauen vor Auftragsabschluss zu stärken
• Nur verfügbar für Shopify Plus Händler

Zollstelle

• Manuelle Platzierung von Icon Blocks genau dort, wo sie gebraucht werden
• Die Positionierung kann mit dem Shopify Theme Editor

✅ Schritt 3: Icon-Blocks einrichten

Innerhalb der Inhalt Tab, lokalisieren Sie die Abzeichentyp Dropdown und Select:

Icon Blöcke

📝 Blockinhalt konfigurieren

Innerhalb der Blockinhalt Abschnitt:

• Fügen Sie einen internen Blocknamen für eine einfachere Verwaltung in Ihrem Admin-Dashboard hinzu
• Dieser Name ist nur innerhalb des Admin-Bereichs sichtbar und wird den Storefront-Besuchern nicht angezeigt

✍️ Konfigurieren Sie Promotional Text

Sie können das Messaging, das neben den Icons angezeigt wird, anpassen.

Verfügbare Felder

Titel

Fügen Sie die primäre Nachricht für den Icon Block hinzu.

Beispieltitel

• Freier Versand
• Sicherer Checkout
• Easy Returns
• Schnelle Lieferung

Unterrubrik

Fügen Sie eine unterstützende Nachricht unter dem Titel hinzu.

Beispielunterpositionen

• Keine Extrakosten
• 100% sichere Zahlungen
• Hassle-Free Returns
• Schiffe innerhalb von 24 Stunden

🎨 Wählen und Verwalten von Icons

Sie können die Icons, die im Icon Block angezeigt werden, anpassen.

Verfügbare Aktionen

• Wählen Sie Icons aus der integrierten Icon Library
• Bestehende Icons ersetzen
• Entfernen Sie unerwünschte Icons
• Fügen Sie mehrere Icons nebeneinander hinzu

Unterstützte Beispiele sind

• Visum
• Mastercard
• PayPal
• Streifen
• Schiffssymbole
• Sicherheitssymbole

📤 Laden Sie Custom Icons hoch

Neben der integrierten Icon Library können Sie auch benutzerdefinierte Icons direkt von Ihrem Gerät hochladen.

Dies ermöglicht mehr Flexibilität für Stores mit benutzerdefiniertem Branding oder einzigartigen visuellen Assets.

➕ Mehr Icons hinzufügen

Klicken Neues Icon hinzufügen zusätzliche Icons innerhalb desselben Icon-Blocks einzufügen.

💡 Mehrere Icons können für eine stärkere Vertrauensstärkung zusammen angezeigt werden.

🔗 Konfigurieren Sie Call to Action (CTA)

Jeder Icon Block kann optional anklickbares Verhalten enthalten.

Verfügbare CTA-Typen

Kein Aufruf zum Handeln

Icons bleiben statisch und nicht klickbar.

Dies ist nützlich, wenn die Icons nur für visuelle Vertrauensbildung gedacht sind.

Button mit Link hinzufügen

Erstellt einen separaten anklickbaren Button neben oder unter den Symbolen.

Dies ist nützlich, wenn Sie Kunden zu:

• FAQ Seiten
• Schifffahrtspolitik
• Rückkehrpolitik
• Sicherheitsinformationen

Link zum ganzen Block hinzufügen

Macht den gesamten Icon Block klickbar.

Dies schafft ein nahtloseres Besuchererlebnis, indem Kunden überall im Block klicken können.

💡 Dies funktioniert besonders gut, um Kunden mit Vertrauens-, Versand- oder Richtlinienseiten zu verknüpfen.

📌 Verfügbare Streckenziele

Sobald ein CTA-Typ ausgewählt ist, können Sie auswählen, wohin Kunden umgeleitet werden sollen.

Produktseite

Redirect Besucher direkt zu einem Shopify Produkt.

Sammlungsseite

Redirect Besucher zu einem Shopify Sammlung.

Custom URL

Redirect Besucher zu:

• Nutzungsbedingungen
• Über uns Seite
• Schifffahrtspolitik
• Externe Seiten

🛒 Produktbindung

Wenn die Produktseitenverlinkung ausgewählt ist:

→ Verwendung Auswählen des Produkts um das Zielprodukt direkt von Ihrem Shopify Lager.

🔄 Icons anordnen

Sie können das Icon-Layout und die Anordnung einfach verwalten.

Verfügbare Aktionen

• Mehrere Icons hinzufügen
• Einzelne Icons entfernen
• Icon-Kombinationen für sauberere Layouts neu ordnen

⚠️ Zu viele Symbole zusammen können den Abstand auf kleineren mobilen Bildschirmen beeinflussen.

✅ Schritt 4: Designeinstellungen anpassen

Offen Design Tab, um Ihre Icon Blocks zu stylen.

Verfügbare Entwurfskontrollen

Sichtbarkeit

Wählen Sie:

• Desktop & Mobile
• Desktop nur
• Nur mobil

Typografie & Farben

Customize:

• Schriftarten
• Textgrößen
• Hintergrundfarben
• Grenzen
• Abstand

⚠️ Wichtig:

Benutzerdefinierte Farbbearbeitung ist nur für unterstützte eingebaute Icons verfügbar.

Hochgeladene benutzerdefinierte Bilder und bestimmte Standard-Zahlungslogos können ihre ursprünglichen Farben beibehalten.

Animationen

Wählen Sie Animationsstile, damit sich Icon Blocks dynamischer und auffälliger anfühlen.

💡 Subtile Animationen funktionieren oft am besten, ohne ablenkend zu werden.

✅ Schritt 5: Platzierung und Sichtbarkeit konfigurieren

Navigieren Sie zum Platzierung & Sichtbarkeit Tab.

Verfügbare Kontrollen

Seiten

Wählen Sie, wo die Icon-Blöcke erscheinen sollen:

• Alle Seiten
• Homepage nur
• Produktseiten
• Sammlungsseiten

Geräte

Kontrollsicht für:

• Desktop
• Mobil
• Beide

Position

Positionieren wie:

• Links unten
• Rechts unten
• Inline-Positionen

Zeitplan

Optional konfigurieren:

• Starttermine
• Endtermine
• Vorübergehende Sichtbarkeit der Kampagne

✅ Schritt 6: Speichern und Veröffentlichen

Sobald Ihre Icon-Blöcke vollständig konfiguriert sind:

• Klicken Sparen
• Dann klicken Veröffentlichen

Nach der Veröffentlichung:

→ Besuchen Sie Ihre Storefront und überprüfen Sie, ob die Icon-Blöcke an der ausgewählten Stelle korrekt angezeigt werden.

💡 Quick Troubleshooting Tipp

Wenn die Icon-Blöcke nach der Veröffentlichung nicht auf Ihrer Storefront erscheinen:

Ihr Shopify Theme blockiert möglicherweise das App-Embed.

Um dies zu beheben

1. Gehen Sie zu Shopify Admin → Online-Shop → Themen
2. Klicken Bearbeiten Theme über dein Live-Thema
3. Offen App Embeds von der Seitenleiste
4. Umschalter Hoppy Trust Badges (Badges & Icons) → IN
5. Klicken Sparen

✅ Endergebnis

Nach erfolgreicher Konfiguration tragen Icon Blocks dazu bei, dass sich Ihre Storefront vertrauenswürdiger, informativer und conversion-orientierter anfühlt.

Mit der richtigen Einrichtung:

✅ Kunden gewinnen mehr Vertrauen vor dem Kauf
✅ Wichtige Store Policys werden sichtbarer
✅ Trust Messaging fühlt sich sauberer und professioneller an
✅ Storefront Engagement verbessert
✅ Checkout Zögern kann reduziert werden
✅ Glaubwürdigkeit der Marke wird stärker

Icon Blocks funktionieren am besten, wenn sie mit sauberen Layouts, ausgewogenen Abständen und sinnvollen vertrauensorientierten Nachrichten kombiniert werden.

Aktualisiert am: 10/09/2026