Sådan opretter og bruger du billedhotspot på dit WordPress-websted

Billeder og videoer gør altid websteder mere engagerende. Men et hotspot-billede på dit WordPress-websted kan bryde alle tidligere rekorder for brug af normale billeder. Hotspot-billeder indeholder klikbare områder, som vil give dine besøgende mere information. Før oprettelse af et billedhotspot var det ikke så let. 

Heldigvis er det nu blevet super nemt at oprette et billedhotspot ved hjælp af fantastiske WordPress-tilføjelser. Det er blevet selv det nemmeste pga ElementsKit tilføjelse.

ElementsKit er en alt-i-en tilføjelse til Elementor der tilbyder 85+ widgets, 500+ blokke, 25+ færdige hjemmesider og mange flere. Desuden tilbyder det gratis widgets, pro-widgets og avancerede moduler, der vil tage din sidetilpasning til et niveau, du ikke kan forestille dig. Du kan endda lave interaktive hotspot-billeder på få minutter.

Her i denne artikel vil vi afsløre, hvor nemt du kan oprette hotspot-billeder med ElementsKit. Du vil også lære, hvordan du laver interaktive billedkort. Ikke kun billedkort, men du kan også oprette ethvert hotspot-billede efter at have læst denne artikel.

Hvad er et interaktivt billedhotspot på dit WordPress-websted?

Hotspot billeder er interaktive billeder der indeholder hotspot-ikoner på billedet. Disse hotspot-ikoner indeholder popup-vinduer eller værktøjstip, der indeholder tekster, billeder, links osv. 

At skabe interaktive billeder vil hjælpe dig med at levere mere info gennem klikbare områder. Når du blot tilføjer et hotspot-ikon på et WordPress-hotspot-billede, vil det tiltrække dine besøgendes opmærksomhed. 

Desuden vil dine brugere eller besøgende ønske at bruge mere tid på dit websted på grund af iøjnefaldende og informative billeder. Som et resultat vil du se en imponerende forbedring i din Afvisningsprocent og omregningskurs på grund af WordPress hotspot billeder. 

Hvorfor skal du oprette interaktive hotspot-billeder?

Interaktive hotspot-billeder på dit WordPress-websted vil tiltrække dine besøgendes opmærksomhed og reducere Afvisningsprocent. Selv disse billeder kan være mere effektive end videoer. Du finder også mange eksempler på højtydende hotspot-billeder.

Men du skal gerne vide præcis, hvilke fordele du vil få fra disse billeder. Hvorfor skal du bruge ekstra kræfter på at skabe disse billeder? 

Hvis du har disse spørgsmål, så er du bestemt ikke alene. Jeg har også mødt disse spørgsmål, mens jeg oprettede et Elementor-hotspot-billede. Her er svarene på dine spørgsmål om, hvorfor du skal bruge ekstra indsats på at skabe billedhotspots:

1. Hotspot interaktive billeder vil hjælpe dig til interagere med dine brugere mere. Det er altid en fordel at bruge et billede på din hjemmeside. Men det vil være mere, når du bruger et hotspot-billede.

2. Det vil hjælpe dig med at yde mere info til din besøgende. Som hotspot indeholder billeder klikbare områder, der indeholder værktøjstip eller vinduer. Disse vinduer indeholder fotos, tekster, links osv. for at give yderligere information.

3. Hotspot billeder er mobil responsiv. 

I 2021 Statista har fundet ud af en undersøgelse, at "mere end 47 procent besøgende på webstedet bruger mobile enheder til at besøge websteder i USA". 

Så du kan ikke ignorere nødvendigheden af et mobilt responsivt billede.

4. Når du kan interagere mere med dine brugere, kan du også holde dem på dit WordPress-websted. Som følge heraf Afvisningsprocent af dit websted vil også falde.
5. Hvis du tilføjer hotspots for at skabe interaktive billeder, vil det øge brugeroplevelsen og omregningskurs af dit websted. Du vil se synlige forbedringer for tilføjelse af hotspot-billeder.

Nu efter at have kendskab til alle disse fordele, kan du have spørgsmål. 

Hvordan laver man hotspot-billeder? Hvad er den nemmeste måde at oprette et billedhotspot til dit websted? 

Højre?

Fortsæt med at læse for at få din løsning. 

Opret interaktive hotspot-billeder på dit WordPress-websted med ElementsKit

