Mūsdienu digitālajā vidē ir svarīgi izstrādāt pievilcīgas tīmekļa vietnes. Plaši izmantotais WordPress lapu konstruktors Elementor piedāvā dažādus logrīkus pievilcīga dizaina izveidei. Viens no šiem noderīgajiem rīkiem ir ikonu lodziņš, kas ļauj vizuāli pievilcīgi strukturēt saturu. Šajā rokasgrāmatā mēs padziļināti izpētīsim ikonu kastītes funkcijas un soli pa solim parādīsim, kā to efektīvi izmantot savos projektos.
Galvenie secinājumi
- Ikonu lodziņā attēlu vietā tiek izmantotas ikonas, taču tas piedāvā mazāk pielāgošanas iespēju.
- Teksta laukos var izmantot HTML, lai nodrošinātu īpašu formatēšanu.
- Ikonu krāsu un lielumu, kā arī to izlīdzināšanu un novietošanas efektu var pielāgot.
Soli pa solim, kā izmantot ikonu lodziņu
1. Ikonas lodziņa izvēle
Vispirms atveriet Elementor redaktoru. Lai izmantotu ikonu lodziņu, vienkārši velciet to no logrīku saraksta uz savu dizainu. To var atrast Elementor izvēlnē kreisajā pusē. Ikonu lodziņu parasti var atrast sadaļā "Elementi".
2. Ikonu kastes pamatprincipu izpratne
Ikonas lodziņš sastāv no diviem galvenajiem elementiem: ikonas un teksta. Atšķirībā no attēla, kur jums ir vairāk pielāgošanas iespēju, ikonu iespējas ir nedaudz ierobežotākas. Ikona tiek attēlota centrā, bet zem tās ir virsraksts un apraksta teksts.
3. Ikonas izvēle un teksta rediģēšana
Kad esat ievietots ikonas lodziņš, izvēlieties vēlamo ikonu. Lai to izdarītu, noklikšķiniet uz ikonas lodziņa un pārlūkojiet pieejamās ikonas. Piemēram, izvēlieties vilciena ikonu, lai dizainam pievienotu tematisku elementu.
Pēc tam pievienojiet vēlamo nosaukumu un aprakstu tekstu. Šeit var noderēt HTML, piemēram, lai pēc teksta bloka sāktu jaunu rindu, ievietojot
-tags.
4. Iestatījumu pielāgošana
Ikonas lodziņš piedāvā dažas pielāgošanas iespējas, tostarp ikonas lielumu un krāsu. Iestatījumu sadaļā var norādīt, kā ikona tiek izlīdzināta attiecībā pret tekstu: pa kreisi, pa vidu vai pa labi. Eksperimentējiet ar atstarpēm, lai teksts izskatītos skaisti un skaidri.
Ikonai ir arī iespēja definēt uzniršanas efektu. Piemēram, jūs varat mainīt krāsu, kad ikona tiek novietota virs tās, lai radītu interesantu vizuālo reakciju.
5 Tipogrāfija un krāsas
Lai uzlabotu lasāmību, varat pielāgot teksta tipogrāfiju. Mainiet nosaukuma un apraksta teksta fonta lielumu, fonta veidu un krāsu. Pārliecinieties, ka krāsas atbilst jūsu vietnes kopējam izskatam. Tas nodrošina saskaņotu dizainu.
Krāsas nav vienīgās pielāgošanas iespējas; varat arī kontrolēt atstarpes starp ikonu, virsraksta un apraksta tekstu. Optimizējiet šo atstarpi, lai uzlabotu lodziņa lasāmību un vizuālo līdzsvaru.
6. Saglabājiet un veiciet priekšskatījumu
Kad esat apmierināts ar savu dizainu, saglabājiet izmaiņas. Lai pārbaudītu, vai viss izskatās tā, kā vēlaties, noklikšķiniet uz priekšskatījuma. Šeit jūs varat redzēt, kā ikonas lodziņš tiks parādīts jūsu tīmekļa vietnē.
Pēdējo reizi apskatot savu dizainu, redzēsiet, vai izlīdzināšana, atstarpes un novietošanas efekti izskatās labi. Pirms lapas publicēšanas izlabojiet visas sīkās detaļas.
Kopsavilkums
Elementor ikonu lodziņš ir lielisks veids, kā vizuāli pievilcīgi attēlot informāciju. Jūs esat iemācījušies, kā atlasīt ikonas, rediģēt tekstu un pielāgot displeju. Izmantojot pareizos iestatījumus, varat padarīt savu tīmekļa vietni ne tikai funkcionālu, bet arī estētiski pievilcīgu.
Biežāk uzdotie jautājumi
Kā izvēlēties ikonu? Noklikšķiniet uz ikonas lauciņa ikonas laukā un pārlūkojiet pieejamās ikonas.
Vai ikonas lauka apraksta daļās var ievietot HTML?Jā, varat izmantot HTML, piemēram, lai iestatītu rindu pārrāvumus vai ievietotu saites.
Vai ikonu lauka iestatījumus var pielāgot? Jā, varat pielāgot ikonu un teksta lielumu, krāsu, atstarpes un izlīdzinājumu.
Kā var iestatīt ikonas novietošanas efektus? Ikonas loga iestatījumos var iestatīt novietošanas krāsas.
