Folk er naturligt tiltrukket af det visuelle udseende af en Websted af WordPress, lige så meget som de tiltrækkes af det skrevne indhold, du deler. Faktisk ifølge Jeff Bullas ", Artikler med billeder har 94% flere visninger end artikler uden billeder.

Det er en enorm stigning i sidevisninger, hvis du spørger mig.

Og hvad er grunden til?

Bare tilføj et par artikelrelevante billeder af høj kvalitet i hele dit indhold.

Men hvad med billederne på din Websted der går ud over skærmbilleder og fotografier? Hvad med billeder, der ikke kun fanger opmærksomhed, men også tjener en nyttig funktion?

Ja, jeg taler om ikoner. Du kender de små billeder, der findes på websteder for at tilskynde til deling på sociale medier, for at illustrere kontaktsider for virksomhedsejere, for at nævne nogle få af tilfældene brug.

Da ideen blev taget fra dette websted, besøgende var ikke kun tiltrukket af billeder på websteder, men var tilbøjelige til at interagere med dem, begyndte folk at tilføje dem til deres websteder.

Men som teknologien skrider frem, som altid, er traditionelle billedikoner begyndt at svække som en billedløsning til websteder. Dette skyldes, at de gør siderne meget tungere og derfor langsommere, men frem for alt var denne løsning ikke altid velegnet til mobiltelefoner.

Men der er en løsning: ikonskrifter.

I dag vil jeg fortælle dig, hvad ikonskrifttyper er, og fordelene ved at bruge dem på dit WordPress-websted. Derudover viser jeg dig, hvordan du tilføjer ikonskrifttyper til dit WordPress-websted ved hjælp af det populære plugin " Bedre Font Awesome '.

Så lad os starte.

Hvad er ikonskrifttyper, og hvorfor skal du bruge dem?

Ikoneskrifttyper er nøjagtigt hvad de siger: skrifttyper indbygget helt i ikoner. Faktisk er ikonet skrifttyper eller " make-ikon "Kan beskrives som en skrifttype, der kun viser tegn eller symboler, ikke de bogstaver og tal, som traditionelle skrifttyper og tekst er knyttet til.

Ikoneskrifttyper bruges til at vise almindeligt anvendte symboler på dit websted. For eksempel er sociale medieknapper, din indkøbskurv, downloadknapper og navigationsknapper eksempler på ikoner, der viser små, interaktive billeder på dit websted.

Hvorfor bruge ikonskrifttyper?

Billedikoner har tidligere fungeret godt for mange webstedsejere. Men efterhånden som navigationsregler, brugervenlighed og design har udviklet sig, er ikonskrifttyper blevet den bedste løsning til at vise interaktive billeder på en websted.

Her er et kig på nogle overbevisende grunde til, at ikonfonter er det bedste valg:

• Kan udvides let uden at miste kvalitet
• Kan tilpasses med hensyn til farve og skygge
• 100% lydhør
• Fungerer som CSS image sprites, men opfører sig som tekst
• Let at bruge
• Kompatibel med browsere
• Tilpas opacitet, rotation og mere
• Mindre filstørrelse
• Opfyld ikke hastigheden eller ydeevnen på dit websted

Som du kan se, er der flere grunde til, at du måske vil bruge en ikonfont på dit websted i modsætning til et billedikon.

Installation af skrifttypeikoner på dit websted ved hjælp af et plugin

Better Font Awesome er en WordPress plugin freeware, der giver dig mulighed for automatisk at integrere den nyeste version af Font Awesome i dit WordPress-projekt. Desuden kommer den med CSS, shortcodes og TinyMCE shortcode generator.

Dette plugin har en række nyttige funktioner til webstedsejere:

• Rutineopdatering af den nyeste version
• Mulighed for at skifte mellem versioner af Font Awesome uden at ændre korte koder
• Understøttelse af andre populære font-plugins, herunder deres kortkoder
• Udstedt af jsDelivr CDN

1 Trin: Installation og aktivering af bedre skrifttype Awesome

For at komme i gang skal du installere og aktivere “Better Font Awesome” plugin via dit WordPress dashboard, ligesom du ville med ethvert andet plugin.

Naviger først til " Plugins> Tilføj nyt Og søg efter " Bedre Font Awesome '.

Vælg derefter " installere nu »Og klik på« aktivere '.

Når først plugin er aktiveret, tilføjer et linkBedre Font AwesomeUnder menuen Indstillinger på dit WordPress-dashboard.

Trin 2: Konfigurer plugin-indstillinger

Sådan konfigureres plugin « Bedre Font Awesome ", Start med at klikke på menupunktet" Bedre Font Awesome Under Indstillinger. Når du gør det, vil du se en skærm, der ligner denne:

Her kan du gøre følgende:

• Udgave: Vælg den version af "Better Font Awesome", du vil bruge.
• Brug Minificeret CSS: Marker dette felt, hvis du vil bruge den minificerede version af CSS.
• Slet den eksisterende skrifttype: vælg dette felt for at prøve at fjerne kodede uddrag og kortkoder tilføjet af andre plugins og temaer.
• Skjul administratoranmeldelser: Skjul standardadvarsler, der vises, når der opstår API- og CDN-fejl.

Ud over den mindste mængde af bedre skrifttypefaciliteter er der et lille afsnit "Brug", der forklarer, hvordan du tilføjer ikoner til dit websted.

Trin 3: Tilføjelse af ikoner til dit websted

Der er tre nemme måder at tilføje ikoner til dit websted ved hjælp af "Better Font Awesome" - via shortcode, HTML eller TinyMCE.

# 1. Tilføjelse af ikoner ved hjælp af kortkode

Hvis du vil føje ikoner til dit websted ved hjælp af en kortkode, skal du først besøge " Font Awesome For at se en komplet liste over tilgængelige ikoner, der kan bruges.

Her kan du søge efter det ønskede ikon. Hvis du f.eks. Vil have et "e-mail" -ikon, skal du bare søge efter det nøgleord og vælge det ikon, du vil bruge, ved at klikke på det.

Efter at have klikket på det ikon, du vil tilføje, vil du se en skærm, der viser billedet af ikonet med dets forskellige størrelser og en lille blok kode:

Bare kopier kodeblokken og indsæt den hvor som helst på dit websted ved hjælp af fanen "Teksteditor". Sådan ser redaktøren ud på dit websted:

I sidste ende, her er hvad besøgende vil se, når de får adgang til dit websted:

# 2. Tilføjelse af ikoner ved hjælp af HTML-kode

Som vi så i afsnittet " Udnyttelse Du har mulighed for at bruge HTML-kode til at indsætte ikoner på dit websted. Pluginudviklere tager dog højde for, at brug af HTML kræver versionsspecifikke præfikser.

Derfor anbefaler de, at du bruger kortkoder i stedet. Men hvis du vil bruge HTML-kode, har Font Awesome det nyttige oplysninger her.

# 3. Tilføjelse af ikoner ved hjælp af TinyMCE

Dette er sandsynligvis den nemmeste måde at tilføje ikoner til dit websted. I tilstanden "Visual Editor" skal du bare klikke på Indsæt-ikonet. Derfra skal du rulle gennem de tilgængelige ikonindstillinger eller indsnævre dine resultater ved hjælp af søgefunktionen.

Når du har fundet det ønskede ikon, skal du bare klikke på det. Kortkodegeneratoren indtaster automatisk de krævede oplysninger i dit indlæg eller side.

Hvis du vil lære at tilpasse ikonerne på dit websted, skal du henvise til eksemplerne på " Font Awesome '.