Doriți să afișați conținut dinamic, cum ar fi postări de blog, produse sau tipuri de postări personalizate în machete complet personalizate - fără a atinge o linie de cod? Modulul de buclă din Beaver Builder îl face posibilă.

Introdus în Beaver Themer 1.5 și Beaver Builder 2.9, modulul Loop este un instrument puternic care vă permite să proiectați machete repetabile folosind module standard Beaver Builder. Indiferent dacă construiți un blog, un portofoliu, o listă de evenimente sau un magazin WooCommerce, acest modul vă oferă un control complet al proiectării cu conținut dinamic din centrul său.

În acest ghid, vom descompune modul de utilizare a modulului buclă pentru a construi machete moderne, dinamice, care îmbunătățesc designul, performanța și flexibilitatea site -ului dvs.

Care este modulul buclă?

Modulul buclă este un recipient flexibil care se bucură prin conținut interogat și îl afișează folosind un aspect pe care îl creați. În loc să vă bazați pe șabloane WordPress implicite, vă puteți construi propriile modele personalizate - completați cu module, conexiuni de câmp și logică condiționată.

Modulul buclă nu se limitează la postări de blog sau tipuri de postări personalizate - poate gestiona o gamă largă de conținut dinamic. Iată câteva moduri puternice prin care îl puteți utiliza pentru a crea machete personalizate și a îmbunătăți site -ul dvs.:

• Categorii sau etichete WooCommerce - afișează categorii de produse sau etichete conexe pe paginile de produse individuale folosind sursa de interogare Taxonomies.
• Grila de conținut personalizat - Afișați conținut dinamic precum membrii echipei sau mărturii folosind sursa de interogare a repetorului ACF pe pagini precum „Meet the Team” sau Listele de servicii.
• Postări înrudite - Prezentați conținut relevant al blogului pe paginile unice cu sursa de interogare a relației ACF, contribuind la stimularea implicării și la reducerea ratelor de respingere.

Fiecare articol din buclă folosește designul personalizat și trage date dinamice, cum ar fi titlul postului, imagine prezentată, extras și multe altele.

Caracteristici cheie ale modulului buclă

Modulul buclă este ambalat cu capacități care îl fac ideal pentru construirea de pagini flexibile, bogate în conținut:

• Conținut de interogare dinamic de la orice tip de post (standard sau personalizat)
• Utilizați orice modul Beaver Builder în aspectul buclei
• Connect Fields dinamic (de exemplu, titlu, imagine prezentată, post meta)
• Alegeți dintre mai multe tipuri de aspect, cum ar fi grila, lista sau caruselul
• Adăugați filtre și paginare pentru a îmbunătăți experiența utilizatorului

Această combinație de personalizare și automatizare vă permite să creați machete avansate fără a scrie HTML, PHP sau CSS.

Cum se construiește o buclă personalizată

Crearea unui aspect de conținut personalizat cu modulul buclă este simplă, flexibilă și nu necesită cod. Indiferent dacă doriți să începeți cu un aspect pregătit sau să vă construiți propriul dvs. de la zero, modulul buclă vă oferă un control complet asupra modului în care este afișat conținutul dvs. dinamic.

Opțiuni de aspect presetat cu modul de buclă

Când trageți mai întâi modulul buclă pe pagina dvs., vi se va solicita să alegeți dintre următoarele machete prestabilite: Listă, coloane, categorii și categorii de produse.

Aspectele prestabilite vă oferă un început prin oferirea de module pre-aranjate pe care le puteți personaliza pe deplin. Reglați setările de buclă pentru a se potrivi nevoilor dvs., rearanjați sau îndepărtați modulele existente și adăugați altele noi pentru a regla aspectul. Aceste modele gata de pregătire vă ajută să creați mai repede conținut lustruit și sensibil.

Construiți de la zero cu un aspect gol

Preferă să creezi ceva total personalizat? Alegeți opțiunea de aspect gol și urmați acești pași:

1. Adăugați modulul buclă la pagina dvs. sau postați în editorul Beaver Builder.
   
2. Selectați aspectul gol pentru a începe cu un recipient cu buclă goală.
   
3. Configurați setările de buclă pentru a defini ce conținut doriți să afișați - cum ar fi postări de blog, produse WooCommerce, câmpuri de repetor ACF sau tipuri de posturi personalizate.
   
4. Trageți modulele în containerul buclă pentru a vă construi aspectul de la zero. Adăugați orice module de constructor de castor de care aveți nevoie, cum ar fi titluri, fotografii, pictograme, butoane și multe altele.
   
5. Utilizați conexiuni de câmp pentru a trage conținut dinamic, cum ar fi titluri, imagini, prețuri sau câmpuri personalizate pentru fiecare element de buclă.
   
6. Aranjați-vă și stilați- vă modulele folosind instrumentele de tracțiune și drop Beaver Builder.

Această configurație funcționează excelent pentru utilizatorii sau designerii avansați care doresc un control total.
Folosiți -l pentru a construi machete de blog personalizate, rețele de produse sau directoare de echipă - nu este necesar.

Utilizați modulul de casetă pentru controlul aspectului

Modulul Box este un însoțitor esențial al modulului Buclă atunci când vine vorba de precizia aspectului și flexibilitatea stilului.

