Favicona

Čo je to favicona

Favicona alebo favicon je ikonka, ktorá sa objavuje v ľavej časti adresného riadku (obrázok 01). Faviconou môže byť napríklad zmenšené logo vášho internetového obchodu.

Obrázok 01
Obrázok 01

Príprava favicony v prípade priameho nahrania na e-shop

  • Súbor musí byť vo formáte *.ico (meno súboru napr. favicon.ico).
  • Je nutné obrázok uložiť v tomto formáte, uloženie klasického obrázku (*.jpg, *.gif apod.) a jeho následné premenovanie nebude fungovať.
  • Rozmery obrázku musia byť 16 x 16 pixelov.

Faviconu si môžete pripraviť napr. vo formáte *.jpg alebo *.gif a následne použiť niektorú online službu, ktorá vám obrázok automaticky prevedie do požadovaného formátu (napr. Favicon Generator alebo Favicon.cc).

Ako vložiť faviconu na vaše stránky

V administrácii e-shopu Vzhľad a obsah → Editor → Ďalšie nastavenia zvoľte tlačidlo Nahrať (obrázok 02). Tu nahráte vami pripravený súbor vo formáte *.ico.

Obrázok 02
Obrázok 02

Vytvorenie favicony pre všetky typy zariadení

Favicona sa v dnešnej dobe zobrazuje trochu iným spôsobom v bežnom prehliadači na počítači a na mobilnom telefóne či tablete. Odporúčame teda využiť službu Real Favicon Generator, kde máte možnosť vytvoriť si vlastnú faviconu a prispôsobiť ju pre každý typ zariadenia.

Pripravte si obrázok, ktorý má rozmery aspoň 260 x 260 px. Tým zaistíte jeho kvalitné zobrazenie naprieč všetkými prehliadačmi.

Po nahraní obrázku potom vidíte náhľady u jednotlivých zariadení, u Android Chrome je však nutné doplniť aj názov, ktorý sa spolu s faviconou bude zobrazovať (obrázok 03).

Obrázok 03
Obrázok 03

Následne potom nastavte cestu, odkiaľ sa budú favicony načítať, v tvare: /user/documents/ (obrázok 04).

Obrázok 04
Obrázok 04

Po potvrdení dôjde k vygenerovaniu samotných favicon a HTML kódu. Ikony stiahnite do počítača pomocou kliknutia na tlačidlo Favicon package (obrázok 05). Obsah súboru rozbaľte. Stránku zatiaľ nezatvárajte, budete ju ešte potrebovať.

Obrázok 05
Obrázok 05

Rozbalené ikonky potom nahrajte na FTP (ideálne cez WinSCP) do predvolenej zložky /user/documents/ (obrázok 06).

Obrázok 06
Obrázok 06

Po uložení ikoniek na FTP prejdete na e-shope do sekcie HTML editoru Vzhľad a obsah → Editor → HTML kód a vložte do časti  Záhlavie kód vygenerovaný na stránke spoločne s faviconami (obrázok 07).

Obrázok 07
Obrázok 07

Po uložení kódu sa potom začne zobrazovať favicona na všetkých typoch zariadení.