Cum să afișați o bară laterală diferită pentru fiecare postare și pagină în WordPress

Doriți să afișați conținut diferit în bara laterală WordPress pentru anumite postări și pagini?

O bară laterală standard, unică pentru toți, este adesea o oportunitate ratată. Prin personalizarea barei laterale pentru conținut specific, puteți crește implicarea utilizatorilor și puteți crește conversiile.

Deși acest lucru sună tehnic, am văzut direct cum instrumentele potrivite fac ușor să creați și să gestionați bare laterale diferite pentru site-ul dvs.

În acest ghid, vă vom arăta cum să afișați bare laterale diferite pentru fiecare postare și pagină în WordPress.

De ce să afișați o bară laterală diferită pentru anumite pagini sau postări în WordPress?

Motivul principal pentru afișarea unei sidebar diferite este de a oferi o experiență mai relevantă și mai țintită pentru vizitatorii dvs. Acest lucru ajută la îmbunătățirea implicării utilizatorilor, la creșterea conversiilor și la eficientizarea site-ului dvs.

În loc să afișați același conținut generic peste tot, puteți personaliza bara laterală pentru a se potrivi paginii sau postării specifice pe care o vizualizează un utilizator.

De exemplu, puteți afișa widget-uri specifice categoriei pe postările dvs. de blog, puteți afișa informații legate de produse pe paginile magazinului dvs. sau puteți prezenta fluxuri de social media pe pagina Despre noi.

Barele laterale personalizate vă permit, de asemenea, să creați o experiență mai concentrată, prezentând linkuri relevante, reclame sau butoane de apel la acțiune.

Acestea fiind spuse, să analizăm 3 metode pentru a adăuga bare laterale diferite pentru postări și pagini în WordPress. Puteți utiliza legăturile rapide de mai jos pentru a sări la metoda care vi se potrivește cel mai bine:

• Method 1: Create a Custom Theme With Different Sidebars for Specific Pages or Posts (Recommended)
• Method 2: Show a Different Sidebar on Certain Pages With a Free Plugin (Classic Themes)
• Method 3: Add Different Sidebars to Specific Templates in WordPress Full-Site Editor (Block Themes)
• Întrebări frecvente despre barele laterale personalizate

Metoda 1: Creați o temă personalizată cu bare laterale diferite pentru pagini sau postări specifice (Recomandat)

Dintre toate metodele pe care le-am încercat pentru acest tutorial, recomandăm cel mai mult crearea unei teme personalizate. Motivul este că oferă cea mai mare flexibilitate și control asupra designului site-ului tău WordPress.

Acestea fiind spuse, vă sugerăm să urmați această metodă doar dacă sunteți în stadiile incipiente ale construirii site-ului dvs. sau dacă sunteți interesat de schimbarea corectă a temei WordPress. Acest lucru se datorează faptului că schimbarea temelor poate afecta semnificativ conținutul și aspectul existent.

Dacă nu doriți să schimbați tema, puteți sări la metoda 2 (teme clasice) sau metoda 3 (teme bloc).

Pentru această metodă, veți avea nevoie de un plugin de creare pagini WordPress.

Pe baza experienței noastre de testare a zeci de constructori de teme, recomandăm utilizarea unui instrument precum SeedProd sau Thrive Architect. Acestea oferă mult mai mult control și opțiuni de personalizare decât funcțiile încorporate ale WordPress.

Mai multe dintre mărcile noastre partenere folosesc SeedProd deoarece este ușor de utilizat pentru începători și fiabil. Puteți afla mai multe despre instrument în recenzia noastră despre SeedProd.

Pasul 1: Instalați și activați SeedProd

În primul rând, instalați pluginul SeedProd pe site-ul dvs. web. Dacă este prima dată, consultați ghidul nostru pentru începători despre cum să instalați un plugin WordPress.

Odată finalizat, introduceți cheia de licență SeedProd în câmpul corespunzător și faceți clic pe „Verificați cheia”.

Pasul 2: Alegeți un kit de șabloane de temă

Apoi, accesați SeedProd » Theme Builder.

