Progresa joslas ir efektīvs tīmekļa dizaina elements, kas pievilcīgā veidā informē apmeklētājus par projekta vai mērķa izpildes gaitu. Elementor, kas ir viens no populārākajiem WordPress lapu veidošanas spraudņiem, piedāvā iespēju viegli integrēt progresa joslas savās vietnēs. Šajā rokasgrāmatā jūs iepazīstināsim ar soļiem, kā izveidot un pielāgot progresa joslu Elementor.
Galvenie secinājumi
- Progresa joslas nodrošina progresa un mērķu vizuālu attēlojumu.
- Varat pielāgot nosaukumus, vērtības un krāsas.
- Iekšējo tekstu pēc izvēles var parādīt vai paslēpt.
- Ir pieejami dažādi stili un pielāgošanas iespējas, lai pielāgotu joslu savam dizainam.
Soli pa solim
Vispirms atveriet savu WordPress vietni un pāriet uz Elementor redaktoru. Tur varat pievienot jaunu elementu un izvēlēties progresa joslu.

Tagad esat gatavs ievadīt progresa joslas nosaukumu. Izdomājiet piemērotu nosaukumu, piemēram, "Pārdošanas mērķis". Tas sniegs jūsu apmeklētājiem sākotnēju norādi par to, par ko tā ir domāta.
Nākamajā solī jādefinē mērķa vai panākumu ziņa. Padomājiet, ko tieši vēlaties parādīt, un ierakstiet to paredzētajā laukā. Šis solis palīdz padarīt jūsu progresa joslu lietotājiem vieglāk saprotamu.
Tagad varat iestatīt progresa joslas krāsu. Tas nav obligāti, taču tā ir laba iespēja pielāgot dizainu. Varat izvēlēties krāsu, kas saskan ar pārējo jūsu vietni.
Pēc tam pārejiet uz procentiem. Šeit varat iestatīt progresa rādītāju, piemēram, 40%. Atcerieties, ka maksimālo vērtību varat iestatīt uz 100 %, bet minimālo vērtību - uz 0 %. Šī atgriezeniskā saite palīdz apmeklētājiem ātri saprast jūsu progresu.
Procentus var parādīt vai paslēpt. Bieži vien izskatās pievilcīgāk, ja teksts tiek paslēpts, īpaši, ja dodat priekšroku tīram dizainam. Padomājiet, kurš variants ir vispiemērotākais jūsu projektam.
Ja vēlaties, varat pievienot arī iekšējo tekstu, kas satur procentus. Šī funkcija ir īpaši noderīga, ja vēlaties parādīt tūlītēju progresu. Ja nolemjat neizmantot iekšējo tekstu, šeit varat arī paslēpt skaitli.
Tagad viss ir atkarīgs no progresa joslas stila. Varat pielāgot joslas krāsu, neaizpildītās zonas fona krāsu un joslas augstumu. Izvēlieties tumši zaļu toni aizpildītajai zonai un neitrālu fona krāsu, lai iegūtu pārskatāmu izskatu.

Varat arī noapaļot progresa joslas stūrus, lai piešķirtu tai pievilcīgāku formu. Atcerieties, ka stūrus var noapaļot tikai priekšpusē, līdz progress sasniedz 100 %.

Ja vēlaties pielāgot iekšējo tekstu, arī šeit varat mainīt krāsu un tipogrāfiju. Jūs varat nolemt atspējot fontu, lai koncentrētos uz progresu.
Visbeidzot, jūs tiksiet pārcelts uz papildu iestatījumiem, kur varat pielāgot virsraksta teksta krāsu un stilu. Melns, trekns virsraksts ar izvēles ēnu nodrošina, ka jūsu virsraksts izceļas.
Tagad saglabājiet izmaiņas un dodieties uz savu lapu, lai redzētu rezultātu. Iespējams, jūs nolemsiet, ka ir lietderīgi attēlot procentuālo daļu. Ja nē, progresa josla joprojām tiks attēlota pievilcīgi.
Tagad jūsu progresa josla animētā veidā parāda norādīto vērtību, neskaitot no 0. Tā vietā progress tiek vizualizēts uzreiz.
Ja izmantojat Elementor Pro versiju, jums tiks piedāvāti arī dinamiskie atribūti. Šī funkcija ir īpaši noderīga, lai pielāgotu progresa joslas, pamatojoties uz ārējiem datiem vai pat datubāzes vadītām vērtībām.
Kopsavilkums
Šajā rokasgrāmatā jūs uzzinājāt, kā izveidot un pielāgot progresa joslu Elementor. Jūs varat iestatīt virsrakstus un progresa joslu, izvēlēties krāsas un veikt dažādus pielāgojumus, lai integrētu pievilcīgu un efektīvu progresa joslu.
Biežāk uzdotie jautājumi
Kā izveidot progresa joslu Elementor? Izvēlieties progresa joslu Elementor un pievienojiet nosaukumu un progresa vērtības.
Vai es varu mainīt progresa joslas krāsas?Jā, jūs varat pielāgot gan progresa joslas krāsu, gan fona krāsu.
Kāda ir progresa joslas iekšējā teksta priekšrocība? Iekšējais teksts skaidrāk parāda progresu un palīdz vieglāk saprast informāciju no pirmā acu uzmetiena.
Kā saglabāt veiktās izmaiņas?Kad esat veicis visus pielāgojumus, varat saglabāt izmaiņas, lai tās būtu redzamas jūsu vietnē.
Vai Elementor Pro versijā ir kādas īpašas funkcijas? Jā, Pro versijā ir pieejamas uzlabotas iespējas, piemēram, dinamiskie atribūti, kurus varat izmantot, lai vēl vairāk pielāgotu savu progresa joslu.