Kako ustvariti navpični vrtiljak s slikami na WordPressu z uporabo Elementorja

Muneeb WordPress Tutorials Jan 25, 2022

Diaprojekcija fotografij ali informacij, ki jih gledalci lahko izberejo s pritiskom na gumb, ki jih premika naprej ali nazaj v diaprojekciji, je znana kot vrtiljak slik. Popestri splošni videz vaše spletne strani in pomaga pri promociji osnovnih storitev.

Privlačne fotografije lahko privabijo nove obiskovalce na vaše spletno mesto, tako da takoj pritegnejo njihovo pozornost. Ta vadnica vam bo pokazala, kako uporabiti Elementor za ustvarjanje navpičnega slikovnega vrtiljaka v WordPressu.

Kako ustvariti navpični vrtiljak s slikami Elementor

Najprej ustvarite primerno sliko za vaš Elementor Vertical Smooth Carousel. Potrebovali boste sliko, ki že vsebuje vse vaše fotografije. S programom Crello , podobnim Canvi, ga lahko naredite, vendar bi morala zadoščati katera koli programska oprema za urejanje slik.

Seveda ima to pomanjkljivost, da ni dinamičen, in morda je neprijetno, če je treba spremeniti le nekaj fotografij. Vendar pa zagotavlja številne prednosti. Proizvaja samo CSS vrtiljak brez zahtev JS. Animacija je zelo gladka, z zelo malo izkoriščenosti CPU-ja. Na kratko, je neverjetno učinkovit, čeprav nekoliko neprijeten.

Ustvarite neverjetna spletna mesta

Z najboljšim brezplačnim graditeljem strani Elementor

Začni zdaj

Nato svojemu stolpcu dodelite navpični stolpec z imenom kot razred.
Nastavite prostor za pripomočke za ta stolpec na 0 v nastavitvah stolpcev in postavitve .

Add an image element to that column and choose the picture you made. Dodajte element slike v ta stolpec in izberite sliko, ki ste jo naredili. Assign the class carousel vertical to the picture element . Elementu slike dodelite navpično vrtiljak razreda.

Naredite vse natančno tako, kot želite, nato pa ponovite. V tem stolpcu boste potrebovali dva od njih, vsak z enakimi parametri. Nato lahko nadaljujete z uporabo spodnje kode CSS. To kodo lahko uporabite kjer koli za spremembe.

.carouselvertical {
    animation: 10s linear 0s infinite normal none running vloop;
}

.verticalcolumn 

Koda vsebuje precej komentarjev, ki vam omogočajo, da razumete dovolj in izvedete spremembe, kjer koli potrebujete. S to kodo lahko uspešno ustvarite navpični vrtiljak Elementor .

5 najboljših vtičnikov za vrtiljak za slike

1. Objavi vrtiljak za Elementor

Post Carousel For Elementor by iThemelandCo je dodatek za Elementor, ki vam omogoča ustvarjanje neverjetno kreativnih medijskih vrtiljakov s svojimi že pripravljenimi postavitvami vrtiljaka. Vtičnik se odlično integrira z Elementorjem in ponuja 19 vnaprej izdelanih postavitev. Te postavitve so popolnoma prilagodljive in jih je mogoče enostavno prilagoditi vašim potrebam z uporabo mehanizma povleci in spusti Elementor.

Vrtiljak izdelkov za Elementor

Product Carousel For Elementor je še en vtičnik za dodatke Elementor, ki je izrecno zasnovan za trgovine z e-trgovino, da predstavijo svoje izdelke v vrtiljaku. Vtičnik ponuja 12+ kontrolnikov vrtiljaka, kot so samodejno predvajanje, drsenje za pomikanje, pavza ob lebdenju itd. Vtičnik je zelo odziven na vseh vrstah naprav in ustvarite lahko toliko vrtiljakov, kolikor želite. Poleg tega je 100 % večjezični vtičnik, kar pomeni, da bo deloval, tudi če je vaše spletno mesto prevedeno v drug jezik.

3. Hitri vrtiljak za Elementor

Fast Carousel For Elementor je vtičnik za dodatke Elementor, ki trdi, da je dovolj hiter, da v minuti ustvari vrtiljak za vas. Kakor se sliši impresivno, ponuja tudi različne vrste galerij in več kot deset edinstvenih stilov. Vtičnik je opremljen z več kot petimi kontrolniki vrtiljaka, poleg tega pa ponuja barvne možnosti po meri z vsakim vrtiljakom. Za hitro rešitev je to morda najboljša izbira za vrtiljak s slikami.

Upamo, da vam je ta vadnica pomagala pri izboljšanju vašega spletnega mesta. Ne pozabite, da se nam pridružite na naših Facebook  in Twitter , da boste še naprej prejemali vadnice, s katerimi bo vaše WordPress potovanje zabavno in enostavno.

Divi WordPress Theme