Vă prezentăm Elementor 3.13 – Construiți layout-uri de site flexibile și flexibile cu CSS Grid

Publicat: 2023-05-17

Îmbunătățiți-vă capacitățile de design și bucurați-vă de noi modalități de a vă stila site-ul web cu Elementor 3.13, astfel încât să puteți realiza modele unice care mențin vizitatorii site-ului dvs. interesați. Această versiune include o nouă opțiune de aspect în Containers – CSS Grid, o modalitate excelentă de a proiecta machete de site web sofisticate și ușoare, menținând în același timp un nivel ridicat de consistență. În plus, această actualizare introduce mai multe opțiuni de stil în widgetul Meniu și adaugă noi capabilități noii bare de sus.

Nou – Container CSS Grid – Proiectați layout-uri ușoare, receptive și profesionale

Acum, când adăugați un Container, puteți alege între Flexbox sau Grid Containers. Utilizarea Containerelor Grid este ideală pentru machete asemănătoare grilei, vă ajută să mențineți alinierea elementelor din Container și reduce curba de învățare asociată cu tranziția de la aspectul secțiune-coloană la aspectul containerului.

Cu Grid Containers, puteți alege numărul de rânduri și coloane pe care doriți să vă compuneți grila, să determinați distanța dintre coloanele și rândurile dvs. utilizând controlul Gaps și să alegeți dacă doriți ca Auto-Flow să funcționeze în funcție de coloană sau rând. Puteți, de asemenea, să justificați și să aliniați conținutul și articolele, la fel cum ați face un container Flexbox.

Fiecare celulă din Grid poate accepta un element, care poate fi stilat și editat așa cum ați face-o în mod normal. Pentru a obține un nivel mai ridicat de sofisticare, puteți plasa un container Flexbox în interiorul celulei unei Grile și puteți plasa câte elemente doriți, în containerul Flexbox.

Pentru a utiliza Container Grid, asigurați-vă că activați funcțiile Flexbox Container și Grid Container din WordPress Dashboard → Elementor → Settings → Features.

[Pro] Capabilități noi de stil în widgetul Meniu

În versiunea anterioară, Elementor a introdus un nou widget Meniu, care vă permite să creați meniuri simple, cu un singur nivel și meniuri de conținut derulante sofisticate, cu conținut imbricabil. Acest widget este un schimbător de jocuri pentru crearea site-urilor web, dându-vă puterea să creați meniuri frumoase și funcționale pentru site-urile dvs. web.

Elementor Pro 3.13 introduce două noi capabilități care sunt acum disponibile în widget-ul Meniu:

  • Pictograme la nivelul superior al meniului – această nouă capacitate de stil vă permite să îmbunătățiți designul meniurilor prin adăugarea de pictograme atrăgătoare care atrag atenția vizitatorilor. Cu o varietate de pictograme din care să alegeți în biblioteca de pictograme sau cu posibilitatea de a încărca orice SVG, vă puteți personaliza meniurile pentru a se potrivi cu stilul site-ului dvs. și a le face să iasă în evidență.

Stare activă pentru link-urile de ancorare – indicați vizitatorilor site-ului ce parte a paginii au derulat sau pe care au făcut clic atunci când meniul dvs. include link-uri de ancorare. În acest fel, puteți îmbunătăți experiența vizitatorilor, ajutându-i să-i navigați prin site-ul dvs. web.

Îmbunătățiri ale barei de sus – Renovarea interfeței de utilizare a Elementor a continuat

În Elementor 3.12, am început lansarea treptată a modificărilor viitoare ale interfeței Elementor. Aceste modificări sunt scrise în React, care îmbunătățește performanța și permite creșterea și scalarea viitoare a produselor. În plus, aceste modificări promovează cele mai bune practici Elementor, rezultând o experiență mai bună și mai eficientă a utilizatorului.

Una dintre cele mai mari modificări este noul Top Bar, introdus ca un experiment pe care îl puteți activa din pagina de caracteristici Elementor din WordPress (Elementor → Setări → Funcții → Editor Top Bar). În această versiune, Top Bar include două actualizări:

  1. Opțiuni de salvare în butonul de publicare – deși nu este o capacitate nouă, această funcție nu era disponibilă în prima versiune a barei de sus. Acum, aveți acces la toate opțiunile de salvare disponibile în Editor - Salvare ca schiță, Salvare ca șablon și Condiții de afișare (dacă este cazul). Aceasta înseamnă, de asemenea, că Bara de sus include acum toate capabilitățile disponibile anterior în interfața de utilizare moștenită a Editorului.
  2. Navigare în pagină – o nouă caracteristică care vă va simplifica fluxul de lucru și va face tranziția între diferite pagini și părți tematice mai ușoară. Făcând clic pe indicația paginii din centrul barei de sus, se va deschide un meniu derulant care include cele mai recente cinci pagini/postări/părți tematice la care ați lucrat și vă permite să redirecționați către oricare dintre ele cu un singur clic, fără a fi nevoie să navigați înapoi la tabloul de bord WordPress.