Apoi, faceți clic pe butonul „Kituri de șabloane de temă”.

Ar trebui să vedeți acum toate kiturile de șabloane de temă disponibile. Simțiți-vă liber să folosiți oricare dintre ele ca bază pentru tema dvs. personalizată.

Puteți, de asemenea, să treceți cu mouse-ul peste fiecare kit și să faceți clic pe butonul lupă pentru a vizualiza tema mai îndeaproape.

Pentru acest tutorial, recomandăm alegerea unui kit de temă care include deja un design de bară laterală.

Acest lucru vă permite să duplicați „partea de șablon a barei laterale” existentă și să o personalizați, ceea ce este mult mai rapid decât construirea uneia noi de la zero.

De exemplu, kitul de temă Curbside Food Truck are un singur șablon de postare care include deja o bară laterală:

Odată ce ați decis asupra unui kit, pur și simplu treceți cursorul peste el.

Apoi, faceți clic pe pictograma portocalie cu bifa atunci când apare.

Acum, așteptați câteva momente ca SeedProd să vă configureze tema.

Pasul 3: Duplicați și editați șablonul barei laterale

După ce acest lucru este finalizat, ar trebui să fiți redirecționat din nou la pagina de setări „Theme Builder” și să vedeți că SeedProd a creat mai multe șabloane de temă pentru site-ul dvs. WordPress.

Acum putem începe să edităm șablonul temei dvs.

Să spunem că doriți ca bara laterală de pe paginile de arhivă ale blogului dvs. să arate diferit față de cea de pe postările blogului. În acest caz, trebuie să creați 2 șabloane de temă pentru bare laterale diferite.

Mai întâi, găsiți șablonul de temă „Sidebar” în kit-ul dvs. Acesta este bara laterală implicită pe care o folosește tema dvs. atunci când o pagină necesită o bară laterală.

Pentru ilustrare, vom duplica acest șablon și apoi îl vom edita pentru a-l diferenția de versiunea originală. Pentru a face acest lucru, puteți pluti cursorul peste șablon și faceți clic pe „Duplicare”.

Acum ar trebui să vedeți o versiune copiată a șablonului barei laterale.

Aici, apasă pe „Editează design”.

Pasul 4: Personalizați-vă noua bară laterală

Veți ajunge acum la editorul SeedProd. Dacă șablonul barei laterale pare mai lat decât v-ați aștepta, nu vă faceți griji. Dimensiunea se va ajusta pe măsură ce bara laterală este adăugată ulterior unei pagini.

În tema aleasă, șablonul implicit al barei laterale afișează o bară de căutare, un apel la acțiune pentru abonarea la newsletter, linkuri către paginile de categorii ale blogului și o previzualizare a fluxului nostru Instagram.

Vom înlocui unele dintre aceste elemente. Aceste blocuri au fost organizate în grupuri sau rânduri, astfel încât putem șterge mai multe blocuri dintr-un singur rând odată, în loc să le eliminăm unul câte unul.

Pentru a face acest lucru, puteți pluti pur și simplu peste un element până când apare o linie albastră închisă peste un grup întreg de blocuri. Apoi, faceți clic pe pictograma coș de gunoi „Ștergere rând” din partea de sus a elementului.

Pentru a crea un rând nou, plutiți cursorul peste elementul imediat deasupra locului unde doriți să apară noul rând. Când apare o linie albastră închisă, faceți clic pe pictograma „+” care apare sub ea.

Apoi, trebuie să faceți clic pe pictograma „+” de mai jos.

Acum, puteți alege un aspect pentru rând.

Vom alege prima opțiune, deoarece este cea mai potrivită pentru nevoile noastre.

Aici puteți începe să vă distrați și să adăugați tot felul de blocuri în bara laterală.

SeedProd are o mulțime de opțiuni din care puteți alege, de la un numărător invers și un punct de interes pe imagine, la o bară de progres și multe altele. Puteți folosi bara de căutare sau derulați în jos pe fila „Blocuri” pentru a găsi blocul de care aveți nevoie.

Odată ce ați găsit un bloc care vă place, pur și simplu trageți-l și plasați-l în rând.

