Vă întrebați cum să construiți machete mai rapide în Beaver Builder? Dacă ați construit cu WordPress de ceva vreme, probabil că ați petrecut mult timp pentru a afla cum să structurați machete complexe folosind rânduri și coloane. Este funcționat - dar nu a fost întotdeauna cea mai flexibilă sau eficientă abordare.

De aceea, Beaver Builder 2.9 a fost un astfel de schimbător de jocuri pentru mine. Această actualizare a introdus două îmbunătățiri majore care au transformat complet modul în care construiesc pagini și cred că îți va plăcea flexibilitatea pe care o aduce fluxului tău de lucru:

• Modulele de containere , cum ar fi modulul cutiei și modulul buclă, pot fi acum utilizate ca elemente de aspect de nivel superior -ceea ce înseamnă că puteți săriți rândurile și coloanele în totalitate atunci când nu sunt necesare.
• Modulele de bază acum ieșesc curate HTML în mod implicit , eliminând un înveliș suplimentar <div> s și făcând paginile dvs. să se încarce mai rapid și să se clasifice mai bine în motoarele de căutare.

Acestea nu sunt doar caracteristici frumoase de have-reprezintă o schimbare către un mod mai intuitiv, bazat pe performanță, de a construi site-uri WordPress. Dacă doriți să vă îmbunătățiți fluxul de lucru, viteza paginii și calitatea codului, această actualizare merită să explorați absolut.

Containerele iau rolul central

Să vorbim mai întâi despre cea mai mare schimbare. În versiunile anterioare ale Beaver Builder, sistemul rând și coloană a fost singura dvs. opțiune pentru structurarea machetei. Fiecare element din pagina dvs. a trebuit să trăiască în acest cadru.

Imaginează-ți acest scenariu comun: doriți să creați o secțiune simplă de apel la acțiune, cu o titlu, un text și un buton. În vechea abordare, ați crea un rând, adăugați o coloană la acel rând, apoi adăugați modulele în interiorul coloanei. A funcționat, dar a adăugat straturi de structură de care nu aveți nevoie cu adevărat.

Iată cum arăta asta:

Rând
└─ interpreți coloana
Modul cu cutie
Modul de rubrică
Modul de text
Modulul butonului

Acum, în Beaver Builder 2.9, puteți elimina în întregime aceste straturi suplimentare. Modulele de containere precum modulul casetei pot servi acum ca elemente principale de aspect, așezate chiar la nivelul superior al structurii paginii.

Noua abordare simplificată arată astfel:

Modul de cutie
Modul de rubrică
Modul de text
Modulul butonului

Nu este vorba doar de a avea mai puține clicuri în interfață (deși și asta este frumos). Este vorba despre construirea unor machete care se potrivesc cu modul în care te gândești de fapt la design. Dacă sunteți ca mine, când aveți în vedere o secțiune de conținut, vă gândiți la container și la ce se întâmplă în el - nu despre grila de rând și coloană abstractă care se înfășoară în jurul său.

De ce această abordare are sens

Această schimbare se aliniază perfect cu modul în care funcționează CSS modern, în special cu FlexBox și CSS Grid. Aceste tehnologii vă permit să creați machete sofisticate fără a avea nevoie de structuri complexe cuibărit, iar acum interfața Beaver Builder se potrivește cu această realitate.

Beneficiile depășesc doar simplitatea. Când utilizați module de containere ca elemente principale de aspect, obțineți:

• Control mai direct asupra distanției, alinierii și comportamentului receptiv. În loc să gestionați setările pe mai multe niveluri de cuibărit, puteți gestiona totul la nivelul containerului.
• Iterații de proiectare mai rapide , deoarece petreci mai puțin timp navigând prin straturi de structură și mai mult timp concentrându -te pe designul propriu -zis.
• O performanță mai bună, deoarece există mai puține marcaje HTML generate și procesate de către browser.
• Întreținere mai ușoară atunci când trebuie să vă întoarceți și să modificați machete mai târziu - fie că sunteți tu sau altcineva din echipa dvs.

Modulul Cutie: Powerhouse -ul dvs. de aspect

Modulul Box a obținut un upgrade care schimbă jocul. Ceea ce a fost odată un instrument de utilitate simplu a evoluat în fundația de bază pentru construirea unor machete moderne flexibile și moderne în Beaver Builder. Aceasta nu este o actualizare minoră-este o reproiectare completă care poziționează modulul casetei din centrul procesului de construire a paginilor:

Cu noua sa abilitate de a funcționa ca un element de dispunere de nivel superior, modulul Box poate înlocui ambalajele tradiționale de rânduri, gestionând totul, de la culori de fundal și imagini până la căptușeală și marje-fără a avea nevoie de un container pentru părinți suplimentari.

În plus, modulul Box acceptă complet proprietățile FlexBox , oferindu -vă un control precis asupra alinierii, distanțarea și distribuției elementelor copilului în aspectul dvs. Indiferent dacă doriți să cuibăresc text, imagini, butoane, formulare sau orice alt modul de conținut, modulul de casetă îl gestionează perfect.

Acest lucru înseamnă că puteți crea machete complexe, receptive, folosind doar modulul de casetă și modulele de conținut de care aveți nevoie de fapt. Nu mai creează elemente structurale doar pentru că interfața a necesitat -o.

Mai curat html sub capotă

În timp ce vă regândiți modul în care structurați machete în Beaver Builder 2.9, constructorul în sine face o curățare în culise. A doua actualizare majoră din această versiune elimină elementele de înveliș inutile <div> din modulele de bază - rezultând o ieșire HTML semnificativ mai slabă.

