Cum se adaugă efect de punct la o coloană din Elementor

Doriți să adăugați un efect de hover la o coloană în Elementor?

Elementor este perfect pentru creați un site web, în care accentul este pus pe design. În Elementor, puteți adăuga efecte de animație pentru a face site-ul dvs. mai interactiv.

Unul dintre efectele de animație pe care le puteți adăuga la o pagină alimentată de Elementor este efectul de hover. Puteți adăuga un efect de trecere la o secțiune, coloană sau widget.

Acest articol vă va arăta cum să adăugați un număr la o coloană în Elementor. Apropo, dacă sunteți nou la Elementor, puteți consulta articolul nostru anterior pentru a afla cum se instalează Elementor.

Cum se adaugă efect de punct la o coloană din Elementor

În Elementor, coloana este un element obligatoriu. Aici puteți adăuga widget-uri – elementele de design reale pentru a vă crea pagina. Ca și în cazul altor tipuri de elemente din Elementor, puteți personaliza și o coloană pentru a o face elegantă.

Puteți adăuga fundal de culoare solidă, fundal de imagine, umbră, pentru efectul de hover. Efectul de hover încorporat al Elementor vă permite să utilizați un fundal diferit, un chenar diferit și o umbră interioară diferită la hover.

Pentru a începe să adăugați un efect de trecere la o coloană în Elementor, mai întâi faceți clic pe mânerul coloanei la care doriți să adăugați efectul de trecere cu mouse-ul pentru a comuta la panoul de setări a coloanei.

În panoul de setări (panoul din partea stângă), accesați fila Stil și deschideți blocul Fundal. În cel din urmă, puteți deschide fila AU PREZENTARE GENERALĂ pentru a seta un fundal diferit asupra stării de indicare.

Puteți utiliza un fundal de culoare solidă, un fundal de culoare gradient sau un fundal de imagine. De asemenea, puteți seta durata tranziției (tranziția de la starea normală la starea de indicare) în opțiunea Durata tranziției.

Pentru a seta un chenar diferit și o umbră de casetă diferită în starea de trecere cu mouse-ul, puteți deschide blocul Frontieră. Faceți clic pe filă LA MUSCĂ  din acest bloc și setați stilul chenarului, dimensiunea chenarului, culoarea chenarului, raza graniței și umbra zonei pentru starea hover.

Adăugarea unui efect de hover avansat la o coloană în Elementor

Spre deosebire de Divi Builder, Elementor nu folosește transformarea CSS pentru efectul de hover. Prin urmare, puteți adăuga doar efecte de hover de bază. Dar la fel ca Elementor (versiunea pro) tu vă permite să adăugați CSS personalizat, puteți utiliza CSS personalizat pentru a adăuga transformarea CSS pentru a adăuga efect avansat de trecere cu mouse-ul.

Efectele de hover sunt create folosind transformarea CSS. Pentru a adăuga o transformare CSS la o coloană, mai întâi accesați fila Avansat și deschideți blocul CSS personalizat (asigurați-vă că panoul de setări este în modul panou de setări coloane). Adăugați următorul cod CSS.

Codul :

selector: hover {tranziție: toate .2s ușurință-în-ieșire; transformare: scară (1.1); cursor: punct; indice z: 1; }

• Matrice
• Traduceți
• Scară
• Roti
• oblic

Codul CSS de mai sus folosește transformarea la scară. Îl puteți înlocui pur și simplu cu orice stil de transformare doriți.

citit această pagină pentru a afla mai multe despre transformarea CSS.

1. Rezervare vizuală a restaurantului

Creați sistemul Rezervare online site-ului dvs. de restaurant sau cafenea, datorită acestui excelent plugin WordPress premium. Cu acesta din urmă, veți avea posibilitatea de a crea singur mese și locuri pe grila pe care o oferă acest plugin și de a lăsa clienții să le rezerve pe cele gratuite, aceasta este caracteristica principală a acestui plugin și ceea ce îl diferențiază de celelalte plugin-uri din această listă.

Folosind Drag & Drop, puteți trage diferite tipuri de mese pe grila restaurantului dvs. și puteți calcula numărul maxim de locuri pentru fiecare masă, precum și numărul de mese. Vizitatorii restaurantului dvs. pot alegeți forma mesei pe care o preferă și locația mesei în raport cu celelalte mese din grilă.

Aici pentru tine Pluginurile 5 WordPress pentru a optimiza descrierile și etichetele categoriilor

Clienții restaurantului dvs. vor fi încântați să facă această alegere direct pe internet, în loc să călătorească. Cu acest plugin vor putea face o idee despre ceea ce îi va aștepta astăzi.

Oferă printre alte caracteristici: suport pentru Drag and Drop, 3 tipuri de sistem de rezervare, o manipulare destul de intuitivă, o personalizare completă a aspectului său și multe altele.

Descarca | Demo | web hosting

• Care este diferența dintre un blog și un site web?
• Cum să copiați și să lipiți text în WordPress fără probleme de formatare
• Evaluare comparativă SEO: analiză competitivă
• 5 plugin-uri WordPress pentru a accepta plăți PayPal