De dragul exemplului, am decis să adăugăm blocul „Testimoniale”.

Puteți folosi acest lucru pentru a afișa o recenzie pozitivă de la un client ca dovadă socială. Dacă doriți să învățați cum să adăugați și dvs. una, puteți citi ghidul nostru despre adăugarea de testimoniale rotative în WordPress.

Simțiți-vă liber să adăugați mai multe rânduri și blocuri în acest moment.

După ce sunteți mulțumit de aspectul barei laterale, faceți clic pe pictograma săgeată de lângă butonul „Salvare” din colțul din dreapta sus al paginii. Apoi, faceți clic pe „Publicați”.

Pasul 5: Adăugați noua bară laterală la un șablon de pagină

Acum, să adăugăm această nouă bară laterală la un șablon de postare sau pagină. Pentru a face acest lucru, reveniți la SeedProd » Theme Builder din tabloul de bord WordPress.

Kitul de teme pe care îl folosim are 2 șabloane de teme care prezintă o bară laterală: „Postare unică” și „Arhive, Rezultate căutare”. Prima este pentru postările WordPress, în timp ce a doua este pentru toate paginile de arhivă, inclusiv arhivele de categorii, precum și pagina de rezultate ale căutării.

Ambele șabloane folosesc în prezent același șablon de bară laterală.

În acest caz, dorim ca șablonul „Arhive, Rezultate căutare” să folosească noua bară laterală pe care tocmai am creat-o. Deci, pur și simplu localizați șablonul pe care doriți să îl editați și faceți clic pe „Editare design”.

În editorul SeedProd, treceți cu mouse-ul peste zona cu bara laterală și, când apare o bară de instrumente portocalie deasupra, faceți clic pe ea.

Panoul de setări din stânga ar trebui să spună „Editare: Piese de șablon”.

În meniul derulant Șablon de piesă, trebuie să selectați șablonul de bară laterală pe care tocmai l-ați creat.

Ar trebui să vedeți acum că noul dvs. sidebar a fost adăugat la șablonul paginii dvs.

După aceea, pur și simplu faceți clic pe „Save” pentru a publica modificările.

Pasul 6: Activați tema SeedProd

În această etapă, puteți crea mai multe bare laterale și le puteți adăuga la alte pagini repetând aceiași pași ca înainte.

Odată ce sunteți mulțumit, reveniți la SeedProd » Theme Builder din nou și activați setarea „Enable SeedProd Theme” până când apare „YES”. Acest lucru va activa tema SeedProd pe site-ul dvs. web.

Și asta e tot!

Iată cum arată bara laterală personalizată:

Metoda 2: Afișați o bară laterală diferită pe anumite pagini cu un plugin gratuit (Teme clasice)

Majoritatea temelor clasice WordPress au zone de sidebar predefinite și, de obicei, afișează același sidebar pe întregul site.

Deși acest lucru funcționează, poate fi limitativ dacă doriți să afișați conținut unic pentru diferite secțiuni.

Din fericire, puteți obține cu ușurință mai mult control utilizând un plugin gratuit. Vă recomandăm Lightweight Sidebar Manager. Acest plugin vă permite să creați sidebar-uri personalizate nelimitate și să le atribuiți postărilor, paginilor, categoriilor specifice și multe altele.

Pasul 1: Instalați pluginul Lightweight Sidebar Manager

Primul lucru pe care trebuie să-l faceți este să instalați și să activați pluginul Lightweight Sidebar Manager. Pentru mai multe detalii, consultați ghidul nostru pas cu pas despre cum se instalează un plugin WordPress.

Pasul 2: Creați un nou sidebar personalizat

După activare, trebuie să mergeți la Aspect » Bare laterale. Pentru a crea prima bară laterală, faceți clic pe butonul „Adăugare nouă”.

Acum puteți introduce un titlu pentru noua bară laterală WordPress. Acesta este doar pentru referința dvs., deci puteți folosi orice doriți.

Cu asta făcut, deschide meniul derulant „Sidebar de înlocuit”. Această setare îți permite să alegi ce zone de sidebar implicite ale temei tale (cum ar fi „Sidebar principal” sau „Sidebar blog”) vor fi înlocuite de noul tău sidebar personalizat.

