Thunder Page Speed Optimizer hilft bei der Leistungsseite von Vertrauenselementen: Symbolbilder, Einbettungen von Fußzeilen-Apps und Vertrauensabzeichen-Skripte sollten die Seite niemals langsamer machen. Benutzen Thunder , um Skripte und Assets unter Kontrolle zu halten, während Sie den Theme-Code unten korrigieren.
Schnelle Lösung mit Thunder
Zahlungssymbole sind klein, aber die Apps, die Händler zum Thema Vertrauen installieren, können umfangreich sein: Bewertungsabzeichen, Sicherheitssiegel, Popup-Tools und Fußzeilenskripte. Wenn diese Assets das Rendern verzögern, kann die Fußzeile auf Mobilgeräten fehlerhaft aussehen oder zu spät springen.
Thunders Funktionen verbessert automatisch das Laden von Skripten und die Seitengeschwindigkeit. Kombinieren Sie dies mit den manuellen Überprüfungen der Zahlungssymbole hier, damit Ihre Fußzeile sowohl vertrauenswürdig als auch schnell ist.
Optimieren Sie FußzeilenskripteÜberprüfen Sie zuerst die Fußzeileneinstellungen des Themes
Gehen Sie zu „Online-Shop“, „Anpassen“, „Fußzeile“ und suchen Sie nach einer Einstellung namens „Zahlungssymbole anzeigen“, „Zahlungsmethoden“ oder „Zahlungssymbole“. Aktivieren Sie es, speichern Sie es und zeigen Sie es in einem Inkognito-Fenster in der Vorschau an. Einige Themes verfügen über separate Fußzeilenvoreinstellungen für Desktop und Mobilgeräte, also testen Sie beide.
Wenn die Einstellung aktiviert ist und nur PayPal angezeigt wird, gibt der Fußzeilencode möglicherweise nur die Zahlungsarten wieder, die Shopify für Ihr Gateway erkennt. Gateways von Drittanbietern wie lokale Bankanbieter, regionale Zahlungsabwickler oder manuelle Zahlungsmethoden werden nicht immer den Standard-SVG-Symbolen von Shopify zugeordnet.
Footer Trust ist Teil eines umfassenderen Konvertierungssystems. Kombinieren Sie dies mit dem Verkehr, aber keine Verkaufscheckliste, Shopify-Store-Audit-Leitfaden, und Checkout-Geschwindigkeitsratgeber.
Korrigieren Sie die Fußzeilenflüssigkeit für Shopify-Zahlungssymbole
Die meisten Themes rendern Zahlungssymbole durch Schleifen shop.enabled_ payment_types. Wenn diese Schleife entfernt, auskommentiert oder in verstecktes Markup eingeschlossen wird, verschwinden die Symbole auch dann, wenn die Zahlungseinstellungen korrekt sind.
{% if section.settings.show_payment_icons %}
<ul class="list-payment" role="list">
{% for type in shop.enabled_payment_types %}
<li class="list-payment__item">
{{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
</li>
{% endfor %}
</ul>
{% endif %} Wenn Sie akzeptierte Zahlungsarten fest codieren müssen, halten Sie die Liste kurz und gültig. Schlechte Zitate, gebrochene Kommentare und nicht geschlossen li -Tags sind häufige Ursachen für Fehler beim Speichern von Fußzeilen.
{% assign payment_types = 'visa,master,american_express,paypal,apple_pay,google_pay' | split: ',' %}
<ul class="list-payment" role="list">
{% for type in payment_types %}
<li class="list-payment__item">
{{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
</li>
{% endfor %}
</ul> Gateways von Drittanbietern benötigen möglicherweise benutzerdefinierte Symbole
Shopifys Standard-Zahlungssymbol-Helfer deckt bekannte Zahlungsarten ab. Es werden nicht automatisch Symbole für jede lokale Bankmethode, manuelle Überweisungsmethode oder jeden Drittanbieter erstellt. Wenn Ihr Anbieter nicht in der Liste der unterstützten Typen aufgeführt ist, fügen Sie manuell ein kleines optimiertes SVG- oder WebP-Symbol hinzu und kennzeichnen Sie es barrierefrei.
Laden Sie kein riesiges PNG-Sprite für eine Reihe winziger Fußzeilensymbole hoch. Halten Sie benutzerdefinierte Symbole klein, legen Sie eine explizite Breite und Höhe fest und vermeiden Sie das Laden einer Symbolschriftart nur für Zahlungsmarkierungen. Die Leitfaden zur Shopify-Bildoptimierung und explizite Anleitung zu Bildabmessungen decken die Leistungsgrundlagen ab.
Verwenden Sie für das Grundverhalten von Shopify den offiziellen Shopify-Zahlungsdokumentation und die eigenen Symbolrichtlinien Ihres Gateways.
Überprüfen Sie CSS- und Footer-App-Konflikte
Überprüfen Sie die Fußzeile in DevTools. Wenn die Symbolmarkierung vorhanden, aber unsichtbar ist, suchen Sie nach Anzeige:keine, Sichtbarkeit: ausgeblendet, weiße Symbole auf weißem Hintergrund, Nullbreite, Überlaufbeschneidung und Flex-Wrapping, das Symbole auf Mobilgeräten vom Bildschirm verschiebt.
Trust-Badge-Apps können auch Zahlungssymbole ersetzen oder duplizieren. Deaktivieren Sie Fußzeilen-Badge-Apps in einem duplizierten Design und testen Sie es erneut. Wenn die Symbole zurückkehren, entscheiden Sie, ob die App die Geschwindigkeit und die Wartungskosten wert ist. Die App-Reste-Guide ist nützlich, wenn eine deinstallierte Trust-App Snippets hinterlassen hat.
Für eine vollständige Leistungsbereinigung folgen Sie den Anweisungen vollständiger Leitfaden zur Shopify-Geschwindigkeitsoptimierung und Anleitung zur Bereinigung nicht verwendeter CSS- und JavaScript-Dateien.
Manueller Fix vs. Thunder Fix
| Problem | Manuelle Korrektur | Donnerfix |
|---|---|---|
| Fußzeileneinstellung deaktiviert | Aktivieren Sie Zahlungssymbole im Theme-Editor. | Nicht anwendbar. |
| Defekter Flüssigkeitskreislauf | Stellen Sie die Zahlungssymbolschleife sicher wieder her. | Kein Liquid-Code-Ersatz. |
| Skripte für starke Vertrauensabzeichen | Skripte manuell entfernen oder zurückstellen. | Automatisiert Verbesserungen beim Laden von Skripten. |
| Übergroße benutzerdefinierte Symbole | Bilder komprimieren und Abmessungen festlegen. | Unterstützt eine umfassendere Leistungsbereinigung. |
Wenn die Vertrauensbereinigung Teil eines größeren Leistungsprojekts wird, vergleichen Sie Thunder-Preise mit professionelle Shopify-Geschwindigkeitsoptimierung.
FAQ
Warum werden Shopify-Zahlungssymbole nicht in meiner Fußzeile angezeigt?
Die Fußzeileneinstellung ist möglicherweise deaktiviert, das Theme stellt möglicherweise nur die von Shopify aktivierten Zahlungsarten dar, das benutzerdefinierte Fußzeilen-Liquid ist möglicherweise fehlerhaft, CSS verbirgt möglicherweise die Symbole oder ein Gateway eines Drittanbieters wird möglicherweise nicht dem Standardsymbolsatz von Shopify zugeordnet.
Warum wird in meiner Shopify-Fußzeile nur PayPal angezeigt?
PayPal kann angezeigt werden, wenn andere aktivierte Zahlungsarten nicht über die Zahlungssymbolschleife des Themes angezeigt werden. Dies ist häufig bei Gateways von Drittanbietern, benutzerdefinierten Designs oder Fußzeilencode der Fall, der eine kurze Symbolliste fest codiert.
Kann ich Zahlungssymbole in Shopify Liquid manuell hinzufügen?
Ja, aber verwenden Sie unterstützte Zahlungsartennamen und testen Sie die Fußzeile nach dem Speichern. Eine fehlerhafte Liquid-Syntax oder nicht geschlossene Tags können die Fußzeile beschädigen oder das Speichern von Themes verhindern.
Beeinflussen Zahlungssymbole in der Fußzeile die Konvertierung?
Sie können das Vertrauen am Ende der Seite verbessern, insbesondere bei unbekannten Marken. Sie reparieren eine fehlerhafte Zahlungseinrichtung nicht, helfen Käufern jedoch dabei, akzeptierte Methoden vor dem Bezahlen zu erkennen.
Können Zahlungssymbole einen Shopify-Shop verlangsamen?
Simple SVG payment icons are usually cheap. Problems come from oversized custom icon images, icon fonts, footer app embeds, and scripts loaded around trust badges.
Halten Sie Vertrauenselemente sichtbar und schnell.
Thunder helps keep footer scripts, trust badges, and storefront assets from slowing shoppers down.