Cum să oferiți paginilor dvs. de arhivă Divi un aspect de zidărie

Pentru a oferi paginilor dvs. de arhivă un aspect personalizat pentru zidărie, putem folosi constructorul de teme Divi pentru a proiecta un șablon de pagină de arhivă dinamică personalizat. În Divi, înainte de zilele Divi Theme Builder, dezvoltatorii trebuiau să se bazeze pe personalizarea manuală a codului PHP într-un fișier tematic de șablon de pagină de arhivare și apoi pe stilizarea șablonului de pagină doar cu CSS extern. Acest lucru a făcut mult mai dificilă crearea unui aspect de zidărie. Dar acum, cu Divi Theme Builder, acest proces a devenit ușor și plăcut!

În acest tutorial, vă vom arăta cum să creați un șablon de pagină de arhivă care afișează dinamic titlul paginii de arhivă, subtitrarea și postările de pe blog. Și, folosind modulul de postare pe blog, putem afișa cu ușurință arhiva noastră de postări într-un aspect de grilă de zidărie.

Să începem!

Trage cu ochiul

Iată o privire rapidă asupra șablonului de pagină de arhivă pe care îl vom proiecta împreună în acest tutorial. În această imagine, este utilizată pentru a afișa toate postările din categoria „WordPress”.

Descărcați GRATUIT șablonul de pagină Arhivă

Pentru a pune mâna pe șablonul din acest tutorial, va trebui mai întâi să îl descărcați folosind butonul de mai jos. Pentru a avea acces la descărcare, va trebui să vă abonați la lista noastră de e-mail Divi Daily folosind formularul de mai jos. Ca nou abonat, veți primi și mai multe bunătăți Divi și un pachet Divi Layout gratuit în fiecare luni! Dacă sunteți deja pe listă, pur și simplu introduceți adresa de e-mail mai jos și faceți clic pe descărcare. Nu veți fi „resubscris” și nu veți primi e-mailuri suplimentare.

Descărcați fișierele

Descarcă gratis

Înscrieți-vă la buletinul informativ Divi și vă vom trimite prin e-mail o copie a pachetului final de planificare a paginii de destinație Divi, plus o mulțime de alte resurse, sfaturi și trucuri uimitoare și gratuite Divi. Urmăriți-vă și veți fi un maestru Divi în cel mai scurt timp. Dacă sunteți deja abonat, pur și simplu introduceți adresa de e-mail de mai jos și faceți clic pe descărcare pentru a accesa pachetul de aspect.

DESCARCA

V-ați abonat cu succes. Vă rugăm să verificați adresa de e-mail pentru a vă confirma abonamentul și pentru a obține acces la pachetele de layout Divi săptămânale gratuite!

Pentru a importa aspectul șablonului pe site-ul dvs. web, va trebui să accesați Divi Theme Builder și să utilizați opțiunea de portabilitate pentru a importa fișierul .json în generatorul de teme.

Să trecem la tutorial, nu-i așa?

Ce trebuie să începeți

Pentru a începe, va trebui să faceți următoarele:

1. Dacă nu ați făcut-o încă, instalați și activați tema Divi instalată (sau pluginul Divi Builder dacă nu utilizați tema Divi).
2. Deoarece vom crea un șablon de pagină de arhivare, va trebui să aveți câteva postări pe blog deja create pe site-ul dvs. web cu autori, categorii și / sau etichete atribuite lor, dacă doriți să vedeți rezultatele.

După aceea, sunteți gata să plecați.

Înțelegerea modulelor și a conținutului dinamic disponibil pentru șabloanele de pagină de arhivă

Atunci când creați un șablon de pagină de arhivă pentru un site Divi, este important să înțelegeți ce instrumente vă stau la dispoziție, astfel încât să puteți construi în mod eficient un șablon care să afișeze dinamic informațiile corecte. Pentru un șablon de pagină de arhivă, ne interesează cel mai mult să afișăm postările paginii curente ori de câte ori un utilizator vizitează o pagină de arhivă. De exemplu, dacă un utilizator face clic pe linkul de categorie „Afaceri”, acesta ar trebui să vadă o pagină de arhivă care afișează toate postările cu categoria „Afaceri”. Unele module Divi au opțiuni încorporate pentru a simplifica afișarea conținutului dinamic pe un șablon.