Alege locația unde dorești să afișezi sidebar-ul. Opțiunile pe care le vezi pot varia în funcție de tema ta WordPress. 

Pasul 3: Configurează regulile de afișare și excludere

Acum, puteți controla unde apare bara laterală creând reguli de includere sau excludere. 

Pentru a crea o regulă de includere, pur și simplu deschideți meniul derulant „Afișați pe” și alegeți paginile, postările, tipurile de postări personalizate sau categoriile unde doriți să utilizați bara laterală. 

De exemplu, ați putea adăuga bara laterală la o pagină specifică, cum ar fi pagina de eroare 404, arhiva autorului sau pagina de blog.

O altă opțiune este utilizarea barei laterale pentru o anumită pagină, postare sau categorie, selectând „Pagini/Postări/Taxonomii specifice”.

Acest lucru adaugă o casetă unde puteți introduce pagina, postarea sau categoria.

Pentru a crea mai multe reguli de afișare, pur și simplu faceți clic pe butonul „Adăugare regulă de afișare”.

Aceasta adaugă o secțiune unde poți crea noua regulă de includere.

Dacă preferați, puteți crea reguli de excludere în schimb. De exemplu, ați putea dori să afișați bara laterală pe fiecare pagină, cu excepția paginii de pornire. 

Puteți combina, de asemenea, reguli de includere și excludere pentru a controla exact unde apare bara laterală pe blogul dvs. WordPress.

Pentru a crea o regulă de excludere pentru locația barei laterale, pur și simplu faceți clic pe butonul „Add Exclusion Rule”.

În noua secțiune „Nu se afișează pe”, deschideți meniul derulant și selectați pagina sau postarea care nu ar trebui să utilizeze această bară laterală. 

Puteți, de asemenea, să excludeți bara laterală din paginile WordPress care au o anumită categorie urmând același proces descris mai sus.

Pasul 4: Setează vizibilitatea pe roluri de utilizator (Opțional)

După ce ați decis unde va apărea bara laterală, s-ar putea să doriți să afișați conținut diferit pentru utilizatori diferiți.

De exemplu, dacă aveți un site de membri, atunci s-ar putea să doriți să utilizați o bară laterală diferită pentru vizitatori decât pentru membrii conectați. 

Pentru a face acest lucru, deschideți meniul derulant „Utilizator” și alegeți un rol din meniul derulant. Acum, doar persoanele cu acest rol specific de utilizator vor vedea bara laterală. 

În final, s-ar putea să doriți să introduceți o descriere opțională. Aceasta va apărea doar în tabloul de bord WordPress, deci este o modalitate bună de a partaja informații cu alți administratori sau utilizatori.

Dacă veți crea multe bare laterale, atunci puteți folosi acest câmp pentru a vă lăsa note și memento-uri utile.

Când sunteți mulțumit de informațiile pe care le-ați introdus, pur și simplu faceți clic pe „Publică”.

Pasul 5: Adaugă widgeturi în noul tău sidebar

Cu asta făcut, accesați Aspect » Widgeturi. Veți vedea acum toate zonele de widget pe care tema dvs. le suportă implicit, plus bara laterală nouă pe care ați creat-o în pasul anterior.

Acum puteți adăuga widgeturi în bara laterală, la fel ca orice altă secțiune de widgeturi.

Pentru instrucțiuni pas cu pas, consultați ghidul nostru despre cum să adăugați și să utilizați widget-uri WordPress. 

Când sunteți mulțumit de modul în care este configurată bara laterală, faceți clic pe „Update”.

Acum, dacă vizitați blogul dvs. WordPress, veți vedea noua bară laterală live.

Pentru a crea mai multe bare laterale tematice, pur și simplu continuați să repetați acești pași. 

Metoda 3: Adăugarea de bare laterale diferite la șabloane specifice în editorul complet de site WordPress (Șabloane bloc)

