Cum se adaugă un Shopify Favicon pentru dvs Shopify Magazin

Identitatea magazinul dvs. de comerț electronic reunește mai multe elemente, cum ar fi sigla, culorile site-ului și fișierul dvs. materiale de marketing. Această identitate vă întărește marca generală și creează un memento sănătos pentru clienții dvs., evocând sentimente de confort și fiabilitate atunci când văd imaginile și culorile mărcii dvs.

Deși de dimensiuni mici, Favicon-ul se leagă și de această strategie de branding. În acest tutorial, vă vom arăta cum să creați și să adăugați o favicon la dvs Shopify stoca, rotunjind aspectul dvs. online și facilitând recunoașterea magazinului dvs. atunci când clienții vizitează.

Ce e Shopify Favicon?

A Shopify Favicon, sau orice alt Favicon, este o pictogramă mică pentru site-ul dvs. web, care apare în fila browserului de lângă numele site-ului dvs. web.

Bara de adrese a browserului este cea mai obișnuită zonă pentru vizualizarea site-ului Favicon, dar apare și în următoarele locații:

• Aplicații din bara de instrumente
• Marcaje
• Rezultatele istoriei
• Căutați bare
• Uneori, când este distribuit pe rețelele de socializare

În esență, ori de câte ori browserul trebuie să afișeze un link către site-ul dvs. web și nu există prea mult spațiu pentru alte conținuturi, acesta înlocuiește sigla dvs. obișnuită, de dimensiuni mari, cu Favicon.

În mod implicit, Shopify adaugă Shopify sigla pentru Favicon dvs., așa că trebuie să o schimbăm.

Un favicon bun este adesea o versiune mai mică a logo-ului dvs., dar uneori variază puțin, deoarece doriți să vă asigurați că sunt vizibile, ocupă tot spațiul alocat și adăugați un pic de culoare lângă numele site-ului dvs. web.

În mod implicit, toate browserele acceptă Favicons cu dimensiunea de 32 × 32 pixeli. Aceasta este o imagine destul de mică, dar cu ajutorul unor generatoare online îți poți face propria Shopify Favicon pentru site-ul dvs. web. De asemenea, imaginile mai mari sunt oricum reduse, deci nu trebuie neapărat să le aduceți exact la 32 × 32.

Un Favicon are un sens pentru magazinele online de pe Shopify deoarece sunt ușor de adăugat și este important să vă consolidați identitatea mărcii ca vânzător online. Unii susțin, de asemenea, că ajută la SEO.

Continuați să citiți pentru a afla mai multe despre cum să adăugați Favicon la dvs. Shopify magazin.

Cum să adăugați un Favicon la dvs. Shopify Magazin – Ghid rapid

După cum sa menționat, atunci când rulați un site prin Shopify adaugă automat un Shopify logo-ul ca Favicon al site-ului dvs. Nu este nimic în neregulă cu asta, dar este mult mai profesionist și orientat spre brand să includă propriul logo. Iată pașii pe care trebuie să-i urmezi:

Pasul 1: Accesați dvs Shopify Tabloul de bord

De aceea, du-te la Shopify tabloul de bord și faceți clic pe Magazin online sub Canalele de vânzări.

Pasul 2: Navigați la Setările temei

Navigați la Teme și faceți clic pe butonul Personalizare de lângă tema curentă. Deși setările se schimbă de la temă la temă, toate cele mai recente Shopify temele au o secțiune pentru a schimba Favicon.

În Shopify personalizator, derulați în partea de jos a listei din stânga și faceți clic pe Setări temă.

Pasul 3: Selectați butonul Favicon

În noua secțiune, găsiți și selectați butonul Favicon.

Acest lucru afișează un buton pentru Selectare imagine sau Explorare imagini gratuite. Nu-mi pot imagina că au imagini gratuite care se potrivesc cu sigla dvs., deci este mai bine să faceți clic pe Selectare imagine pentru a încărca o imagine personalizată de pe computer.

Pasul 4: Încărcați-vă Favicon

Alegeți fișierul Favicon și încărcați-l în Shopify.

După aceea, veți vedea o previzualizare a pictogramei Favicon. Pentru a face modificările permanente, selectați butonul Salvare din Shopify.

Pentru a vizualiza Shopify favicon în acțiune, accesați frontendul site-ului dvs. web și uitați-vă la fila curentă a browserului. Ar trebui să vedeți Favicon lângă titlul site-ului dvs.

Sfaturi pentru crearea Faviconului

Deși pare ușor să generezi o mică pictogramă, este important să o faci corect, având în vedere că clienții văd Favicon ori de câte ori vin pe site-ul tău. De asemenea, este ușor să faci un Favicon care este neclar sau care nu umple întreg spațiul, învingând scopul Faviconului, deoarece nu este atât de vizibil pentru ochi.

Pentru a rezolva orice probleme, iată câteva sfaturi pentru crearea dvs. Shopify Favicon:

