Cum se face un glisor de comparație a imaginilor în WordPress

Cum se face un glisor de comparație a imaginilor în WordPress

Pasul 1: Instalați și activați addon -urile elementare pentru elementor

Înainte de instalare, asigurați -vă că atât WooCommerce, cât și Elementar sunt activate în tabloul de bord.

Descărcați pluginul : Accesați pagina Plugin Elementso Addrons și descărcați pluginul.

Accesați tabloul de bord WordPress → pluginuri → Adăugați nou → plugin de încărcare.

Încărcați fișierul descărcat și faceți clic pe „Instalați acum”.

Odată instalat, faceți clic pe „Activare” pentru a activa pluginul.

Pentru a instala Elementto Addrons, vă rugăm să vizionați mai jos tutorialul video:

Pasul 2: Creați sau editați o pagină cu element :

Accesați pagini> Adăugați nou dacă începeți proaspăt sau editați o pagină existentă sau adăugați un glisor la orice pagină, după cum este necesar.

Faceți clic pe Editați cu Elementar pentru a lansa Elementar Page Builder.

Pasul 3: Adăugați widgetul de comparație a imaginilor

În editorul Elementar, căutați widget -uri elementare addon în bara laterală sau căutați compararea imaginilor în panoul widget.

Trageți și aruncați widgetul de comparare a imaginilor oriunde pe pagină.

Pasul 4: Încărcați -vă imaginile

Aici, puteți vedea widgetul de comparare a imaginilor nou adăugat în imaginea de mai jos.

Utilizați bara laterală din stânga pentru a edita secțiunea Imagini Compare adăugând imagini în secțiunea Image.

Am inclus imagini de probă pentru referința dvs.

Pasul 5: Personalizați glisorul

Puteți edita și personaliza setările folosind bara laterală din stânga.

Puteți modifica și personaliza setările folosind meniul din partea stângă.

Pasul 6: Publicați pagina

După ce sunteți mulțumit de setările dvs., faceți clic pe Publish pentru a vă face glisorul de comparație a imaginilor în direct.

Când sunteți mulțumit de ajustările dvs., faceți clic pe „Publicați” pentru a face vizibilul de comparație de imagine vizibil pentru alții.

Puteți vizualiza pagina făcând clic pe pagina „Vizualizare”.

Puteți vizualiza glisorul de comparare a imaginilor live de partea dvs.

SHOP MANIA TEMA WOOCOMMERCE

Căutați o temă frumoasă, plină de caracteristici, pentru a vă îmbunătăți magazinul WooCommerce?

Vă recomandăm cu mare drag tema magazinului Mania pentru o experiență de cumpărături perfectă și atrăgătoare vizual.

Designul său elegant, opțiunile ușoare de personalizare și compatibilitatea WooCommerce fac din Shop Mania o alegere excelentă pentru magazinele care vizează îmbunătățirea satisfacției clienților și stimularea conversiilor. Puteți verifica aici.

Caracteristici ale magazinului Shop:

• Site-uri gata de import: Importați cu ușurință site-uri demo și personalizați-le pentru a se potrivi nevoilor magazinului dvs.
• Șabloane de coș de produs multiple: Alegeți dintre cinci șabloane de coș de înaltă calitate pentru a se potrivi cu designul magazinului dvs.
• Vizualizare rapidă: Permiteți utilizatorilor să previzualizeze detaliile produsului fără a părăsi pagina curentă.
• Bara laterală off-Canvas: Afișați produse și widget-uri suplimentare, fără a înghesui pagina principală.
• Căruță plutitoare: Îmbunătățiți experiența utilizatorului cu un coș de cumpărături plutitor convenabil.
• Efecte de hover a produsului: Include efecte zoom, decolorare, swap de imagini și diapozitive pentru afișările interactive ale produsului.
• Stiluri de antet mobil: modele de antet optimizate adaptate pentru o experiență mobilă perfectă.
• Aspecte personalizabile cu un singur produs: machete de galerie flexibile, inclusiv opțiuni de grilă și glisare.
• Stiluri avansate de checkout și coș: pagini de checkout personalizate și coșuri pentru o experiență lină, fără distragere.