Dacă folosești o temă bazată pe blocuri, cum ar fi tema Twenty Twenty-Four sau Hestia, atunci poți folosi editorul complet al site-ului pentru a crea sidebare personalizate și a le plasa oriunde dorești.

Vom folosi tema Twenty Twenty-Four pentru a demonstra această metodă.

Marele avantaj al temelor bazate pe blocuri este că toate folosesc același instrument standard: Editorul complet al site-ului. Deși șabloanele specifice din fiecare temă pot fi diferite, procesul de editare este consecvent.

Acest lucru înseamnă că nu ai nevoie de un plugin special pentru sidebar pentru a adăuga un sidebar diferit paginilor sau postărilor tale.

Pasul 1: Deschide editorul complet al site-ului

Mai întâi, accesați Aspect » Editor în administratorul dvs. WordPress.

Aici veți vedea câteva meniuri pentru a vă personaliza tema de blocuri.

Pentru a crea o nouă bară laterală, trebuie să selectați „Modele”.

Pasul 2: Duplică partea de șablon a sidebar-ului

Acum, faceți clic pe „Toate părțile șablonului”.

Părțile de șablon sunt blocuri reutilizabile de conținut, cum ar fi un antet, un subsol sau un sidebar, care pot apărea pe mai multe pagini ale site-ului tău.

Ar trebui să vezi o parte de șablon numită „Sidebar”. Dă clic pe meniul cu trei puncte și apoi selectează „Duplică”. Acest lucru va crea o copie a șablonului de sidebar pe care o poți personaliza ulterior.

În fereastra pop-up nouă, dați un nume noii bare laterale pentru a o identifica ușor mai târziu.

În secțiunea „Area”, selectați „General”. Odată terminat, faceți clic pe „Duplicate”.

Pasul 3: Personalizează noul sidebar

Acum ar trebui să vedeți bara laterală nou duplicată în lista de părți ale șablonului.

Pur și simplu faceți clic pe miniatură pentru a deschide interfața de editare.

Acum, puteți începe să vă personalizați bara laterală, să adăugați mai multe blocuri sau să le configurați pentru a se potrivi designului site-ului dvs. web. Editorul complet al site-ului funcționează în același mod ca și editorul de blocuri, în sensul că trebuie doar să trageți și să plasați blocuri pe partea de șablon.

În cazul nostru, am decis să afișăm cele mai recente articole ale noastre, un buton de apel la acțiune pentru a vă abona la lista noastră de e-mail și un separator de formă pentru a separa aceste elemente.

Odată ce sunteți mulțumit de aspectul barei laterale, faceți clic pe butonul „Save”.

Pasul 4: Adăugați noua bară laterală la un șablon de pagină

Acum, trebuie să adăugăm această nouă bară laterală la un șablon de pagină.

Mai întâi, reveniți la meniul principal al editorului complet al site-ului. Apoi, faceți clic pe „Șabloane”.

Șablonul Twenty Twenty-Four are mai multe șabloane de pagină cu o bară laterală, dar toate folosesc aceeași parte de șablon pentru bara laterală. Să o schimbăm pe una dintre ele cu bara laterală nou creată.

Pentru a face acest lucru, selectează un șablon de pagină cu o bară laterală. În cazul nostru, vom selecta „Pagină cu bară laterală” pentru ca bara laterală de pe paginile obișnuite să arate diferit față de cea de pe postările WordPress individuale.

În interfața de editare, faceți clic pe secțiunea „Bară laterală”.

Pe bara de instrumente a blocului, faceți clic pe meniul cu trei puncte și selectați „Ștergere” pentru a elimina bara laterală veche.

Apoi, faceți clic pe pictograma „+” din aceeași secțiune.

După aceea, localizați și selectați „Parte șablon”.

Odată ce ați făcut acest lucru, faceți clic pe „Alegeți”.

Acest lucru vă va permite să alegeți bara laterală pe care tocmai ați creat-o.

Va apărea o nouă fereastră pop-up, care îți va arăta diferitele părți de șablon pe care le are tema.

Aici, faceți clic pe noul șablon de bară laterală.

În această etapă, puteți continua personalizarea șablonului dacă este necesar.