• Porniți designul mai mare de 32 × 32 și micșorați-l dacă este necesar. Sunteți obligat să aveți o imagine mai estompată dacă încercați să întindeți o imagine mai mică în spațiu. De exemplu, luarea unei imagini de 32 × 32 de la Hatchful și încercarea de a o întinde pentru a scăpa de partea scrisă a siglei poate cauza probleme.
• De obicei, nu vă puteți lua doar sigla actuală și vă așteptați să funcționeze perfect ca Favicon.
• Favicon arată minunat atunci când acoperiți fiecare pixel din spațiul oferit. Nu aveți prea mult spațiu, așa că ar trebui să profitați de fiecare square pixel în spațiul 32 × 32.
• Eliminați tot textul, deoarece este greu de citit într-un Favicon. Excepția este dacă elementul dvs. logo principal este o literă mare.
• Trageți pentru culori solide, mai strălucitoare. Logo-urile simple și desenate funcționează cel mai bine.
• Uită-te la Favicons de la mărcile tale preferate. Ce au făcut pentru a se asigura că imaginea lor online se realizează cu un favicon?
• Luați în considerare fie umplerea întregului spațiu cu un fundal de culoare solidă, fie realizarea unui fundal transparent cu elementul din prim-plan întins astfel încât să atingă doar marginile. Veți observa că multe mărci mai mari au fundaluri transparente pentru Favicons.
• Fișierul ICO format funcționează bine pentru imagini mai mici. Dacă nu sunteți familiarizat, utilizați un PNG pentru fundaluri transparente sau un JPG pentru Favicon-uri de înaltă rezoluție cu fundaluri solide.

Cum să generați un favicon pentru dvs. Shopify Magazin

Aveți opțiunea de a proiecta un Favicon în orice software de proiectare la alegere. Dacă preferați Photoshop, mergeți cu asta. Dacă preferați un software gratuit precum GIMP sau Pixlr, toate acestea funcționează atâta timp cât respectați dimensiunile necesare de 32 × 32.

De asemenea, aveți opțiunea de a crea un Favicon cu ShopifySigla Hatchful și Generatorul Favicon gratuit. Vizualizați întregul nostru ghid pe utilizare plin de ecloziune pentru a construi un logo.

Odată ce creatorul logo-ului își face treaba, vă oferă un fișier plin cu mai multe sigle formats, dintre care unul este Favicon.

Rețineți că multe dintre siglele pe care le faceți plin de ecloziune (citiți Recenzie complicată) utilizați spațiu alb în jurul logo-ului, deci este posibil să fie necesar să îl reglați pentru ca graficul să acopere cea mai mare parte a spațiului. În general, am constatat că ar trebui să utilizați faviconul Hatchful furnizat numai dacă arată deja bine (umple majoritatea spațiului și nu are elemente mici, cum ar fi textul).

Dacă nu este cazul, utilizați un software de editare terță parte, cum ar fi Photoshop sau Pixlr, pentru a elimina unele dintre elementele inutile.

Important: Trebuie să utilizați o versiune mai mare a imaginii dacă intenționați să o întindeți pe o pânză pentru a tăia textul și spațiul alb. Pentru aceasta, am folosit Hatchful pentru a genera logo-uri, dar am luat de fapt una dintre logo-urile mari (nu fișierul Favicon furnizat), deoarece nu vreau să apară estomparea atunci când îl întind peste pânza 32 × 32.

În interiorul software-ului de editare, alegeți o nouă pânză cu Lățimea și Înălțimea ambelor setate la 32.

Creați un strat pentru noua imagine și asigurați-vă că imaginea este mai mare decât pânza 32 × 32, deoarece este posibil să o întindeți. Apoi încărcați sau așezați imaginea în pânză.

În următoarea captură de ecran, am designul Favicon mărit pentru a mă asigura că se potrivește square corect. Este neclar, dar știu că va arăta mult mai bine atunci când micșorez.

După cum puteți vedea, versiunea micșorată a Favicon în designul Pixlr arată bine. Am acoperit majoritatea spațiului alocat, am optat pentru o pictogramă strălucitoare și solidă și am eliminat toate semnele unui text mai mic.

Ultimul pas este să descărcați fișierul. Puteți alege să faceți din acesta un PNG transparent în acest moment. Dar pentru acest tutorial rămân cu un JPG de înaltă rezoluție, astfel încât să pară cât mai clar posibil. Și nu mă deranjează să am un fundal cu o culoare solidă.

Du-te înapoi la dvs. Shopify bord. Faceți clic pe Magazin online> Teme> Personalizați.

Apoi accesați Setări temă> Favicon.

Încărcați noul Favicon și faceți clic pe butonul Salvare din Shopify Editor.

Din nou, principala modalitate de a testa și vizualiza Favicon este prin simpla deschidere a unei file cu adresa URL a site-ului dvs. de pornire. După cum puteți vedea, Favicon apare frumos și este de fapt puțin mai bun decât Favicon-ul meu anterior, văzând că modul în care acesta nu a umplut întregul spațiu 32 × 32 furnizat.

În Concluzie

A Shopify Favicon nu necesită mai mult de câteva minute pentru a proiecta și adăuga site-ul dvs., dar oferă un memento minunat vizitatorilor dvs. pe ce site web se află. În plus, poate servi ca o modalitate prin care oamenii pot găsi site-ul dvs. web în marcajele și în istoricul browserului, având în vedere că cel mai probabil caută o listă lungă de alte site-uri atunci când parcurg acele secțiuni.

Rețineți că nu ar trebui să vă mulțumiți cu un neclar sau ilizibil Shopify Imagine Favicon. Dacă descoperiți că primul Favicon nu arată destul de bine sau doriți să tăiați un text sau să adăugați un fundal transparent, reveniți la început și înțelegeți-l. Deși nu este o idee bună să nu ai deloc Favicon, un Favicon neclar sau greu de văzut face ca marca ta să pară neprofesionistă și oarecum prostească.

Dacă aveți întrebări despre adăugarea Favicons la Shopify, sau făcându-ți propriul Shopify Favicon, anunțați-ne în secțiunea de comentarii de mai jos.