Hvis du er en WordPress-sideeier, bør det være en av dine prioriteringer å sikre at de besøkende alltid har en jevn og upåklagelig brukeropplevelse når de surfer gjennom nettstedet ditt. En typisk bruker vil ikke bruke for lang tid på siden din før de bestemmer seg for om de vil fortsette å surfe eller om de vil forlate helt. Så du har faktisk ikke lenger enn noen få sekunder på deg til å få dem til å bli.
Selvfølgelig kan dette oppnås ved hjelp av mange forskjellige strategier, men når det gjelder å forbedre brukeropplevelsen på nettstedet ditt, er det ingenting som slår solid nettsidenavigasjon. Nå, når vi sier nettsidenavigasjon, mener vi opprettelsen av forskjellige navigasjonsmenyer, CTA-knapper og spredning av forskjellige typer navigasjonslenker over hele nettstedet ditt, inkludert ankerlenker. Og denne gangen, vi skal fokusere spesielt på ankerlenker.
Ankerlenker har makten til å forbedre brukeropplevelsen til de besøkende siden de gir dem rask tilgang til delen de er interessert i. Følg med mens vi diskuterer viktigheten av denne typen lenker og viser deg noen av de beste måtene å legge dem til på WordPress-siden din – både i Gutenberg og Classic-redaktør.
Vi vil dekke:
Som vi allerede har nevnt, er ankerlenker ganske nyttige navigasjonselementer siden de har muligheten til å bringe brukere til et bestemt område på samme side, noe som lar dem raskt komme til delen de er interessert i. Ellers kjent som innholdsfortegnelse, disse typene lenker brukes ofte i lengre former for innhold, som for eksempel ulike typer artikler, FAQ-seksjoner eller lister over produkter eller tjenester.
Bortsett fra å i stor grad forbedre nettstedets UX generelt, kan ankerlenker også ha en positiv innflytelse på nettstedets SEO. Google har nemlig en tendens til å vise ankerlenkene dine i form av en «hopp til»-lenke i søkeresultatene, spesielt hvis brukere skriver inn søkeordene i ankerlenken din. Alt dette kan forbedre klikkfrekvensen din, og i tillegg få mer trafikk til nettstedet ditt.
Hvis du viser ankerlenkene dine som en innholdsfortegnelse, kan Google også velge å vise dem som en rik utdrag, slik:
Nå som vi har dekket noen av de grunnleggende årsakene til at ankerlenker kan være verdifulle for et nettsted, la oss ta en titt på hvordan du kan legge dem til i WordPress.
For å få ankerlenkene til å fungere, er det to ting du bør gjøre – først må du legg til et #-tegn før ankerteksten, og legg deretter til ID-attributtet til teksten du vil at brukerne skal ledes til når de klikker på ankerlenken.
For å lage ankerlenken din i Gutenberg, bør du velge teksten du vil ha som anker og trykke på Link knapp.
En popup vil vises der du vanligvis kan legge til en lenke-URL.
Men i stedet for å gjøre det, må du ta med et #-prefiks og sett inn nøkkelordene for det spesifikke området du vil at brukerne skal hoppe til når du klikker på denne typen lenker. Selvfølgelig bør du bruke søkeordene knyttet til ankerdelen du oppretter en lenke for. Vi anbefaler også å bruke bindestreker og/eller store bokstaver for å gjøre ankerteksten mer lesbar generelt. Her er et eksempel på et #-prefiks:
#Hårprodukter
Trykk på Enter-knappen for å fullføre å legge til ankerlenken din. Etter at du har gjort dette, vil du kunne se ankerlenken i editoren, men vil ikke kunne klikke på den, da du fortsatt må opprette en ID for den.
For å legge til en ID til ankerlenken, bør du finn delen du vil at brukerne skal ledes til når du klikker på lenken din.
For å koble til en overskriftsseksjon, velg ønsket blokk, og Velg Avansert fanen. Deretter, i HTML-anker felt, bør du legg til den samme teksten du brukte for ankerlenken din – den eneste forskjellen er at du bør utelat prefikset #.
Deretter kan du trykke på Publiser/oppdater knappen (eller Lagre utkast) og forhåndsvis ankerlenken din for å se hvordan den ser ut live.
Hvis du vil koble til en annen seksjon enn en overskrift (som et avsnitt eller andre blokktyper), klikk på et menyikon med tre prikker (i selve blokken) og velg deretter Rediger som HTML knapp.
Finn nå HTML-taggen for den spesifikke delen eller elementet. For eksempel, <p> er et avsnitt, <h2>, <h3>, osv. er overskrifter, og så videre.
Når du finner elementet ditt, ganske enkelt legg ved et ID-attributt sammen med ankeret til HTML-taggen.
Som dette:
<p >
Når du ser en melding som forteller deg at denne blokkeringen inneholder innhold som er uventet eller ugyldig, bør du Klikk på Konverter til HTML knapp.
Og det er det – du har lagt til en ankerlenke til en bestemt del i avsnittet ditt, eller en hvilken som helst annen blokk du velger.
I tilfelle du foretrekker å bruke den klassiske editoren, kan du selvfølgelig også lage ankerlenker fra denne editoren. Her er hvordan du kan gjøre det.
Først, velg ønsket ankerlenketekst og trykk på Sett inn/rediger link-knappen.
Deretter legger du til et #-prefiks samt en slug for koblingen din.
Når du er ferdig med dette trinnet, bør du legg til ID-attributtet i delen du vil at brukerne skal navigere til når du klikker på lenken din.
Endre modus til Tekst først, og deretter finn HTML-taggen til delen du vil legge til ID-attributtet til (som <h2>, <p>, og så videre).
Legg til ID-attributtet sammen med slug av ankerlenken din, men uten #-prefikset. For eksempel:
<p> id=“Hair-Products”>
Sørg for å trykke på publiser/oppdater siden/innlegget ditt og forhåndsvis det for å se hvordan ankerlenken din ser ut.
Hvis du foretrekker å skrive og redigere innholdet ditt ved å bruke tekstmodus helt, kan du også bruke det til å lage ankerlenker ved hjelp av HTML fra bunnen av.
En gang i Tekst modus, kan du lag ankerlenken din ved å bruke <a href-“ “> stikkord. Her er et eksempel på hvordan ankerlenken din kan se ut i HTML:
<a href="#Hair-Products">Hair Products</a>
Deretter finner du området du vil at brukerne skal føres til når du klikker på ankerlenken (en overskrift som vanligvis er merket som <h2> og <h3>, et avsnitt merket som <p>, osv.) og legg til ID-attributtet i HTML-taggen (nok en gang, uten #-prefikset):
<p> > Hair Products</p>
Etter å ha lagret endringene, fortsett og forhåndsvis hvordan ankerlenken din ser ut.
Hvis du regelmessig oppretter og legger ut innhold i lang format på nettstedet ditt (som spesielt lange artikler, for eksempel), vil du kanskje også vurdere å legge til ankerlenker automatisk for å fremskynde prosessen. Heldigvis har WordPress et stort nettsamfunn som regelmessig lager mange nyttige verktøy og plugins – hvorav mange kan brukes gratis. Blant slike plugins er også en plugin kalt Enkel innholdsfortegnelse, som du kan bruke til å opprette ankerlenker på nettstedet ditt automatisk.
Som navnet antyder, lar denne plugin-en deg enkelt lage en innholdsfortegnelse med en liste over ankerlenker og legge den til på sidene, innleggene og/eller egendefinerte innleggstyper. Du kan enten aktiver alternativet for automatisk innsetting for å legge til ankerlenker automatisk, eller deg kan fjerne merket for dette alternativet og angi innholdsfortegnelsen kun for bestemte sider/innlegg.
Vi har allerede en artikkel som snakker i dybden om å legge til en innholdsfortegnelse i WordPress ved hjelp av denne praktiske plugin, så vi anbefaler at du sjekker den ut hvis du vil dele opp sidene eller innleggene dine i forskjellige seksjoner for bedre navigering.
Pakke ting sammen
Ankerlenker kan være et flott tillegg til ethvert nettsted da de lar brukere raskt og enkelt hoppe til delen de ønsker å lese. På sin side kan de bidra til å forbedre navigasjonen og forbedre nettstedets brukeropplevelse som helhet. Å legge til denne typen lenker på sidene eller innleggene dine kan virke komplisert i begynnelsen, men når du ser nærmere på instruksjonene vi presenterte ovenfor, vil du innse at denne prosessen ikke er vanskelig i det hele tatt. Bare sørg for å følge alle trinnene nøye, så er du klar.
Støtt vårt arbeid ❤️
Hvis du likte denne artikkelen, vurder å gi en tips for å hjelpe oss med å fortsette å publisere kvalitetsinnhold.