Apoi, pur și simplu faceți clic pe „Save”.

Acum ați personalizat un șablon de pagină și i-ați adăugat o bară laterală personalizată.

Pasul 5: Atribuiți noul șablon unei pagini

Cu toate acestea, trebuie să ne asigurăm că acest șablon este de fapt utilizat pe site-ul dumneavoastră. Pentru a face acest lucru, reveniți la meniul principal al editorului complet de site și faceți clic pe „Pagini”.

Apoi, alegeți o pagină la care doriți să adăugați bara laterală.

De dragul exemplului, vom folosi pagina noastră „Politică de confidențialitate”.

Acum, faceți clic pe pictograma de setări din partea stângă sus a paginii și faceți clic pe „Pagini” în panoul de setări al paginii.

După aceea, trebuie să selectați „Swap template”.

Odată ce ați făcut acest lucru, va apărea o fereastră pop-up.

Aici, selectați pur și simplu șablonul de pagină cu noua bară laterală.

Și asta e tot! Simțiți-vă liber să repetați aceiași pași pentru a crea o nouă bară laterală personalizată și a o implementa pe diferite pagini și postări.

Iată cum arată pagina noastră de exemplu de politică de confidențialitate cu noua bară laterală:

Întrebări frecvente despre barele laterale personalizate

Iată câteva întrebări pe care cititorii noștri le-au adresat frecvent cu privire la adăugarea unei bare laterale personalizate la postări sau pagini specifice în WordPress:

1. Cum pot crea o bară laterală unică doar pentru o singură postare de blog specifică?

Dacă utilizați un plugin precum Lightweight Sidebar Manager, puteți crea o nouă bară laterală și puteți seta regula „Afișare pe” la „Pagini/Postări/Taxonomii specifice”. Apoi, pur și simplu introduceți numele postării exacte pe care doriți să apară.

Dacă utilizați un constructor de teme precum SeedProd, puteți crea un nou șablon de pagină, puteți atribui bara laterală personalizată acestuia și apoi puteți aplica acel șablon postării individuale din editorul de postări.

2. Va încetini site-ul meu web având multe bare laterale diferite?

În general, nu. Numărul de bare laterale pe care le creați are un impact minim asupra vitezei site-ului. Performanța depinde mai mult de ceea ce puneți în ele.

O bară laterală plină cu multe widget-uri grele, cum ar fi imagini mari sau scripturi complexe, poate încetini o pagină. Cu toate acestea, plugin-urile și instrumentele de gestionare a barei laterale în sine sunt ușoare și optimizate pentru performanță.

3. Cum funcționează barele laterale personalizate pe dispozitivele mobile?

Majoritatea temelor moderne WordPress sunt responsive. Aceasta înseamnă că pe ecrane mai mici, cum ar fi cele de pe telefoane, conținutul barei laterale nu este afișat pe lateral. În schimb, este „stivuit” și mutat pentru a apărea sub conținutul principal al paginii.

Barele tale laterale personalizate vor fi în continuare vizibile vizitatorilor mobili, dar aceștia vor trebui să deruleze în jos, după articol, pentru a le vedea.

4. Pot elimina bara laterală dintr-o anumită pagină în loc să o înlocuiesc?

Da. Majoritatea temelor WordPress includ un șablon de pagină „Lățime completă” sau „Fără bară laterală”. Puteți selecta acest șablon din editorul de pagină pentru a elimina bara laterală din acea pagină specifică.

Dacă tema ta nu are această opțiune, un constructor de teme precum SeedProd (Metoda 1) îți oferă control complet pentru a crea șabloane fără bare laterale.

Sperăm că acest articol v-a ajutat să învățați cum să afișați diferite bare laterale pe pagini și postări în WordPress. De asemenea, ați putea dori să consultați ghidul nostru despre cum să schimbați partea barei laterale în WordPress și selecțiile noastre experte de cele mai bune alternative la Canva pentru grafică web.

Dacă ți-a plăcut acest articol, te rugăm să te abonezi la canalul nostru de YouTube pentru tutoriale video WordPress. Ne poți găsi, de asemenea, pe Twitter și Facebook.