Jeste li ikada tražili stvaranje okomitog alata za praćenje napretka umjesto tradicionalnog klizača? Ako ne, prelistajte ovaj članak do kraja kako biste saznali kako ga izraditi Elementor Pro.
Ali prije nego što se pozabavimo glavnom temom, prvo se prisjetimo što je to alat za praćenje napretka.
Praćenje napretka je indikator napretka koji obavještava korisnika o napretku procesa koji je u tijeku, kao što je instaliranje aplikacije, ažuriranje, čitanje članka itd. A postoje dvije vrste:
- le linearno praćenje napretka
- le kružno praćenje napretka
Također možete pročitati: Elementor: Kako stvoriti efekt karticu iz portfelja
U ovom vodiču pokazat ćemo vam kako korak po korak umetnuti vertikalni indikator napretka u odjeljak koji sadrži arhive postova.
Stvorite alat za praćenje napretka
U kartici elementi s alatne pločeElementor, upišite u traku za pretraživanje Praćenje napretka. Zatim povucite widget u odjeljak.
Zatim se pojavljuje indikator napretka. Prema zadanim postavkama, orijentiran je vodoravno. Ali ne brinite, kasnije ćete vidjeti kako to okomito rasporediti.
Pokazatelj napretka se stvara, izvršimo potrebne izmjene kako bismo dobili željeni rezultat.
Otkrijte također: Elementor: Kako stvoriti efekt karticu iz portfelja
Uredite sadržaj alata za praćenje napretka
Ovdje ćete odabrati vrstu trackera i na što se odnosi.
Glavne postavke su:
- tipični tragač: ovdje je zadana vrijednost Vodoravan. Međutim, kada se pomičete niz popis, vrsta kružni također vam se nudi. Zadrži zadano.
- Napredak u odnosu na: u ovoj drugoj postavci odaberite vrijednost selecteur. Ovaj izbor će dovesti do dodatne postavke: Selektor.
- Selektor: Ovo polje je namijenjeno za primanje identifikatora objekta na koji će se pratilac pričvrstiti.
Odaberimo arhivu publikacija budući da je to element na koji je priložen naš tracker.
Na ploči s postavkama idite na karticu Napredno, a zatim unesite vrijednost u polje CSS ID.
Zatim se vratite na ploču za praćenje i ispunite polje Odabir u izborniku sadržaj.
Na kraju postavite indikator napretka udesno.
Promijenite stil alata za praćenje napretka
U ovom koraku ćemo konfigurirati parametre indikatora napretka kao i pozadinu potonjeg.
Započnite postavljanjem indikatora napretka.
Pročitajte također: Elementor: Kako napraviti galeriju slika
- Podešavanje boja napretka omogućuje vam odabir između klasične progresije i gradijentne progresije. U našem primjeru odaberite prvu opciju. Međutim, bez obzira na izbor, čini se da je postavka boja.
- Postavite lima boju pomoću globalne palete boja ili alata za odabir boja.
- Vrsta granice: ovdje imate šest prijedloga (nijedan, pun, dvostruki, točkasti, točkasti, utor). Odlučite se za puni rub.
- širina: Ovo služi za davanje debljine rubu vašeg indikatora napretka.
- Radijus granice: Prema zadanim postavkama indikator napretka izgleda kao pravokutnik. Promjenom radijusa, njegovi krajevi postaju zaobljeni.
Na kraju postavite stazu postavke pozadine. Primjećujete da se vraćaju gotovo iste postavke. Stoga ograničite svoje na one prije spomenute.
Promjena naprednih opcija praćenja napretka
Da bismo dovršili naš rad, postavit ćemo sljedeće kartice: efekti kretanja, transformacija i prilagođeni CSS.
Počnimo prvo s karticom Prilagođeni CSS. Odaberite ga, a zatim umetnite sljedeći kod u odgovarajuće polje. Omogućuje definiranje širine tragača. Dakle, postavlja širinu na 50% visine prozora.
Zatim okrenite uređaj za praćenje u okomitom smjeru. Da biste to učinili, odaberite podizbornik Transformator, omogućite rotaciju, zatim upišite 90 u prazno polje. Ovo će rotirati naš widget za 90 stupnjeva dajući vam željeni okomiti položaj.
Za poravnanje našeg widgeta na istoj razini kao i prve objave, primijenite pomak od 145.
Na ovoj razini, ako pomičemo našu stranicu, vidjet ćete da indikator napretka nestaje dok pomičemo našu sadržaj.
Da biste riješili ovaj problem, otvorit ćete karticu Efekti kretanja, zatim ispustite naredbu Pin i odaberite ispod.
Ovaj put, pomičući se prema dolje, možemo vidjeti kako se naš alat za praćenje napretka postupno popunjava dok se krećemo kroz našu arhivu objava.
Nabavite Elementor Pro odmah!
Zaključak
Dakle! To je sve za ovaj članak koji vam pokazuje kako izraditi okomito praćenje napretka.
Dodavanje interaktivnih elemenata kao što je okomiti indikator napretka prilikom izrade vašeg web stranica može doista podići na višu razinu čineći ga intuitivnijim. Osim toga, može se povezati na cijelu stranicu ili na sadržaj publikacije, pa čak i bilo kojem drugom specifičnom elementu stranice. Znati kako ga koristiti bila bi stoga dodatna prednost.
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.
...
