En content reveal-knap i WordPress viser først skjult indhold, når brugeren klikker. Det kan være rabatkoder, engangskoder, bonuslinks eller ekstra info, som ikke skal ligge åbent fra start, så får udgiveren kontrol over, hvornår og hvordan indholdet vises. Praktisk ved affiliate-links, hvor klik skal registreres, før koden vises.
Det giver mening, når målet er mere interaktion og flere klik. Når folk selv trykker for at få adgang til noget værdifuldt, stiger CTR ofte. Samtidig bliver trafikken lettere at måle, og oplevelsen forbliver enkel.
Det føles også fair for brugeren. Beskeder om affiliate-links eller cookies kan stå lige ved knappen, så alt er tydeligt. En content reveal-knap rammer en god balance mellem effektivitet og gennemsigtighed i den daglige brug.
Det bedste valg er Coupon & Discount Code Reveal Button plugin
Dette Coupon & Discount Code Reveal Button-plugin gør det nemt at lave en knap, der både viser en kode og sender brugeren videre til et link med ét klik. Knapper placeres med en shortcode, så placeringen passer i indlæg, sider eller widgets.
I WordPress admin opretter man nye knapper via Reveal Button → Add New Button. Man giver knappen et navn, vælger knaptekst og den tekst, der vises efter klik. Farver, ikoner og link sættes uden kodning. Det passer til folk uden teknisk erfaring, som vil have styr på både udseende og funktion hurtigt.
- Shortcode-metoden giver fleksibilitet i både blokredigering og klassisk editor.
- Klikket viser koden og sender brugeren til dit affiliate-link, så cookie-sporing registreres korrekt.
Pluginet passer også til andet end kuponkoder. Det kan afsløre noter, filer eller tips, alt styret fra det samme enkle interface. I stedet for custom JavaScript undgår man problemer med adblockere eller konflikter med temaets scripts. Løsningen er mere stabil og let at arbejde med.
Sådan laver du en content reveal button i WordPress trin for trin
- Start med at installere og aktivere pluginet Coupon & Discount Code Reveal Button. Gå til Plugins → Tilføj nyt, søg på navnet, klik Installér og derefter Aktiver.
- Gå i WordPress-menuen til Reveal Button → Add New Button. Opret en ny knap og giv den et internt navn, så den er let at finde senere.
- Udfyld felterne. Skriv selve knapteksten i “Button text”, læg kuponkoden eller andet skjult indhold i “Reveal text”, og indsæt dit affiliate- eller destinationslink i “Link”.
- Åbn fanen Button Design. Vælg farver til baggrund og tekst, sæt hover-farve, justér kant og hjørneradius, så knappen matcher temaet.
- Gem knappen. Pluginet genererer automatisk en shortcode som fx [reveal_button id=”123″]. Notér ID’et eller kopier koden med det samme.
- Placer shortcoden præcis der, hvor knappen skal vises. Det kan være i et blogindlæg, på en side eller i et widget-område.
- Udgiv eller opdatér indholdet. Test i en privat browserfane for at se, om koden afsløres korrekt, og om linket sender videre som forventet.
Sådan tilføjer du knappen i Blocks, Classic Editor og widgets
Det er let at tilføje content reveal-knapper på hele sitet, uanset om der arbejdes i Block Editor, Classic Editor eller widgets. I Block Editor bruges Shortcode-blokken. Sæt hele shortcoden ind fra plugin’et, så vises knappen præcis dér, hvor den skal stå.
Classic Editor fungerer også fint. Indsæt shortcoden direkte i tekstfanen. Undgå linjeskift inde i tagget, ellers fejler det, og knappen forsvinder eller vises forkert.
Widgets giver fleksible placeringer i sidebar og footer. Gå til Udseende → Widgets og brug enten Shortcode-widget eller Custom HTML. Så ligger knappen ens på tværs af sider.
Global visning klares i skabeloner via Full Site Editing. Sæt Shortcode-blokken ind i Single template eller Footer parts. Genanvendelige blokke sparer tid, fordi samme knap kan bruges flere steder uden manuelt gentagelsesarbejde.
Afslut med en hurtig test på flere skærmstørrelser. Knapper bør bryde tekst pænt ved linjeskift og have et tryk-område på mindst 44 px på mobil. Undgå flere identiske reveal-knapper lige efter hinanden. Det forvirrer brugere og gør måling af klik unøjagtig.
Design en discount reveal button til rabatkoder der bliver klikket
Kontrast gør forskellen mellem oversete knapper og klik. En tekstfarve, der står klart mod baggrunden med mindst 4,5:1 i kontrast (WCAG AA), gør knappen let at læse – også for folk med nedsat syn eller i skarpt/dæmpet lys. Flere ser budskabet. Flere klikker.
Mikrocopy løfter engagementet. Konkrete tekster som “Vis rabatkoden” eller “Klik for at afsløre 15%” giver forventningsafstemning og lyst til at trykke. “Læs mere” siger intet, mens klare verbale løfter forklarer handling og resultat med få ord.
Hover og fokus betyder tryghed og tempo. Farveskift eller tydelig kant ved hover bekræfter, at knappen er klikbar, hvilket musbrugere forventer. Fokusmarkering gør tastaturnavigation sikker og løfter tilgængeligheden for alle, ikke kun skærmlæserbrugere.
Størrelse påvirker læsbarhed og trykpræcision. Minimum 16 px skrift giver ro i øjnene. Selve klikfladen bør være mindst 44 × 44 px, så mobile fingre rammer rigtigt, og desktops rammer første gang. Korte tekster undgår kluntede linjeskift på små skærme og holder udtrykket stramt.
Placering påvirker konverteringen. En placering over folden fanger opmærksomheden tidligt. En gentagelse efter produktlister eller relevante sektioner øger chancen for klik, når interessen allerede er varm.
Et lille ikon kan tydeliggøre formålet. Et låseikon viser, at noget er skjult indtil klik. Et kupon-ikon kobler budskabet til rabat med det samme. Ikoner skal ligge tæt på teksten, så relationen er klar, uden at layoutet bliver rodet.
Ydelse kræver ro i layoutet. Systemfonte eller præindlæste webfonte forebygger layoutskift ved load og når knappen dukker op efter klik. Stabilitet føles professionel og styrker tilliden.
Arbejd med knapper i praksis med flows, sporing og cookies
Når en bruger åbner en skjult kode via en knap, vises koden med det samme, og brugeren sendes videre til merchantens side. UI’en skal forklare processen tydeligt. Brugeren skal se, at koden stadig ligger klar, når vedkommende vender tilbage. Klare signaler i interfacet skaber ro og bekræfter, at klikket havde værdi.
Affiliate-cookies registrerer salg og kommissioner. De sættes ofte ved første load af merchant-siden efter klikket. Opsætningen bør testes på flere netværk, for eksempel Awin, Tradedoubler og Partnerize. Hvert netværk har små forskelle i, hvordan cookies sættes og læses.
Eventsporing viser, om knapperne faktisk virker. I Google Analytics 4 opsættes klik-events via gtag eller Google Tag Manager. Målret knapperne med CSS-klasser eller data-attributter for præcis måling uden ekstra støj.
Attribution mellem klik og køb kræver tid og nøgterne forventninger. Mange klik bliver til intet køb, sessioner afbrydes, og adblockere forstyrrer sporing. En 1:1-match sker sjældent. Sammenligning over tid giver stadig solid indsigt i performance.
Deep linking løfter konverteringen ved at sende brugeren direkte til relevante produktsider i stedet for forsider eller brede kategorier. Færre trin giver en mere glidende vej til køb.
For SEO er det klogt at markere affiliate-links med rel=”sponsored” og eventuelt nofollow. Det gør linkets karakter tydelig og minimerer risiko for problemer. Siden fremstår åben over for både brugere og algoritmer.
Små ændringer i knaptekst eller farve kan flytte meget. Enkle A/B-tests viser ofte 5-20 % højere klikrater med nye formuleringer eller tydeligere kontrastfarver. Det giver hurtig gevinst i trafik og salg.
Tilføj ikon til reveal button i WordPress for et tydeligt budskab
Et ikon på en reveal-knap i WordPress gør budskabet klart og mere indbydende. Vælg et symbol, der siger “afslør” eller “kupon” med det samme, fx en lås, nøgle, saks eller et kupon-tag. Symbolet forklarer funktionen uden ekstra tekst.
Hvis pluginet tillader det, er en lille SVG eller PNG omkring 24 px høj et godt valg. Det giver skarpe kanter på retina-skærme, hvor bløde linjer ellers bliver slørede. I custom temaer uden plugin-support kan et ::before-pseudo-element med baggrundsbillede og lidt venstre-padding løse det samme. Knappen får et visuelt løft uden ekstra filer i systemet.
En emoji som 🔓 eller 🎟️ kan indsættes direkte i knapteksten. Det virker med det samme og kræver ingen filer. Hold teksten kort, under otte-ti tegn inklusive emoji, så undgås akavede linjeskift på små skærme.
Tilgængelighed er vigtigt. Dekorative ikoner bør have aria-hidden=”true”, så skærmlæsere springer dem over. Giv knappen en præcis aria-label, der beskriver handlingen tydeligt for brugere med synsnedsættelse.
Farver på ikon og tekst skal have tydelig kontrast og samme styrke i udtrykket. Blege grå ikoner på farvet baggrund forsvinder og mister effekt.
Test på mobil først. Ikonets størrelse og placering må ikke skubbe teksten ud over to linjer eller skabe rod i layoutet. Kort tekst og et passende ikon giver en stram og letforståelig knap.
Best practice og fejlfinding for content reveal button med klik for at vise indhold
En content reveal-knap kræver omtanke fra start. Målet er en klar oplevelse for brugeren, både visuelt og i funktion. Teksten på knappen skal være konkret og invitere til klik, så det er tydeligt, hvad der sker. Designet skal være let at læse med god kontrast og passende størrelse, så alle kan bruge knappen uden besvær.
Klikdata viser, om knapperne virker. Tjek GA4 i realtid for at se responsen, og bekræft samtidig hos affiliate-netværket, at hvert klik registreres korrekt. Tilgængelighed er et must. Test med tastaturnavigation og skærmlæsere som NVDA eller VoiceOver, så både afsløring af indhold og redirect til link bliver kommunikeret tydeligt.
Sikkerhed tæller også. Brug kun https-links og undgå følsomme oplysninger i selve reveal-teksten. Hastighed må ikke falde efter implementering. Mål Core Web Vitals før og efter, så uventede fald i oplevelsen opdages i tide.
Skriv et svar