Vil du finne ut hvordan du lager et interaktivt bilde med Hotspots i WordPress takket være Elementor og essensielle tillegg?
Bildet er et utmerket verktøy for å overføre informasjon. Alle vet at informasjon som formidles gjennom bildet - og den visuelle formen som helhet - er lettere å forstå og huske.
I sammenheng med nettet kan du bruke mange bildeformater. Fra en infografikk, et bilde, en tegneserie, en illustrasjon osv….
Hvis du vil lage nettinnhold som anatomien til noe, landemerker i byen, kart eller veibeskrivelser, kan bildebygging med Hotspots være en god idé.
Ideen med denne typen innhold er å gi et interaktivt bilde som gjør det enkelt for leserne dine å forstå informasjonen du formidler. Du kan legge til Hotspots på et bilde som inneholder et verktøytips på hver Hotspot. Her er et eksempel.
Hvis du har en nettside basert på WordPress er det ikke så vanskelig å lage et bilde med hotspots. Du kan opprette en ved å bruke modulen Viktige tillegg .
Hva er Essential Addons-modulen?
Essential Addons er et tillegg tilElementor. Dette er en av de mest populære modsene med over 2 millioner nedlastinger. Dette tillegget legger til rundt 60 ekstra widgets til din Elementor.
En av widgetene som tilbys av Essential Addons er EA Image Hotspots som du kan bruke til å lage et interaktivt bilde. Essential Addons i seg selv er et freemium-tillegg, men du må bruke pro-versjonen for å lage bilder med Hotspots fordi EA Image Hotspots-widgeten kun er tilgjengelig på denne versjonen.
Hvordan bruke modulen Essential Addons for å lage bilder med Hotspots
Først må du installere Elementor og Essential Addons-moduler på WordPress. Du kan få pro-versjonen av Essential Addons på den nettside offisielt. Mens for Elementor kan du bruke gratisversjonen.
Se også: Slik bruker du en global widget i Elementor
Gratisversjonen av Elementor er tilgjengelig i katalogen til WordPress Plugin slik at du kan installere den ved å skrive "elementor" i søkeboksen for plugins-installasjon (Plugins – > Legg til).
Når Elementor og Essential Addons er installert, oppretter du en ny side (Sider – > Legg til) eller et nytt element (Elementer – > Legg til) og rediger den med Elementor. Du vil bli omdirigert til Elementor-editoren etter å ha klikket på knappen Rediger med Elementor.
Før du oppretter bildene med hotspots, kan du angi oppsettet først. For å gjøre dette, åpne sideinnstillingspanelet ved å klikke på tannhjulikonet i nedre venstre hjørne av venstre panel.
Les også: Slik bruker du Elementors innleggswidget
Angi oppsettet på rullegardinmenyen layout
Legg til en ny seksjon ved å klikke på plussikonet i redigeringsboksen og legg til EA Image Hotspots-widgeten fra venstre panel.
Legg til bildet ditt ved å klikke på bildevelgeren i venstre panel.
åpent alternativ hotspots på venstre panel for å legge til tilgangspunktene. Som standard inneholder EA Image Hotspots-widgeten en hotspot. Du kan klikke på standardtilgangspunktet for å redigere innholdet.
Som standard er tilgangspunkttypen satt til icon. Du kan endre det til Texte eller forlate Vide hvis du ønsker det.
Klikk på fanen STILLING for å angi posisjonen til tilgangspunktet. Still inn X- og Y-posisjonene ved å dra glidebryterne.
Klikk på fanen VERKTØYTIPS for å legge til verktøytipsinnholdet. Aktiver verktøytipset og legg til innholdet ditt i redigeringsprogrammet. Du kan også angi posisjonen til verktøytipset, enten topp, bunn, venstre eller høyre.
For å legge til flere hotspots, klikk bare på knappen LEGG TIL ET ELEMENT i seksjonen hotspots og gjenta trinnene ovenfor for å angi hotspot-posisjon, verktøytipsinnhold og verktøytipsposisjon.
Åpne seksjonen Verktøytipsinnstillinger for å angi størrelsen på verktøytipsene og animasjonseffekten.
Gå nå til fanen Stil for å style dine hotspots samt verktøytips. Først åpner du alternativet Bilde for å stille inn bildestørrelsen.
Åpen seksjon hotspot for å tilpasse hotpots. Du kan angi størrelse, ikonfarge (eller tekst avhengig av hotspot-typen du har valgt), bakgrunnsfarge, kantradius osv...
Oppdag også: Hvordan legge til relaterte elementer i Elementor
Åpne seksjonen Tooltip for å tilpasse verktøytips. Du kan angi bakgrunnsfarge, tekstfarge, typografi (skriftstørrelse, skriftfamilie, skriftstil) og bredde.
Så langt har du laget bilder med hotspots. Du kan leke med det venstre panelet for å tilpasse bildene dine med hotspots til du er fornøyd med resultatet. Når du er ferdig, kan du klikke på knappen PUBLISH for å publisere siden din.
Legg til bilder med hotspots til Gutenberg
Hvis du vil legge til bilder med hotspots som støttemateriale for artikkelen du jobber med, kan du integrere det med Gutenberg (standard WordPress-editor) ved å bruke plugin Elementor -blokker for Gutenberg. Dette pluginet lar deg bruke en Elementor-mal som en Gutenberg-blokk.
For å lagre bildene med hotspots ovenfor som en Elementor-seksjonsmal, høyreklikk på seksjonshåndtaket og velg Lagre som mal.
Gi modellen et navn og klikk på knappen REGISTRERE.
Åpne artikkelen der du vil legge til bilder med hotspots. Legg til en ny blokk, velg Elementor bibliotek og velg bildemalen med hotspots du nettopp opprettet.
Skaff deg Elementor Pro nå!!!
konklusjonen
Her! Det er det for denne artikkelen som viser deg hvordan lag et interaktivt bilde med Hotspots i WordPress takket være Elementor og Essential Addons. Hvis du har noen bekymringer om hvordan du kommer deg dit, gi dem beskjed i commentaires.
Du kan imidlertid også konsultere ressursene våre, hvis du trenger flere elementer for å gjennomføre prosjektene dine med oppretting av nettsteder, ved å konsultere vår guide om WordPress blog oppretting eller den på Divi: tidenes beste WordPress-tema.
Men i mellomtiden, del denne artikkelen på de forskjellige sosiale nettverkene dine.
...
