Želite li saznati kako stvoriti interaktivnu sliku s Hotspots u WordPressu zahvaljujući Elementor i osnovni dodaci?
Slika je izvrstan alat za prijenos informacija. Svatko zna da je informacije prenesene kroz sliku - i vizualni oblik u cjelini - lakše razumjeti i zapamtiti.
U kontekstu weba možete koristiti mnoge formate slika. Od infografike, fotografije, stripa, ilustracije itd.
Ako želite stvoriti web sadržaj kao što je anatomija nečega, gradske znamenitosti, karte ili upute, izgradnja slike pomoću Hotspots može biti izvrsna ideja.
Ideja ove vrste sadržaja je pružiti interaktivnu sliku koja vašim čitateljima olakšava razumijevanje informacija koje prenosite. Možete dodati Hotspotove na sliku koja sadrži opis alata za svaki Hotspot. Evo primjera.
Ako imate web stranica temeljeno na WordPressu, stvaranje slike s vrućim točkama nije teško napraviti. Možete ga izraditi pomoću modula Osnovni dodaci .
Što je modul Essential Addons?
Essential Addons je dodatak zaElementor. Ovo je jedan od najpopularnijih modova s više od 2 milijuna preuzimanja. Ovaj dodatak dodaje oko 60 dodatnih widgeta vašem Elementor.
Jedan od widgeta koje nudi Essential Addons je EA Image Hotspots koje možete koristiti za stvaranje interaktivne slike. Sam Essential Addons je freemium dodatak, ali morate koristiti pro verziju za stvaranje slika s Hotspots jer je widget EA Image Hotspots dostupan samo na ovoj verziji.
Kako koristiti modul Essential Addons za stvaranje slika s Hotspotovima
Prvo morate instalirati module Elementor i Essential Addons na svoj WordPress. Na njemu možete nabaviti pro verziju Essential Addons web stranica službeno. Dok za Elementor možete koristiti besplatnu verziju.
Vidi također: Kako koristiti globalni widget u Elementoru
Besplatna verzija Elementora dostupna je u imeniku WordPress plugin tako da ga možete instalirati upisivanjem “elementor” u okvir za pretraživanje programa za instalaciju dodataka (Dodaci – > Dodaj).
Nakon što su Elementor i Essential Addons instalirani, izradite novu stranicu (Stranice – > Dodaj) ili nova stavka (Stavke – > Dodaj) i uredite ga pomoću Elementora. Bit ćete preusmjereni na Elementor editor nakon što kliknete gumb Uredite s Elementorom.
Prije stvaranja slika s vrućim točkama, prvo možete postaviti izgled. Da biste to učinili, otvorite ploču s postavkama stranice klikom na ikonu zupčanika u donjem lijevom kutu lijeve ploče.
Pročitajte također: Kako koristiti elementorov widget za objave
Postavite izgled na padajućem izborniku raspored
Dodajte novi odjeljak klikom na ikonu plus u okviru za uređivanje i dodajte widget EA Image Hotspots s lijeve ploče.
Dodajte svoju sliku klikom na birač slika na lijevoj ploči.
otvorena opcija vrućih na lijevoj ploči za dodavanje pristupnih točaka. Prema zadanim postavkama widget EA Image Hotspots sadrži žarišnu točku. Možete kliknuti na zadanu pristupnu točku kako biste uredili njezin sadržaj.
Prema zadanim postavkama, vrsta pristupne točke postavljena je na ikona. Možete ga promijeniti u Tekstovi ili otići Vide ako to želiš.
Pritisnite karticu POLOŽAJ za postavljanje položaja pristupne točke. Postavite položaje X i Y povlačenjem klizača.
Pritisnite karticu OPIS ALATA za dodavanje sadržaja opisa alata. Aktivirajte opis alata i dodajte svoj sadržaj u uređivač. Također možete postaviti položaj opisa alata, gore, dolje, lijevo ili desno.
Za dodavanje više žarišnih točaka samo kliknite gumb DODAJTE ELEMENT u odjeljku vrućih i ponovite gornje korake za postavljanje položaja žarišne točke, sadržaja opisa alata i položaja opisa alata.
Otvori odjeljak Postavke opisa alata za postavljanje veličine opisa alata i efekta animacije.
Sada idite na karticu Stil za stiliziranje vrućih točaka kao i opise alata. Prvo otvorite opciju Slika za postavljanje veličine slike.
Otvoreni odjeljak Hotspot za prilagodbu hotpotova. Možete postaviti veličinu, boju ikone (ili teksta ovisno o tipu žarišne točke koju ste odabrali), boju pozadine, radijus obruba itd...
Otkrijte također: Kako dodati povezane stavke u Elementor
Otvori odjeljak Tooltip za prilagodbu opisa alata. Možete postaviti boju pozadine, boju teksta, tipografiju (veličinu fonta, obitelj fonta, stil fonta) i širinu.
Do sada ste uspješno izradili slike s vrućim točkama. Možete se poigrati s lijevom pločom kako biste prilagodili svoje slike vrućim točkama dok ne budete zadovoljni rezultatom. Kada završite, možete kliknuti gumb Objavi objaviti svoju stranicu.
Dodajte slike s vrućim točkama u Gutenberg
Ako želite dodati slike s vrućim točkama kao pomoćni materijal za članak na kojem radite, možete ga integrirati s Gutenbergom (zadani WordPress uređivač) pomoću dodatka Elementarni blokovi za Gutenberga. Ovaj dodatak vam omogućuje da koristite predložak Elementor kao Gutenbergov blok.
Za spremanje slika s vrućim točkama iznad kao Elementor predložak odjeljka, desnom tipkom miša kliknite ručicu odjeljka i odaberite Spremi kao predložak.
Dajte svom modelu ime i kliknite gumb REGISTRACIJA.
Otvorite članak u koji želite dodati slike s vrućim točkama. Dodajte novi blok, odaberite Biblioteka Elementor i odaberite predložak slike s vrućim točkama koji ste upravo stvorili.
Nabavite Elementor Pro sada!!!
Zaključak
Ovdje! To je to za ovaj članak koji vam pokazuje kako izradite interaktivnu sliku s Hotspotovima u WordPressu zahvaljujući Elementoru i Essential Addons. Ako imate bilo kakvih nedoumica o tome kako doći tamo, obavijestite ih u Komentari.
Međutim, možete se konzultirati naši resursi, ako vam treba više elemenata za provođenje projekata kreiranja internetskih stranica, savjetujući se s našim vodičem na internetu Izrada bloga WordPress ili onaj koji je uključen Divi: najbolja WordPress tema svih vremena.
Ali u međuvremenu, ovaj članak podijelite na svojim različitim društvenim mrežama.
...