Modulul Blog

Modulul Blog este modulul principal care ar trebui utilizat pentru a afișa șabloanele de pagină Arhivă. Acest lucru se datorează faptului că are opțiunea încorporată pentru a afișa Postări pentru pagina curentă.

Aceasta îi spune practic Divi să afișeze postările care sunt generate în mod normal ori de câte ori un utilizator vizitează pagina. Deci, cu opțiunea setată pentru a afișa „Postări pentru pagina curentă”, utilizatorul va putea vizualiza o pagină de arhivă și va afișa corect postările pentru acea pagină curentă.

Titlu postare / arhivă (conținut dinamic)

O modalitate mai ușoară de a afișa Titlul paginii Post / Arhivă este să folosiți un modul Divi obișnuit și apoi să introduceți Titlul paginii Post / Arhivare utilizând funcția de conținut dinamic disponibilă în toate modulele Divi.

De exemplu, puteți utiliza un modul text și apoi puteți adăuga titlul paginii de postare / arhivare ca conținut dinamic la conținutul corpului. Apoi, puteți stiliza titlul oricum doriți.

Acum că înțelegeți instrumentele necesare pentru a crea un șablon de pagină de arhivă, să săriți și să creăm unul împreună.

Cum se creează un șablon de pagină Divi Archive cu un aspect de zidărie

Pentru a crea un șablon de pagină de arhivă cu un aspect de zidărie, tot ce trebuie să faceți este să proiectați un șablon nou pentru toate paginile de arhivă utilizând generatorul de teme.

Crearea și atribuirea unui șablon personalizat pentru toate paginile de arhivă

Pentru a începe, accesați tabloul de bord WordPress și navigați la Divi> Theme Builder. Apoi faceți clic pe zona goală a casetei gri pentru a adăuga un șablon nou.

Apoi, atribuiți șablonul Toate paginile de arhivă.

Adăugarea unei noi zone de corp personalizate la șablon

Pentru a construi corpul personalizat pentru șablon, faceți clic pe zona Adăugați corp personalizat și apoi selectați „Construiți corp personalizat”.

Apoi alegeți opțiunea „Build From Scratch”.

Adăugați un titlu de arhivă dinamică

În Editorul de aspect șablon, actualizați setările implicite ale secțiunii cu o culoare de fundal.

• Culoare fundal: #eeeeee

Apoi creați un nou rând cu o singură coloană în secțiunea obișnuită.

Apoi adăugați un modul text la rând.

Ștergeți conținutul implicit al corpului și faceți clic pe pictograma „Utilizați conținut dinamic” și selectați opțiunea „Titlu post / arhivă.

Odată ce elementul Titlu postare / arhivare este la locul său, deschideți setările făcând clic pe pictograma roată.

Apoi actualizați zonele de intrare Înainte și După pentru a înfășura conținutul într-o etichetă H1 și adăugați o bucată suplimentară de conținut static după titlul dinamic după cum urmează:

Inainte de:

<h1>

După:

</h1>

Trebuie să înfășurăm titlul într-o etichetă H1 în scopuri SEO.

Titlu arhivă dinamică stil

Odată ce conținutul dinamic este la locul său, îl putem stiliza folosind următoarele:

• Font de titlu: Mulish
• Font de titlu: Greutate: Greu
• Alinierea textului antet: Centrul
• Culoare text antet: # 3a405a
• Dimensiune text antet: 70 px (desktop), 40 px (tabletă și telefon)

Adăugați text subtitlu din arhivă dinamică

Deoarece putem încheia titlul paginii de arhivă dinamică cu HTML personalizat, putem adăuga un subtitlu care trage titlul paginii de arhivă dinamică în textul subtitrării.

Pentru aceasta, creați un nou modul de text sub modulul de text anterior cu titlul.