Tilføjelse af hotspot-billeder til dit websted vil hjælpe dig med at engagere dig med dine besøgende mere end før. Desuden bliver dine kunder aldrig kede af at engagere sig i dit websteds indhold. 

Heldigvis kan du nu oprette interaktive billeder til dit WordPress-websted med ElementsKit uden at spilde meget tid. Udover billedhotspottet kan du oprette Elementor off-canvas menu, image swap-effekt i WordPress, osv uden kodning.

Ønsker du at lære mere om ElementsKit?

Så læs ElementsKit: Den bedste tilføjelse til Elementor artikel.

Ved at bruge ElementsKit-widgetten kan du oprette interaktive billedhotspots i otte nemme trin. Føler du dig spændt på, hvordan du kan gøre dette? 

Lad os dykke ind.

Trin 1: Rediger en ny side med Elementor for at skabe interaktive billeder.

Først skal du installere og aktivere ElementsKit. Gå derefter til dit WordPress-dashboard og besøg sider>> tilføj nyt for at oprette et interaktivt billedhotspot.

Klik derefter på knappen Rediger med Elementor for at oprette et nyt hotspot-billede.

Trin 2: Søg og vælg hotspot-widgetten.

I dette trin skal du søge efter en hotspot-widget i widget-søgefeltet.

Træk nu hotspot-widgetten og føj den til den nye sektion ligesom billedet.

Trin 3: Rediger indholdet af dine billedhotspots.

Efter tilføjelse af hotspot-widgetten er det nu tid til at redigere indholdet af widgetten. Til det skal du vælge stilen og baggrundsbilledet fra dit WordPress mediebibliotek eller computer. Jeg bruger google maps billede her. Upload det nu.

Du kan også redigere følgende ting med ElementsKit-hotspot-widgetten:

• Vis glød: Du kan vise og skjule den glød, der vises omkring markøren.
• Klik eller svæv: Denne mulighed hjælper dig med at beslutte, om du ønsker, at dine værktøjstip skal vises ved klik eller svæv. Hvis du vælger hover, vil dine værktøjstip blive vist ved svævning, eller det vil blive vist ved klik, når en bruger klikker på hotspots.
• Aktiv eller ej: Du kan også vise eller skjule alle værktøjstip med denne mulighed.

Når du har redigeret ovenstående ting, skal du tilføje et værktøjstip til dit hotspot-billedkort. For at gøre det skal du klikke på boksen, der er markeret på billedet.

Nu skal du tilføje en titel og beskrivelse til dit værktøjstip. For at gøre det, indsæt en titel og beskrivelse til dit værktøjstip. 

Tilføj derefter et passende billede til dit værktøjstip. Det kan være et hvilket som helst billede. 

Nu skal du justere værktøjstippositionen. Du kan flytte din markør fra venstre mod højre eller top til bund ved at bruge følgende mulighed. Indstil markøren. Du kan også tilføje flere hotspots ved at klikke på knappen Tilføj element.

Trin 4: Tilpas stilen for indholdet af billedets hotspot WordPress.

I dette trin skal du redigere stilen på dit hotspot-indhold. Vælg passende baggrundsfarve og billede for at ændre standardindholdsstilen for dit Elementor-hotspot-billede. Indstil nu polstring, bredde og justering for dit standardindhold.

Trin 5: Tilpas stilen på markøren for at skabe interaktive billeder.

I dette trin skal du tilpasse markøren. Her kan du tilpasse følgende områder:

• Baggrundsfarve: Vælg baggrundsfarven til din markør.
• Pointer størrelse: Indstil størrelsen på din markør. Du kan gøre den større ved at trække cirklen til højre.
• Grænseradius: Denne mulighed vil lade dig ændre radius af din markør, hvis du vil.
• Kasseskygge: Du kan tilføje skygge med markøren med denne mulighed.
• Kanttype: Vælg den type kant, du ønsker til din markør.
• Punkt farve: Tilpas farven på det punkt, der er placeret i markøren.
• Glød farve: Skift standardglødfarven, der vises omkring markøren, hvis du føler dig nødvendig.

Trin 6: Skift stilen på titlen af dit hotspot-billede.

Til styling af titlen skal du vælge den rigtige typografi til din titel. I typografisektionen kan du ændre følgende områder:

• Familie.
• Størrelse.
• Vægt.
• Transform.
• Stil.
• Dekoration.
• Linjehøjde.
• Bogstavafstand.

Du skal også vælge tekstfarve og indstille den nødvendige margen til din titel.

