Sådan tilføjer du social media share og follow knapper i WordPress

Det tager fem minutter at få share- og follow-knapper til at virke på en WordPress-side. Share-knapper åbner et lille vindue, hvor besøgende deler indhold på Facebook, X/Twitter eller LinkedIn. De sender URL’en videre til deres eget netværk.

Follow-knapper peger på sociale profiler. Folk følger med et klik.

Et plugin er den kloge løsning for de fleste. Det klarer placering, pæne ikoner, tællere og hastighedsoptimering. Ingen kode. Ingen jagt på ændringer fra sociale medier. Mindre bøvl, mere tid til alt andet.

Sådan installerer og opsætter du Superb Social Media Share Buttons and Follow Buttons

Der er mange plugins du kan vælge til social share og follow knapper i WordPress. Jeg har testet et par stykker og har valgt Superb Spcial Media Share and Follow Buttons til den her artikel.

Du kan selv se listen over alle gratis plugins til at få social knapper på din hjemmeside her.

  1. Log ind i WordPress-dashboardet.
  2. Gå til Plugins, vælg Tilføj nyt.
  3. Søg efter “Superb Social Media Share Buttons and Follow Buttons“.
  4. Klik på Installer nu og vent lidt.
  5. Aktivér plugin’et, når installationen er færdig.

Deres ikon ser sådan her ud:

Når plugin’et er aktivt, styres delingsknapperne i indstillingerne. Her vælges placering over eller under indholdet, for eksempel på blogindlæg eller sider, og om de også skal vises på arkivsider eller enkeltvisninger. Det giver fleksibilitet i præsentationen uden kode.

For follow-knapper angives sociale profil-URL’er direkte i felterne. Eksempler: en Instagram-profil som https://instagram.com/brugernavn eller Twitter med et ‘intent’-link som https://twitter.com/intent/follow?screen_name=brugernavn. Det gør det let for besøgende at følge med med ét klik.

Til sidst testes opsætningen. Åbn siden i et privat eller inkognito-vindue for at se front-end uden admin-baren og uden cachede data. Så sikres det, at share- og follow-knapper fungerer korrekt sammen med resten af sitet.

Skift stil, placering og synlighed så knapperne passer til dine læsere

Giv social share-knapper i WordPress en stil, der matcher designet på siden. Runde ikoner virker bløde, firkantede ser mere moderne og skarpe ud. Farver fanger øjet, monokrome passer ofte til et minimalistisk udtryk. Sæt størrelsen i pixel, og match gerne ikonernes højde med typografien eller linjehøjden, så helheden føles rolig.

Placering påvirker oplevelsen markant. Mange lægger delingsknapper over eller under indholdet, hvor de er synlige uden at stjæle fokus. En flydende sidepanel på desktop følger med ved scroll og holder knapperne tilgængelige. Undgå den løsning på mobil, hvor paneler kolliderer med cookiebannere og andre elementer og skaber rod.

Korte labels hjælper layoutet. “Del artiklen” eller “Følg mig” fungerer fint. Hold teksten under 25 tegn, så linjelængde og knapbredde ikke skrider. Det ser pænt ud og gør formålet tydeligt.

Tilgængelighed skal være på plads. Giv alle knapper aria-labels, så skærmlæsere beskriver funktionen præcist. Sørg for kontrastforhold på mindst 4.5:1 mellem ikonfarve og baggrund for læsbarhed, også ved nedsat syn. Tilføj tydelige fokus-tilstande, så tastaturnavigation giver visuelt feedback ved tabbing. Det løfter oplevelsen for alle.

Deaktiver delingsknapper på specifikke sider for bedre konvertering

Nogle sider har ikke brug for delingsknapper. På checkout, login og takkesider stjæler de opmærksomhed og kan få folk til at forlade en vigtig proces. Landingssider med høj konvertering og gated content har samme problem, her skal alt pege mod den ønskede handling.

De fleste plugins til sociale delinger har indstillinger, hvor knapper slås til eller fra pr. posttype. Knapper kan vises på blogindlæg og skjules på sider. Mange har også metaboxe i editoren, så visning styres pr. indlæg uden bøvl.

Mere teknisk styring løses i temaet med betinget PHP. Funktioner som is_page() og is_singular() målretter præcist, hvilke skabeloner eller indholdstyper der viser knapper. Det kræver lidt kode, men giver fuld kontrol.

Ryd cache i både cache-plugins og CDN efter ændringer. Gamle versioner hænger ellers fast, og brugere ser forældede knapper eller manglende opdateringer.

Mål effekten med analytics-events. Spor klik på delingsknapper, og sammenlign konverteringsrater før og efter ændringen. Målet er bedre brugeroplevelse uden at koste værdifulde handlinger.

  • Slå delingsknapper fra på checkout-, login- og takkesider for bedre fokus.
  • Brug plugin-indstillinger eller metaboxe til styring pr. side eller posttype.
  • Ryd altid cache og CDN efter ændringer for korrekt visning.
  • Mål effekten via klik-events og konverteringsdata.

Tilføj share knapper manuelt med korrekte URLs, UTM og hurtig performance

Manuel opsætning af share-knapper i WordPress giver fuld kontrol over delings-URL’er og gør det nemt at måle performance. Pointen er at bygge links efter hvert socials krav. Facebook bruger fx: https://www.facebook.com/sharer.php?u={url}. LinkedIn: https://www.linkedin.com/sharing/share-offsite/?url={url}. X/Twitter bruger både URL og titel: https://twitter.com/intent/tweet?url={url}&text={title}.

{url} og {title} erstattes med sidens adresse og overskrift. Specialtegn som æ, ø og å skal kodes korrekt, ellers går links i stykker. I PHP sikrer urlencode(), at værdierne bliver kodet rigtigt:

php $url = urlencode(get_permalink()); $title = urlencode(get_the_title());

Derefter sættes $url og $title ind i delingslinket uden problemer.

UTM-parametre gør måling skarpere. De fortæller analytics, hvor besøget kommer fra. Et typisk sæt er utm_source=facebook (eller linkedin/x), utm_medium=social_share og utm_campaign med postens titel eller kampagnenavn. Det giver overblik over trafik fordelt på kanaler og kampagner.

Performance vinder på SVG-ikoner inline i stedet for tunge billeder eller icon fonts. Siden loader hurtigere og ser skarp ud på alle skærme. Hvis knapperne bruger JavaScript, så læg det asynkront eller brug defer, så resten af siden ikke blokeres.

Skriv et svar

Din e-mailadresse vil ikke blive publiceret. Krævede felter er markeret med *