Dëshironi të krijoni një buton lundrues me indeksin Z Elementor ?

Jemi të sigurt që jeni njohur me butonin që shfaqet përpara të gjithë përmbajtjes së ekranit dhe zakonisht me një formë rrethore dhe një ikonë në qendër. Epo, ky është butoni i veprimit lundrues.

Butoni i veprimit lundrues mund të shkaktojë një veprim ose t'ju dërgojë të lundroni diku. Të tilla si nxitësit për email, rrjetet sociale, orientimi i vizitorët për t'u abonuar në një kanal dhe shumë të tjerë.

Dans Elementor, ekzistojnë dy mënyra për të krijuar një buton veprimi lundrues, ato janë si më poshtë:

  • Duke vendosur Z-Index
  • Duke krijuar një dritare kërcyese -Popup-

Në këtë tutorial ne do t'ju tregojmë vetëm se si të krijoni një buton veprimi lundrues duke vendosur indeksin Z. Dhe ne do të përdorim versionin pro për ta realizuar atë.

Por së pari, zbuloni: Si të instaloni Elementor në WordPress

Si të krijoni butonin e veprimit lundrues në Elementor

Ju mund të përdorni versionin falas tëElementor për të krijuar butonin e veprimit lundrues me këtë metodë. Por, ju duhet të ngjitni butonin që keni projektuar në secilën faqe ku dëshironi që butoni të shfaqet në tuaj Faqja e internetit.

me Elementor Pro, ju gjithashtu mund të përdorni funksionin CSS e personalizuar, të cilin do ta përdorim në këtë tutorial.

Shkoni te redaktori juaj Elementor; ju mund të modifikoni përmbajtjen tuaj ekzistuese (faqe, artikuj, etj...) ose të krijoni një të re. Në këtë tutorial, ne do të modifikojmë një faqe.

Së pari, krijoni një seksion të ri me një kolonë të vetme. Zgjidhni miniaplikacionin Button dhe tërhiqeni dhe lëshojeni në zonën e redaktimit nga paneli i miniaplikacionit. Pastaj ndryshoni butonin Tekst dhe lidhje. 

Në këtë tutorial, ne do të përdorim butonin si një shkas për të shtyrë vizitorët për të lundruar në Site Web Elementor. Pastaj, në opsionin radhitje, vendoseni në e drejtë et, Së fundi, ndryshoni madhësi të butonit On Shumë i madh.

krijoni një buton lundrues me indeksin Z

Siç mund ta shihni në GIF më lart, ky buton është i palëvizshëm në seksion. Më pas, do ta bëjmë të lëvizë ndërsa lëvizim duke e mbajtur në të njëjtin pozicion.

Shko te skeda i përparuar. Në parametrin Paraqitja, vendosni gjerësinë në Inline (makinë), përcaktojnë pozicioni në Fiks, vendosur orientimi horizontal në e drejtë dhe rregulloje atë dekalazh Si të duash.

krijoni një buton lundrues me indeksin Z

Më pas, ne do të përcaktojmë gjërat thelbësore në këtë metodë. Në fushë Z-Index, shkruani numrin 9999 do ta bëjë butonin gjithmonë përpara (lundrues).

krijoni një buton lundrues me indeksin Z

Tani është koha për të rrotulluar butonin e veprimit lundrues. Gjithmonë nën skedën i përparuar, akses klasa css nga blloku plan urbanistik, pastaj shkruani rotate brenda

Shih gjithashtu: Elementor: Prezantimi i ndërtuesit më të mirë të faqeve të WordPress

Pas kësaj, shkoni në bllok Custom CSS , më pas ngjisni kodin e mëposhtëm në fushë:

.rotate.rotate
{transform: rotate(90deg);}

Mund të shihni që pulla sapo është rrotulluar, por ka një hendek të çuditshëm midis anës së ekranit. Pra, le ta rregullojmë duke rregulluar dekalazh në -92

krijoni një buton lundrues me indeksin Z

Më në fund, ne do të bëjmë një prekje të vogël të fundit për këtë buton veprimi lundrues. Hyni në bllok transformator, zgjidhni atë VËSHTRIM I PËRGJITHSHËM, aksesoni opsionin Kompensimi dhe vendosni çdo opsion në 7.

krijoni një buton lundrues me indeksin Z

Ka disa opsione për të arritur një gjë të caktuar në Elementor. Kur bëhet fjalë për butonin lundrues, mund të përdorni dy opsione. Këtu kemi mbuluar vetëm një metodë, metoda tjetër do të jetë një tjetër tutorial.

Lexo gjithashtu: Elementor: Si të migroni një uebfaqe të WordPress

Nëse dëshironi të keni më shumë opsione stilimi, krijimi i një butoni veprimi lundrues duke përdorur ndërtuesin e Popup-it do të jetë një alternativë më e mirë pasi do të keni opsione për të personalizuar butonin si dhe sjelljen, si koha e mbylljes së butonit, kohëzgjatja, animacioni i hyrjes ose i daljes, etj. .

Ju sapo e keni përfunduar këtë detyrë me lehtësi. Thjesht shikoni paraprakisht punën e tabletit dhe smartfonit tuaj, duke u përpjekur të ndryshoni kufijtë që të përputhen me secilën pajisje.

Merrni Elementor Pro Tani!

Përfundim

Kështu që ! Kjo është ajo për këtë artikull që ju tregon se si të aplikoni një efekt Zoom në një kartë profili. Nëse keni ndonjë shqetësim se si të arrini atje, na tregoni brenda komente.

Sidoqoftë, gjithashtu mund të këshilloheni burimet tona, nëse keni nevojë për më shumë elemente për të realizuar projektet tuaja të krijimit të faqeve në Internet, duke u konsultuar me udhëzuesin tonë për Krijimi i blogut të WordPress ose atë më Divi: tema më e mirë e WordPress të të gjitha kohërave.

Por në ndërkohë, ndajeni këtë artikull në rrjetet tuaja të ndryshme sociale.

...