• Înfășurați modulul de buclă în interiorul unui modul de cutie pentru a gestiona lățimea, căptușeala, marja și stilul de fundal al containerului exterior. Acest lucru vă oferă un control complet asupra modului în care conținutul dvs. buclat se află în aspectul general al paginii.
• Cuibărește un modul de cutie în interiorul buclei pentru a grupa conținutul interior al fiecărui element de buclă. Această configurație vă permite să profitați de tehnici avansate de dispunere, cum ar fi grila CSS sau FlexBox . De exemplu, puteți crea un aspect cu două coloane în fiecare element de buclă. Puneți o imagine în stânga și text în dreapta - cu un control complet asupra distanției și alinierii.

Utilizarea modulului de casetă ajută strategic menținerea proiectelor curate și receptive, în timp ce îmbunătățiți structura vizuală a conținutului dvs. dinamic.

Setări de interogare: Ce conținut va fi afișat?

Fila Conținut din modulul buclă vă permite să controlați modul în care conținutul buclei este interogat și afișat, cum ar fi:

• Alegeți tipul de post (postări, pagini, CPT, produse etc.)
• Filtru după taxonomie, categorie, etichete sau autor
• Afișați conținut pe baza stării sau datei postului
• Setați compensări, sortați comanda și postați limitele

Aceasta include sursa de interogare, numărul de articole de afișat, comandă și opțiuni de filtrare avansate.

Paginare

Fila Pagination vă permite să controlați modul în care conținutul este împărțit și afișat pe mai multe pagini - lider pentru îmbunătățirea navigației și a experienței utilizatorilor.

• Numere : afișează link -uri numerotate sub postările tale. Făcând clic pe un număr încarcă o nouă pagină cu setul de postări corespunzător.
• Derulare : încarcă automat postări suplimentare pe măsură ce utilizatorul defilează, păstrând conținut pe o singură pagină.
• Niciuna : dezactivează paginarea. Utilizați această opțiune pentru a afișa un număr limitat de postări - cum ar fi cele mai recente trei - fără controale de navigare.
• Postări pe pagină : Setează câte articole apar pe pagină. Valoarea implicită este 10.

Aceste opțiuni ajută la adaptarea conținutului la aspectul dvs. și la obiectivele de interacțiune a utilizatorilor.

Date dinamice cu conexiuni de câmp

În aspectul buclei dvs., puteți utiliza conexiuni de câmp pentru a trage dinamic datele post, cum ar fi:

• Titlul postului
• Imagine prezentată
• Extras sau conținut complet
• Câmpuri personalizate
• Autor, dată, categorie, etichete

Orice modul care acceptă conținut dinamic (cum ar fi titlul, fotografia, butonul, HTML etc.) poate fi conectat la datele post.

Stil avansat și logică condiționată

Doriți să stila diferite tipuri de post în mod diferit sau să afișați/să ascundeți elemente pe baza condițiilor? Modulul Loop acceptă logică condiționată și clase CSS personalizate .

De exemplu, ai putea:

• Ascunde butoanele dacă un câmp personalizat este gol
• Adăugați ecusoane pentru postări prezentate
• Aplicați diferite culori sau stiluri pe baza categoriei de post

Acest lucru vă permite să reglați experiența utilizatorului și să mențineți o marcă constantă în conținutul dvs.

Cazuri de utilizare a modulului de buclă din lumea reală

Modulul de buclă din Beaver Builder este incredibil de versatil, permițându -vă să afișați conținut dinamic în machete care se potrivesc cu nevoile dvs. de proiectare. Iată câteva modalități puternice de a -l folosi:

• Blog Archives: Creați o grilă de implicare vizuală sau o listă cu ultimele dvs. postări pe blog cu imagini și extrase prezentate.
• Produse WooCommerce: Showcase WooCommerce Products într-o grilă personalizabilă, cu prețuri dinamice, imagini și butoane adăugate în cartier.
• Portofoliu Showcase: evidențiați -vă proiectele sau studiile de caz cu machete flexibile care reflectă stilul dvs. de marcă.
• Mărturii: afișează mărturii clientului dintr -un tip de post personalizat și stil -le pentru a se potrivi cu designul site -ului tău.
• Listele de evenimente: enumerați cronologic evenimente viitoare sau webinarii, cu date, locații și descrieri de evenimente.
• Membrii echipei: introduceți -vă echipa cu fotografii, nume, titluri și BIO -uri - faceți -vă fiecare articol pe o pagină de profil detaliată.
• Listele imobiliare: Prezentați listări imobiliare cu imagini de proprietate, prețuri și detalii cheie folosind un tip de post personalizat.
• Catalog de curs: Afișați un catalog de cursuri sau ateliere online, completat cu titluri, descrieri și link -uri de înscriere.
• Listele de locuri de muncă: Construiți o placă de lucru personalizată cu listări dinamice care includ titluri, locații și rezumate de roluri scurte.
• Index de rețete: prezintă o colecție de rețete cu imagini, titluri și descrieri - lider pentru bloggerii alimentari.

Aceste cazuri de utilizare demonstrează versatilitatea modulului de buclă în Beaver Builder. Poate fi utilizat în diverse industrii și site -uri web, ajutându -vă să creați machete dinamice, antrenante și personalizate.

Gânduri finale: De ce să folosiți modulul Loop?

Modulul buclă din Beaver Builder vă oferă puterea de a crea machete dinamice complet personalizate, cu ușurință. Indiferent dacă construiți un blog, un magazin sau un director de conținut complex, acest modul vă permite să controlați modul în care sunt afișate datele dvs.-păstrând în timp ce fluxul de lucru vizual și fără cod.

Dacă sunteți serios în ceea ce privește construirea de site-uri WordPress moderne, personalizate, cu Beaver Builder, modulul Loop este un must-have în setul de instrumente. Explorați aici documentația modulului Buclă completă.