În versiunile anterioare, modulele precum titlurile, imaginile și butoanele au inclus <div> s în jurul conținutului real. Care a adăugat complexitate și bloat la marcaj, așa cum se arată în următorul exemplu:

Înainte de Beaver Builder 2.9:

 <div class="fl-module fl-module-heading"> <div class="fl-module-content"> <h2>Welcome to Our Site</h2> </div> </div>

După Beaver Builder 2.9:

 <h2>Welcome to Our Site</h2>

Această modificare oferă mai mult decât un cod mai curat-îmbunătățește performanța din lumea reală:

• Stiluri simplificate: cu mai puține clase de înveliș, puteți scrie CSS mai direct - nu mai sunt mai mulți selectori cuibăriți.
• Timpuri de încărcare mai rapide: mai puține elemente înseamnă mai puțin pentru procesarea browserului.
• SEO mai bun: HTML mai curat, mai semantic ajută motoarele de căutare să vă înțeleagă conținutul.

Dacă sunteți un dezvoltator sau o agenție care lucrează pe teme personalizate sau site -uri client, veți aprecia claritatea și eficiența pe care o aduce această actualizare. Și deoarece modificarea se aplică numai modulelor adăugate după 2.9 (sau dacă nu activați setarea moștenirii), machete existente rămân sigure și compatibile.

Flexibilitate fără a rupe lucrurile

Acum, dacă vă gândiți: „Așteptați - CSS -ul meu personalizat se bazează pe acele clase de înveliș!” -nu vă faceți griji. Beaver Builder 2.9 a fost proiectat cu asta în minte. Pentru a păstra compatibilitatea cu stilul mai vechi, puteți reîncadra ambalajul <div> s cu o singură setare:

Cum să restabiliți marcajul de înveliș moștenire:

1. Mergeți la tabloul dvs. de bord WordPress
2. Navigați la Setări> Beaver Builder> Advanced
3. Activați „Force Module Wrapper Divs”

Cu toate acestea, vă recomandăm să mențineți această caracteristică, cu excepția cazului în care este absolut necesar. Marcarea mai curată nu numai că îmbunătățește performanța, dar reflectă și cele mai bune practici moderne pentru dezvoltarea web. Dacă vă bazați pe CSS moștenitor, aceasta poate fi o oportunitate excelentă de refactare pentru simplitate și întreținere pe termen lung.

Compatibilitatea înapoi încorporată

Una dintre cele mai bune părți ale Beaver Builder 2.9? Obțineți toate aceste îmbunătățiri moderne, fără riscul de a vă rupe site -urile existente.

Iată cum funcționează:

• Modulele existente (cele plasate înainte de actualizare la 2.9) vor continua să se redea cu structura lor originală de înveliș.
• Noile module adăugate după actualizare vor utiliza automat noua marcare a curățării în mod implicit.

Această strategie duală de redare vă oferă o cale de tranziție lină: machetele dvs. curente rămân intacte, în timp ce orice conținut nou pe care îl construiți beneficii de structura mai rapidă și mai ușoară.

Modul în care aceste modificări îmbunătățesc performanța site -ului dvs.

Beaver Builder 2.9 a introdus performanțe puternice și îmbunătățiri ale fluxului de lucru care vă ajută site -urile să se încarce mai repede, să se clasifice mai sus și să ofere o experiență de utilizator mai ușoară.

Pagini mai rapide, mai slabe
Cu un înveliș redus <div> și suport pentru modulele de containere ca elemente de nivel superior, machetele dvs. sunt mai curate și mai ușoare-transmise la timp de încărcare mai rapid și SEO mai bun.

Pagini de destinație mai inteligente
Săriți dezordinea rândurilor și coloanelor inutile. Acum puteți construi pagini de destinație flexibile, cu conversie ridicată, folosind doar module de containere, cum ar fi modulul Box pentru secțiuni Hero și CTA.

Anteturi și subsoluri mai curate
Modulul Box strălucește, de asemenea, în anteturi și subsoluri, ajutându -vă să creați machete structurate, receptive, cu mai puțin efort și mai mult control.

Marcaj prietenos pentru dezvoltatori
Spune la revedere cu cuibărea excesivă. Ieșirea HTML simplificată simplifică direcționarea CSS și reduce problemele de specificitate, ceea ce face dezvoltarea personalizată mai ușoară și mai întreținută.

Performanță câștigătoare a clientului
Pentru agenții, beneficiile sunt clare: site -uri mai rapide, cod mai curat și un proces de construire mai modern. Chiar dacă clienții dvs. nu vorbesc „dev”, vor observa diferența de performanță și poloneză.

Un mod mai inteligent de a construi machete

Beaver Builder 2.9 nu este doar o altă actualizare a caracteristicilor - este un pas atent înainte în modul în care abordăm clădirea aspectului. Prin introducerea modulelor de containere ca fundații flexibile de aspect și eficientizarea ieșirii HTML, această versiune aduce Beaver Builder în conformitate cu practicile moderne de proiectare și dezvoltare.

Rezultatul? Un flux de lucru mai rapid, mai curat, mai intuitiv, care vă economisește timp și oferă pagini mai performante. Indiferent dacă elaborezi un site de broșură simplu sau gestionezi un proiect de client complex, aceste îmbunătățiri vă ajută să construiți cu o mai mare ușurință - și încredere.

Sunteți gata să vă nivelați machetele?
Actualizați la Beaver Builder 2.9 și începeți să construiți astăzi site-uri mai inteligente, mai slabe și mai multe pentru viitor.