Lidi přirozeně přitahuje vizuální podoba a Webové stránky WordPress, stejně jako je přitahuje psaný obsah, který sdílíte. Ve skutečnosti podle Jeff Bullas ", Články s obrázky mají o 94% více zobrazení než články bez obrázků.
To je obrovský nárůst počtu zobrazení stránky, pokud se mě zeptáte.
A co přesně je to důvod?
Stačí do svého obsahu přidat několik vysoce kvalitních obrázků souvisejících s články.
Ale co ty obrázky na vašem Webové stránky které přesahují snímky obrazovky a fotografie? A co obrázky, které nejen upoutají pozornost, ale plní i užitečnou funkci?
Ano, mluvím o ikonách. Ty drobné obrázky, které se nacházejí na webových stránkách, podporují sdílení na sociálních médiích, ilustrují kontaktní stránky vlastníků firem a jmenují několik případů použití.
Vzhledem k tomu, že myšlenka byla převzata z této stránky, Návštěvníci nejenže je přitahovaly obrázky na webových stránkách, ale měli sklon s nimi interagovat, lidé je začali přidávat na své webové stránky.
Jak ale technologie pokročila, tradiční obrazové ikony začaly jako vždy obrazové řešení pro webové stránky ochabovat. Je to proto, že dělají stránky mnohem těžšími a proto pomalejšími, ale především toto řešení nebylo vždy vhodné pro mobilní telefony.
Existuje však řešení: fonty ikon.
Dnes vám řeknu, co jsou to ikonová písma a jaké jsou výhody jejich používání na vašem webu WordPress. Dále vám ukážu, jak přidat ikonová písma na váš web WordPress pomocí populárního pluginu „ Lepší Font Děsivý ".
Tak začněme.
Co jsou to ikonová písma a proč byste je měli používat?
Ikonová písma jsou přesně to, co říkají: písma zabudovaná zcela do ikon. Ve skutečnosti ikonová písma nebo „ make-icon Msgstr "Lze popsat jako písmo, které zobrazuje pouze znaky nebo symboly, nikoli písmena a čísla, ke kterým jsou přidružena tradiční písma a text.
Ikonová písma se používají k zobrazení běžně používaných symbolů na vašem webu. Například tlačítka sociálních médií, váš košík, tlačítka pro stahování a navigační tlačítka jsou příklady ikon, které na vašem webu zobrazují malé interaktivní obrázky.
Proč používat ikonová písma?
Ikony obrázků v minulosti fungovaly dobře pro mnoho majitelů stránek. S vývojem pravidel navigace, použitelnosti a designu se však písma ikon stala nejlepším řešením pro zobrazování interaktivních obrázků na webové stránky.
Zde je přehled několika přesvědčivých důvodů, proč jsou ikonová písma tou nejlepší volbou:
- Snadno se rozšiřuje bez ztráty kvality
- Přizpůsobitelné z hlediska barvy a stínu
- 100% reagující
- Funguje jako spritové obrázky CSS, ale chová se jako text
- Snadné použití
- Kompatibilní s prohlížeči
- Přizpůsobte neprůhlednost, rotaci a další
- Menší velikost souboru
- Neomezujte rychlost nebo výkon vašeho webu
Jak vidíte, existuje několik důvodů, proč byste na své webové stránce mohli chtít použít ikonové písmo, na rozdíl od grafické ikony.
Instalace ikon písem na váš web pomocí pluginu
Better Font Awesome je a WordPress Plugin freeware, který vám umožňuje automaticky integrovat nejnovější verzi Font Awesome do vašeho projektu WordPress. Navíc přichází s CSS, krátkými kódy a generátorem krátkých kódů TinyMCE.
Tento plugin má pro majitele stránek řadu užitečných funkcí:
- Rutinná aktualizace nejnovější verze
- Schopnost přepínat mezi verzemi písma Awesome beze změny krátkých kódů
- Podpora dalších populárních pluginů pro písma včetně jejich krátkých kódů
- Vydal jsDelivr CDN
Krok 1: Instalace a aktivace lepšího písma Awesome
Nejprve si nainstalujte a aktivujte plugin „Better Font Awesome“ prostřednictvím řídicího panelu WordPress, stejně jako u jakéhokoli jiného pluginu.
Nejprve přejděte na „ Pluginy> Přidat nové A hledat „ Lepší Font Děsivý ".
Pak vyberte „ nainstalovat nyní »A klikněte na« aktivovat ".
Po aktivaci plugin přidá odkazLepší Font DěsivýV nabídce Nastavení na hlavním panelu WordPress.
Krok 2: Konfigurace nastavení pluginu
Konfigurace pluginu « Lepší Font Děsivý ", Začněte kliknutím na položku nabídky" Lepší Font Děsivý V části Nastavení. Jakmile to uděláte, zobrazí se obrazovka podobná této:
Zde můžete provést následující kroky:
- Verze: Vyberte verzi „Better Font Awesome“, kterou chcete použít.
- Použijte Minified CSS: Zaškrtněte toto políčko, pokud chcete použít zkrácenou verzi CSS.
- Odstraňte stávající tiskové písmo: Zaškrtněte toto políčko a pokuste se odstranit kódované úryvky a zkrácené kódy přidané jinými doplňky a motivy.
- Skrýt administrátorské recenze: Skrýt výchozí varování správce, která se zobrazí, když dojde k chybám API a CDN.
Kromě minimálního množství možností Better Font Awesome existuje malá část „Usage“, která vysvětluje, jak přidat ikony na váš web.
Krok 3: Přidávání ikon na váš web
Existují tři snadné způsoby, jak přidat ikony na web pomocí aplikace „Better Font Awesome“ - pomocí zkráceného kódu, HTML nebo TinyMCE.
# 1. Přidávání ikon pomocí zkráceného kódu
Chcete-li na svůj web přidat ikony pomocí zkráceného kódu, nejprve přejděte na stránku „ Písmo Děsivý Chcete-li zobrazit úplný seznam dostupných ikon, které lze použít.
Zde můžete vyhledat požadovanou ikonu. Chcete-li například ikonu „e-mailu“, jednoduše vyhledejte dané klíčové slovo a kliknutím na ikonu vyberte ikonu, kterou chcete použít.
Po kliknutí na ikonu, kterou chcete přidat, uvidíte obrazovku zobrazující obrázek ikony s různými velikostmi a malým blokem kódu:
Stačí zkopírovat blok kódu a vložit jej kdekoli na svůj web pomocí karty „Textový editor“. Takto bude editor vypadat na vašem webu:
Na konci, zde je to, co Návštěvníci uvidí, když vstoupí na váš web:
# 2. Přidávání ikon pomocí HTML kódu
Jak jsme viděli v sekci „ Využití Máte možnost použít HTML kód k vložení ikon na váš web. Vývojáři pluginů však berou v úvahu, že používání HTML vyžaduje předpony specifické pro verzi.
Proto vám místo toho doporučují používat zkrácené kódy. Pokud však chcete použít HTML kód, Font Awesome má užitečné informace zde.
# 3. Přidávání ikon pomocí TinyMCE
Toto je pravděpodobně nejjednodušší způsob přidání ikon na váš web. V režimu „Vizuální editor“ stačí kliknout na ikonu Vložit. Odtud můžete procházet dostupné možnosti ikon nebo zúžit výsledky pomocí funkce vyhledávání.
Jakmile najdete požadovanou ikonu, jednoduše na ni klikněte. Generátor krátkých kódů automaticky zadá požadované informace do vašeho příspěvku nebo stránky.
Pokud se chcete naučit, jak přizpůsobit ikony na vašem webu, podívejte se na příklady „ Písmo Děsivý ".
Nainstalováno a aktivováno, ale tlačítko „Vložit ikonu“ se v TinyMCE neobjeví. Měl někdo tento problém?