[Pro] Populați în mod dinamic fragmentul postării dvs., cu conținutul postării dvs

Anterior, folosirea widget-ului Post Excerpt sau a etichetei dinamice în WordPress însemna că conținutul se popula automat din Extrasul personalizat pe care l-ați inserat manual, în WordPress. Cu toate acestea, cu Elementor 3.13, acum aveți opțiunea de a alege dacă doriți ca conținutul să se completeze automat din primele caractere ale postării dvs. sau din Extrasul personalizat din WordPress. Această actualizare rezolvă una dintre cele mai importante solicitări de la introducerea Loop Builder și mai ales de la posibilitatea de a adăuga widgetul Post Extras în elementul buclei.

Nou: folosiți AI Elementor, perfect adaptat pentru Elementor

Elementor 3.13 include, de asemenea, Elementor AI, care este integrat nativ în Editor și va transforma modul în care creați site-uri web. Această versiune introduce prima fază a Elementor AI, care vă permite să creați text și cod cu puterea AI. Îl puteți folosi pentru a crea conținut de la zero, pentru a îmbunătăți conținutul existent pe site-ul dvs. web, pentru a-l traduce pe orice site web și multe altele. În plus, puteți utiliza Elementor AI pentru a scrie cod pentru CSS personalizat sau cod personalizat (necesită Elementor Pro sau Hosting) sau fragmente HTML. Puteți citi mai multe despre ce puteți face cu Elementor AI aici.

Imbunatatiri ale performantei

În versiunile anterioare, îmbunătățirile de performanță s-au concentrat pe cele mai comune widget-uri de pe paginile principale. Cu Elementor 3.13, accentul a fost mutat pe widget-urile utilizate în principal pe paginile interioare, unde vizitatorii site-ului își petrec adesea cea mai mare parte a timpului.

Widgeturile Caseta autorului, Informații postați și Lista de prețuri afișează imagini și imagini de profil de utilizator, aceste imagini au acum o încărcare leneșă aplicată. Această modificare ar trebui să îmbunătățească încărcarea inițială a paginilor dvs. interioare.

În plus, deoarece antetul apare deasupra pliului, ar trebui să se încarce întotdeauna imediat după încărcarea paginii. Prin urmare, încărcarea leneră a fost eliminată din anteturi pentru a îmbunătăți experiența vizitatorilor atunci când se folosește experimentul Imagini de fundal cu încărcare leneră.

Îmbunătățiri ale accesibilității

Elementor 3.13 este plin de modificări și remedieri care îmbunătățesc accesibilitatea site-ului dvs. web, precum și Editorul. În această versiune, ne-am concentrat pe navigarea cu tastatură, implementarea etichetelor ARIA suplimentare, remedierea problemelor existente de conformitate cu ARIA și aplicarea de marcare semantică.

Puteți citi mai multe despre aceste îmbunătățiri ale accesibilității în Blogul dezvoltatorilor.

Bucurați-vă de mai multe opțiuni de stil și design pentru experiențe de site-uri web cu o marcă deosebită și captivante

Creșteți designul site-ului dvs. și deblocați noi posibilități de stil pentru personalizarea site-ului dvs. folosind Elementor 3.13. Cu CSS Grid Containers puteți crea fără probleme machete ușoare, flexibile, asemănătoare grilei, iar cu noile capacități de stil din widget-ul meniului puteți crea design-uri distinctive care captivează și mențin vizitatorii site-ului dvs. interesați.

Această versiune include și noi capabilități în caracteristica Top Bar, ceea ce înseamnă că toate capabilitățile disponibile anterior în Editor sunt acum disponibile atunci când utilizați experimentul Top Bar.

Elementor 3.13 include, de asemenea, o versiune de încercare gratuită a Elementor AI, care va transforma modul în care creați site-uri web, dându-vă puterea să creați instantaneu text original, să îmbunătățiți textul existent și să codați pentru a vă îmbunătăți site-ul și designul acestuia.

Încercați noile funcții din Elementor 3.13 și spuneți-ne ce părere aveți despre ele în comentariile de mai jos.