Ștergeți textul implicit al corpului și adăugați conținutul dinamic al titlului postării / arhivei în corp (așa cum am făcut anterior).

Deschideți setările titlului postării / arhivei și adăugați următoarele conținut înainte și după conținut.

Inainte de:

<h3>Here are the articles on 

După:

 </h3>

Acum titlul va fi afișat în linie cu linia de text precedentă.

Titlu arhivă dinamică stil

Odată ce conținutul dinamic este la locul său, putem stiliza actualizând următoarele setări H3:

• Rubrica 3 Font: Mulish
• Alinierea textului titlului 3: centru

Utilizarea modulului Blog pentru a afișa dinamic postările pentru pagina curentă

Cu titlul paginii de arhivă dinamică, trebuie să adăugăm modulul blog pentru a afișa postările pentru pagina de arhivă curentă.

Adăugați o secțiune nouă

Înainte de a adăuga modulul de blog, să adăugăm o nouă secțiune la pagină.

Adăugați un rând nou cu o coloană

Apoi, adăugați un nou rând cu o singură coloană la noua secțiune.

Apoi deschideți setările rândului și actualizați următoarele:

• Utilizați lățimea personalizată a jgheabului: DA
• Latime jgheab: 2;
• Lățime: 95%

Adăugați un modul Blog pentru a afișa dinamic postările pentru pagina curentă

Acum trebuie să adăugăm un modul de blog pe rând.

Amintiți-vă, trebuie să ne asigurăm că Postările pentru pagina curentă sunt activate pentru ca pagina archvie să extragă arhiva corectă a postărilor. Actualizați opțiunile de conținut după cum urmează:

• Postări pentru pagina curentă: DA

Modul de proiectare blog

Cu setările de conținut în vigoare, să facem câteva modificări în design. Sub fila Proiectare, actualizați aspectul după cum urmează:

• Aspect: grilă

Acum reveniți la fila conținut și adăugați următoarea culoare de fundal la elementele grilei:

• Culoare fundal: # 3a405a

Actualizați stilurile de text ale titlului

• Titlu Font: Mulish
• Greutatea fontului titlului: Bold
• Culoare text titlu: #eee
• Dimensiune text titlu: 34 px
• Înălțimea liniei de titlu: 1.3em

Actualizați stilurile de text ale corpului

• Font corp: Montserrat
• Culoarea textului corpului: #ffffff
• Înălțimea liniei corpului: 2em

Actualizați stilurile Meta Text

• Meta Font: Montserrat
• Culoare Meta Text: # ffb100

Actualizați stilurile de paginare

• Greutate font paginare: îndrăzneț
• Culoarea textului paginării: # 3a405a

În acest moment, avem șablonul paginii de arhivă pornit și rulat, completat cu titlul paginii și postările de blog (într-un aspect de zidărie) care vor afișa dinamic postările pentru pagina curentă de arhivă.

Rezultat final

Pentru a testa rezultatele, vizitați diferitele tipuri de pagini de arhivă de pe site-ul dvs.

Iată un exemplu de șablon de pagină de arhivare a categoriilor care prezintă toate postările pentru categoria „WordPress”.

Iată un șablon de pagină pentru arhiva autorului care afișează toate postările pentru un anumit autor.

Iată o pagină de arhivare a etichetelor care afișează toate postările cu eticheta „Știri”.

Și iată un șablon de pagină de arhivare a datelor care afișează toate postările din luna octombrie 2019.

Gânduri finale

După ce știți cum să creați un nou șablon de arhivă cu constructorul de teme al lui Divi, este ușor să adăugați un aspect de zidărie pentru postări. Trucul este să folosiți opțiunile încorporate ale Divi pentru a afișa titlul paginii de arhivă ca conținut dinamic și apoi să utilizați modulul blog pentru a afișa în mod dinamic postarea pentru pagina curentă într-un aspect al grilajului de zidărie. Sperăm că acest lucru va ajuta la creșterea designului general al site-ului dvs. web, vizând acele pagini de arhivă care pot fi ușor trecute cu vederea.

Aștept cu nerăbdare să aud de la dvs. în comentarii.

Noroc!