At internettet har ændret den måde, vi modtager og behandler information på, er ikke bare en kliché: det er sandheden. På den ene side vores opmærksomhedsspændene forkortes: folk har mindre og mindre tid til tekstindhold. Til gengæld er der ingen erstatning for det, hvis man vil formidle information med enhver betydning eller kompleksitet.
En ting, du kan gøre for at undgå, at dine besøgende bare springer en stor del af teksten over, er at gøre dit tekstindhold scanbart, hvis det eneste, du ønsker, er at fremhæve et par interessante oplysninger. Du kan også bruge fremhævet tekst til accenter. WordPress beskedbokse er stadig en anden ting, du kan prøve: de skiller sig tydeligt ud fra resten af teksten og formidle udvalgte stykker information til dine besøgende.
Vi viser dig, hvordan du opretter beskedbokse til dit WordPress-websted. Men før vi går ind i det små, vil vi gerne diskutere beskedboksen i mere generelle vendinger. Hvis du er sikker på, at alt hvad du behøver er at vide, hvordan du gør det, skal du rulle ned til vejledningssektionen. Her er hvad vi vil tale om:
En WordPress beskedboks er et designelement, der bruges til at henlede en besøgendes opmærksomhed på et stykke information. Den består af en boks, noget tekst og muligvis ikoner eller anden grafik. De relaterer typisk nogle vigtige oplysninger til en besøgende på webstedet og skiller sig ud fra hovedteksten.
Også en beskedboks kan typisk afskediges ved at klikke på et X-tegn eller en anden type lukkeikon. Når brugeren har fået oplysningerne, kan de fjerne beskedboksen med et enkelt klik med musen og komme videre med læsningen. De ser sådan her ud:
En beskedboks bruges bedst, når du vil få dine besøgende til at være særligt opmærksomme på et diskret stykke information som kan informere resten af indholdet, men ikke er nødvendigt for at forstå det. Det kan være tæt forbundet med teksten, men det behøver det ikke.
Måske er den artikel, en besøgende læser, ikke den første del af en serie. I så fald vil du måske give dem besked med en beskedboks om, at de skal læse noget andet først. Har din butik et særligt tilbud relateret til teksten? Måske kan du annoncere det i en beskedboks. Indeholder din bog- eller filmanmeldelse spoilere? Hellere gøre det klart på forhånd.
En beskedboks kan oprettes ved hjælp af kode eller et plugin. Vi vil bruge et gratis plugin, udviklet af os, kaldet Qi Addons til Elementor. Qi Addons udvider Elementors allerede formidable palet af widgets med 60 splinternye, smukt designede elementer, hvoraf den ene er beskedboksen.
Med vores plugin du kan oprette iøjnefaldende WordPress-meddelelsesbokse inden for få minutter. Alt du skal gøre på forhånd er at installere den nyeste version af Elementor (den gratis version er helt fint), og derefter installere Qi Addons. Sammen med Qi Addons til Elementor vil vi bruge vores eget Qi-tema. For de bedste resultater foreslår vi, at du også gør det. Hvis du allerede har investeret i et andet tema, skal du ikke bekymre dig: Qi Addons vil også arbejde med det.
Qi Addons er et separat plugin designet til at arbejde med Elementor og supplere det, og det er det helt gratis. Når du har installeret begge, er du klar. Du kan se, hvordan du opretter en beskedboks i videoen nedenfor:
Hvis du foretrækker din tutorial i tekstform, skal du dog læse videre nedenfor. Til at starte med skal du finde en Meddelelsesbokse element i menuen til venstre og træk det derhen, hvor du vil have det på siden.
Du vil se beskedboksen med dens standardindstillinger. Den har en pladsholdertitel og noget lorem ipsum-tekst. Du kan redigere dem i Generel fanen på widgetten.
Vi vil ikke bruge Brugerdefineret klasse indstillinger for denne demonstration. Det, vi vil gøre, er at ændre Titel til Juster farverne til baggrunde, ikoner, titler og tekst. Det hele tager kun et par klik og slet teksten, hvilket gør dette til en meget enkel beskedboks.
Det, vi også vil gøre, er at ændre ikonerne. Ikonet i øverste venstre side af boksen er det første i din Generel app, og hedder Ikon. Hold musen over for at vise menuerne Ikon bibliotek at ændre det.
Når du er der, kan du vælge fra dine tilgængelige biblioteker. Vi vil tilføje en Bogmærke ikonet ved at søge efter det i søgefeltet, vælge det og klikke Indsæt.
Vi vil også ændre Luk ikon, ikonet til højre, som bruges til at lukke beskedboksen. For at ændre et ikon ved at uploade et .svg-billede skal du holde musemarkøren over kontrolelementet og derefter klikke Upload SVG.
Du kan derefter uploade et nyt billede eller vælge et fra mediebiblioteket, som vi skal. Du skal blot vælge et billede og klikke Indsæt medier når klar.
Med vores ikoner sat, er vi klar til at flytte til Stil fanen.
I hovedafsnittet af Stil fanen, kan du finde en masse muligheder for at style din widgets titel, tekst, ikon og baggrund.
Vi vil ændre vores Titelmærke til H4, men du kan ændre den til enhver overskriftsindstilling eller afsnitstekst. Du kan også ændre Titelfarve, som vi ikke vil gøre, og Titel typografi.
I den Titel typografi indstillinger, kan du ændre skrifttype (Familie), Størrelse (vi har sat vores til 21 pixels), og Vægt (eller “dristighed”). Det Transform kontrol ændrer brugen af store bogstaver i titlen, den Stil kan bruges til at kursivere skrifttypen eller vælge en skrå skrifttype, mens Dekoration kontrol bruges til understregning, overstregning eller gennemstregning.
Det Linjehøjde kan placere linjerne i en titel, hvis den har mere end én, men det har også en effekt på boksens størrelse, da den reserverer plads til en linje, der er høj nok. Vi vil indstille vores til 30 pixels. Det Bogstavafstand kontrol bruges til at skille mellem de enkelte bogstaver i titlen, og vi vil ikke bruge det til denne særlige beskedboks.
Det Tekst farve og Indstillinger for teksttypografi er nøjagtig de samme, men gælder for teksten i modsætning til titlen. Denne særlige beskedboks har ingen tekst, så vi vil ikke bruge dem.
Næste nede finder vi Ikonposition kontroller. Du kan placere dit ikon øverst, i midten eller bunden af titellinjen. Vi kan godt lide det på toppen, så vi lader det være som det er. Vi vil ændre os Ikon farve til #1e1e1e – næsten sort, for at matche vores titelskriftfarve. Til sidst vil vi indstille Ikon størrelse til 23 pixels.
Styringen til Luk ikonstørrelse fungerer nøjagtigt det samme som for Ikon. Det Luk ikonfarve kontrol lader dig vælge en anden farve til dit ikon. Vi vil sætte den til sort (#000000). Det Luk ikon Hover farve er farven på ikonet, når det holdes over af en brugers mus. Vi vil også sætte dette til sort, men med en vis gennemsigtighed (#000000cc).
Næste nede finder vi Baggrundstype kontroller. Denne kontrol har to hovedtilstande: Gradient, som vi ikke vil bruge, og Klassisk, hvilket vi vil. Vi vil bruge en almindelig farvebaggrund, en lyseblå (#d5eaf4), men du kan også bruge en Billede hvis du vælger det.
I bunden af Stil afsnittet på denne fane kan du finde Kassens kantradius kontroller. Du kan bruge disse til at gøre et hvilket som helst af eller alle din beskedbokss hjørner rundere. Vi vil ikke bruge det til denne demonstration.
Endelig finder vi Afstandsstil sektion af fanen. I den Ikon Margin kontrol, kan du indstille afstanden mellem ikonet og de andre elementer. Vi klikker på link ikon for at fjerne forbindelsen mellem værdierne, fordi vi ønsker at finjustere ikonets position. Vi vil sætte topmargenen til 4 og højre margen til 18 pixels.
Det Tekst Margen Top kontrol er der, hvis du vil adskille teksten fra titlen. Da denne beskedboks ikke har nogen tekst, har vi ikke brug for den.
Endelig Kassepolstring kontrol bruges til at kontrollere afstanden mellem boksens kanter og dens indhold. Vi får ikke brug for det til denne demonstration.
Og der har du det, en smuk beskedboks på blot et par minutter.
Afslutningsvis
Som du kan se, er det bemærkelsesværdigt nemt at oprette en beskedboks i WordPress. Alt du behøver er et par gratis plugins (Elementor og Qi Addons), og en god idé til et iøjnefaldende design. Med Qi Addons får du en fuldt funktionel beskedboks med praktisk talt ubegrænsede stylingmuligheder. Vi opfordrer den til at bruge den.
Støt vores arbejde ❤️
Hvis du kunne lide denne artikel, kan du overveje at give drikkepenge for at hjælpe os med fortsat at udgive kvalitetsindhold.
