Radošs attēlu kastes dizains Elementor

Tīmekļa vietnes pielāgošanu var izšķiroši ietekmēt attēlu satura izmantošana. Izmantojot Elementor attēlu lodziņu, jums ir iespēja radoši attēlot attēlus kopā ar virsrakstiem un aprakstu tekstiem. Izpētīsim kopā svarīgos soļus, lai efektīvi izmantotu šo funkciju.

Galvenie secinājumi

• Attēlu lodziņš ļauj ievietot attēlus, virsrakstus un tekstu.
• Attēlus var augšupielādēt no multivides centra vai no ārējiem avotiem.
• HTML elementi palīdz formatēt tekstu.
• Svarīgas ir attēlu dizaina atšķirības, piemēram, tipogrāfijas īpašības un uzniršanas efekti.

Soli pa solim

1. attēla rūtiņas ievietošana

Vispirms jums ir jāpievieno attēlu lodziņš Elementor redaktorā. Elementu var vilkt tieši no atlases jaunajā cilnē un nomest to uz vēlamās teksta pozīcijas savā tīmekļa vietnē. Tādējādi tiks sagatavots pamata izkārtojums ar vietu attēlam, virsrakstam un apraksta tekstam.

2. attēla atlase

Tagad izvēlieties attēlu. Vai nu dodieties uz multivides bibliotēku, vai augšupielādējiet jaunu attēlu. Pārliecinieties, ka attēlam ir atbilstoša kvalitāte un optimāls izmērs. Vēlams, lai tas nebūtu lielāks par 200 MB, lai neietekmētu jūsu vietnes ielādes laiku.

3. Iestatiet attēla izmēru

Lai pielāgotu attēla rādīšanu, varat izvēlēties dažādas izmēra opcijas: Miniatūra, vidējs, liels vai oriģinālais izmērs. Pārliecinieties, vai izvēlētais attēls atbilst jūsu lapas kopējam dizainam. Pārāk liela vieta nepiemērota attēla formāta dēļ var mazināt vizuālo iespaidu.

4. virsraksta formatēšana

Pārejiet uz attēla lauka nosaukuma apgabalu. Šeit varat ievadīt attēlu kolekcijas nosaukumu, piemēram, "Austrijas karogs". Izdomājiet kodolīgu nosaukumu, kas uzreiz piesaista uzmanību.

5. Pievienojiet apraksta tekstu

Ja vēlaties, zem nosaukuma varat pievienot arī aprakstu. Tas nav obligāts, bet ir labs veids, kā apmeklētājiem sniegt vairāk informācijas. Ja apraksts ir garāks, jums vajadzētu izmantot HTML tagus, lai izveidotu rindkopas.

6. teksta formatēšana, izmantojot HTML

Lai tekstā izveidotu rindas pārrāvumu, ir jāizmanto HTML elementi. Piemēram, tagu
tagu izmanto, lai izveidotu rindas pārrāvumu. Ja vēlaties uzzināt vairāk par teksta formatēšanu, uzziniet vairāk par HTML kodiem tiešsaistē.

7. Pievienojiet saiti

Saistībā ar attēlu varat pievienot arī saites. Tās var būt saites uz jūsu vispārējām lapām vai konkrētu saturu, piemēram, jūsu YouTube kanālu. Pārliecinieties, ka saite ir ievadīta pareizi, lai lietotāji varētu tai piekļūt tieši.

8. attēla novietojums un izlīdzināšana

Tagad varat noteikt attēla izvietojumu lodziņā: pa kreisi, pa labi vai pa vidu. Pārbaudiet arī virsraksta un apraksta tipogrāfiju, lai fonts izskatītos pievilcīgs jūsu apmeklētājiem.

9. pielāgojiet stilu

Stila opciju jomā varat iestatīt attēla un teksta fonu, atstarpi un stūra rādiusu. Ņemiet vērā, ka, pielāgojot stūra rādiusu, var noapaļot attēlu un piešķirt tam elegantāku izskatu.

10. konfigurējiet uznirstošā ekrāna efektus

Nosakiet, kā attēliem jāreaģē, kad lietotājs pār tiem pārvietojas ar peli. Jums ir iespēja pievienot animācijas, piemēram, liekot attēlam nedaudz izaugt vai mainot necaurspīdīgumu. Šādi efekti papildina jūsu vietnes lietošanas pieredzi un padara to dinamiskāku.

11. iestatiet virsraksta un apraksta tipogrāfiju

Visbeidzot, varat konfigurēt virsraksta un apraksta tipogrāfiju. Eksperimentējiet ar dažādiem fontiem un krāsām, lai uzlabotu savas vietnes dizainu. Tas padarīs tekstu lasītājiem draudzīgāku un vizuāli pievilcīgāku.

Kopsavilkums

Elementor attēlu lodziņš piedāvā daudzveidīgas iespējas attēlu satura attēlošanai. Jūs varat strādāt radoši un vienlaikus uzlabot lietotāja pieredzi. Jūs varat padarīt attēlus vēl interesantākus, izmantojot piemērotu formatējumu, uznirstošā loga efektus un pievilcīgas saites.