Trin 7: Tilpas stilen for beskrivelsen og billedet.

Her skal du redigere beskrivelsen af indholdet af værktøjstip. Dette vil være det samme som titeltilpasningen. Indstil nu billedpositionen, hvor du vil have det vist på dit værktøjstip. 

Til sidst skal du ændre margenen og bredden på dit billede efter dit ønske.

Trin 8: Udgiv de ændringer, du har foretaget til dit hotspot-billede.

Endelig efter at have foretaget alle ændringerne, er det nu tid til at offentliggøre. Klik på udgiv-knappen, og du vil være klar til dit hotspot-billede.

Her er outputtet af mit interaktive hotspot-billedkort:

Bemærk:
Du kan også lave avanceret tilpasning til dit hotspot-billede. For eksempel kan du gøre nogle dele klæbrige af dit hotspot-billede. Du kan også indstille betingelser, effekter for dine billeder. Desuden er det åbent for dig at tilføje et avanceret værktøjstip. Du kan også overvåge ændringer ved at klikke på den responsive knap. Din redigering vises på en ny fane, når du klikker på den responsive knap.

Stadig forvirret?

Se demovideoen om, hvordan du bruger hotspot-widgetten:

Hvorfor vælge ElementsKit til at skabe interaktive hotspot-billeder?

Der er mange tilføjelser i WordPress, der tilbyder en hotspot-widget til at skabe hotspot-billeder. 

Men hvorfor skulle du undgå alle andre tilføjelser? Hvorfor skal du kun vælge ElementsKit for at skabe interaktive Hotspot-billeder af høj kvalitet?

Hvorfor betragtes det som et godt værktøj til Elementor?

ElementsKit pro-versionen tilbyder en hotspot-widget. Så det er normalt, at du har disse spørgsmål. Folk er ligeglade, når de bruger en gratis version af et plugin. Men det gør de, når de bruger en betalt version. Fordi folk vil købe det bedste produkt, når de betaler for det. Du er ikke anderledes.

Her er grundene til, at du bør gå efter ElementsKit i stedet for andre tilføjelser:

• ElementsKit vil tilbyde dig fremragende støtte. Supportteamet er altid klar til at give løsninger på ethvert problem, du vil støde på, når du bruger denne tilføjelse. Desuden vil du få det hurtigste svar på nogen af dine forespørgsler. Du vil næppe få denne støtte fra andre tilføjelser.
• På grund af dens brugervenlig funktioner, selv begyndere har ikke problemer med at betjene det. 

• Du kan oprette hotspot-billeder, som du vil. Avanceret tilpasning er også åben for dig. Ikke kun hotspot-billeder, men du kan også oprette et tilpasset header, sidefod, rullemenu osv. med ElementsKit.

• ElementsKit stoppede ikke ved at tilbyde en fremragende brugeroplevelse. Den opdateres løbende for at opfylde dine krav. Desuden er det fuldt ud kompatibel med Elementor. Men du får ikke denne brugeroplevelse, når du installerer eller bruger andre tilføjelser og plugins.

• Uanset om du er ejer af en stor eller lille side, du kan bruge denne tilføjelse uden at støde på nogen problemer. Men nogle tilføjelser vil ikke opfylde dine krav.
• Nogle tilføjelser kan ødelægge dit websted. Du vil ikke stå over for dette problem, når du bliver bruger af ElementsKit.

Dette er de mest vitale grunde, der vil presse dig til at installere og bruge ElementsKit tilføjelse. På grund af ovenstående fordele forlader mange brugere andre tilføjelser og vælger ElementsKit. På tidspunktet for skrivning af denne blog er ElementsKits download pr. uge 117,238+. Det beviser, at brugerne elsker ElementsKit.

Vil du vide mere om ElementsKits rejse? Så læs rejsen med ElementsKit: All-in-one add-on til Elementor.

Kom godt i gang med dit hotspot-billede

Brug af billeder på dit WordPress-websted kan være den mest effektive måde at forbinde med dine besøgende følelsesmæssigt. Men hotspot-billeder på dit WordPress-websted kan tage det til et andet niveau. Heldigvis ved du nu, hvordan du opretter hotspot-billeder på få minutter med ElementsKit. 

Hvis du stadig er forvirret omkring oprettelse af hotspot-billeder, så lad os det vide i kommentarfeltet eller send dine spørgsmål på Wpmet Fællesskab. Vi vil forsøge at løse dit problem. Fortæl os også, om dette indhold er nyttigt.