FROM CACHE - de_header

Hilfe beim Einfügen von Favicon-Code benötigt

Molodetz
Entdecker
23 1 4

 

Hallo liebe Shopify-Community,

 

ich habe kürzlich auf https://realfavicongenerator.net/ einen Code für verschiedene Favicons generiert, um die Browser- und Geräte-Kompatibilität meiner Website zu verbessern. Der Code sieht wie folgt aus:

 

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#2b5797">
<meta name="theme-color" content="#ffffff">

 

Der Code beinhaltet verschiedene Arten von Favicons:

  • Apple Touch Icons für Apple Geräte Lesezeichen
  • Standard Favicons für Browser-Tabs und Lesezeichen
  • Ein Manifest für die Konfiguration von App-ähnlichem Verhalten auf Mobilgeräten
  • Ein Mask Icon für Safari-Pinned-Tabs auf macOS
  • Farbeinstellungen für Microsoft Tiles und Android Chrome Theme

Ich bin mir jedoch unsicher, wo genau ich diesen Code in meinem Shopify-Theme einfügen soll. Ich habe bereits versucht, ihn in den <head> Bereich meines theme.liquid-Templates einzufügen, aber leider ohne Erfolg. Gibt es eine bestimmte Stelle, an der dieser Code eingefügt werden muss, oder gibt es bessere Methoden, diese Anpassungen vorzunehmen? Leider bin auch der Webseite realfavicongenerator nicht weiter fündig geworden.

 

Ich bin für jegliche Hinweise oder Empfehlungen sehr dankbar!

 

Greetings

Antonio Lepre | Aspiring eCommerce Titan

New to the Shopify Community
Dreaming Big & Building Bigger with Shopify
Let's Connect & Grow Together!

“On a journey to build an empire with Shopify. Let’s make eCommerce history.”
2 ANTWORTEN 2

Ben310
Seefahrer
427 56 115

Warum machst du es nicht über diesen Weg  um es dir viel einfacher zu machen und dein Theme nicht aus den Theme Updates auszuschließen?


Änderungen zu deinem Theme Code können 1) die Page Loading Speeds negativ beeinflussen und 2) dein Theme aus den Theme Updates ausschließen.  

Molodetz
Entdecker
23 1 4

Vielen Dank für deine Antwort und die wertvollen Hinweise. Wir haben das Favicon auf diese Weise integriert. Das Ziel war es, eine universelle Lösung zu finden, die auf verschiedenen Plattformen und Geräten gut funktioniert, einschließlich Safari, Windows, Chrome und bei der Speicherung der Webseite als App auf OS und Android. Deine Erklärung, dass Anpassungen am Theme-Code sowohl die Ladezeiten der Seite negativ beeinflussen als auch das Theme von zukünftigen Updates ausschließen könnte, hat mich überzeugt erst einmal da die Finger davon zu lassen. Ich schätze deine Hilfe sehr, danke dir für die informativen Hinweise.

Antonio Lepre | Aspiring eCommerce Titan

New to the Shopify Community
Dreaming Big & Building Bigger with Shopify
Let's Connect & Grow Together!

“On a journey to build an empire with Shopify. Let’s make eCommerce history.”