Cum să editați antetul în WordPress – 3 metode ușoare

Antetul este una dintre cele mai importante zone ale oricărui site web. Este în partea de sus a paginii și apare pe aproape fiecare pagină a site-ului dvs., așa că ar trebui să-l personalizați și să îl utilizați inteligent. Mulți dintre utilizatorii noștri au avut îndoieli cu privire la acest lucru, așa că iată un ghid pas cu pas despre cum să editați antetul în WordPress .

WordPress auto-găzduit este cel mai bun și mai confortabil sistem de gestionare a conținutului (CMS) disponibil pentru a crea orice doriți. Când porniți un site, tot ce aveți nevoie este să vă înscrieți pentru găzduire, să instalați WordPress și să scrieți conținut. Este atat de simplu. Cu toate acestea, dacă doriți să eliberați toată puterea WordPress și să profitați la maximum de ea, ar trebui să-l personalizați.

Una dintre cele mai simple și cruciale personalizări de care are nevoie fiecare utilizator este schimbarea antetului site-ului. În acest articol, vă vom arăta cum puteți edita antetul în WordPress fără a angaja vreun freelancer .

Care este antetul WordPress?

În WordPress, antetul este elementul din partea de sus a paginii web. Acest element apare pe fiecare pagină a site-ului și conține de obicei un logo, un meniu pentru a accesa diferite secțiuni ale site-ului, o bară de căutare și informații de contact. În magazinele de comerț electronic, este, de asemenea, obișnuit să vezi coșul și produsele pe care le-ai adăugat. De exemplu, la QuadLayers, antetul este bara de sus pe care o vedeți pe fiecare pagină.

De ce editați antetul în WordPress?

Antetul este una dintre cele mai importante zone de pe site-ul dvs. Este primul lucru pe care îl văd vizitatorii când ajung pe site-ul tău și, după cum probabil știi, primele impresii contează. Potrivit unui studiu recent, utilizatorii decid în 0,05 secunde dacă le place sau nu site-ul dvs. și, prin urmare, dacă vor rămâne sau vor pleca.

În plus, cercetările efectuate de Nielsen Norman Group, au arătat că, în medie, un vizitator rămâne pe un site doar 10-20 de secunde. Nu contează dacă conținutul tău este grozav. Dacă nu le place ceea ce văd și pleacă, nu vor ajunge niciodată la acel conținut uimitor. Prin urmare, trebuie să aveți un antet atrăgător care să îi facă pe utilizatori să rămână pe site-ul dvs.

Antetul WordPress conține, de asemenea, informații importante pentru a ajuta utilizatorii să navigheze pe site-ul dvs. și multe îndemnuri (CTA). Deci, pentru a profita la maximum, trebuie să personalizați antetul .

Cum se editează antetul în WordPress – 3 metode

Există mai multe moduri de a edita antetul în WordPress. Aici, am subliniat 3 moduri prietenoase pentru începători pe care le puteți urma:

1. Folosind un plugin
2. Editarea fișierului header.php al temei
3. Cu un client FTP

Să aruncăm o privire mai atentă la fiecare dintre ele.

1) Personalizați antetul folosind un plugin

Dacă preferați pluginurile WordPress decât codarea și modificarea fișierelor de bază, aceasta este cea mai bună opțiune. În depozitul de pluginuri WordPress, există un plugin gratuit disponibil numit „Insert Headers and Footers“. Acest instrument simplu nu are nevoie de configurații complexe suplimentare. Deci, haideți să vedem pas cu pas cum puteți edita antetul folosind pluginul Insert Headers and Footers.

1. Mai întâi, conectați-vă la backend-ul dvs. WordPress.

Accesați Plugin-uri > Adăugați nou . De acolo, puteți instala noi pluginuri WordPress căutând în depozit sau încărcând fișierele plugin. În bara de căutare, tastați Inserare anteturi și subsoluri .

3. Selectați opțiunea corectă și instalați-o. Apoi, activează-l.

4. Acum suntem gata să-l configuram. În secțiunea Setări , veți vedea setările Inserați anteturi și subsoluri , așa cum se arată mai jos.

Acolo, veți vedea că puteți edita trei secțiuni:

• Antet
• Corp
• Subsol

Dacă adăugați un cod în secțiunea antet, acesta va fi vizibil înaintea etichetei </head> . Același lucru este valabil și pentru corp și subsol. Codurile vor apărea înaintea etichetelor </body> și, respectiv, </footer> . În acest caz, editați antetul, așa că căutați eticheta </head> . 5. În Scripturi din secțiunea Antet , adăugați codul pe care doriți să îl treceți sub eticheta head.

6. După ce ați adăugat codul, nu uitați să salvați modificările făcând clic pe Salvare .

7. Asta e! Codul va fi adăugat la antetul dvs. Una peste alta, utilizarea Inserați anteturi și subsoluri este super simplă, așa că este o alegere excelentă pentru cei care doresc să-și editeze antetul WordPress fără nicio problemă sau codare.

2) Schimbați fișierul Header.php al temei

Dacă doriți să aveți mai mult control asupra antetului și să aveți abilități de codare de bază, există și alte opțiuni. Dacă nu sunteți un fan al folosirii prea multor plugin-uri pentru a evita încetinirea site-ului dvs. sau pur și simplu nu doriți să utilizați pluginul Insert Headers and Footers , nu vă faceți griji. Aici vă vom arăta cum puteți încă edita antetul WordPress cu puțină codare pas cu pas .

Pentru a face acest lucru, va trebui să modificați fișierele de bază ale temei. Deci, înainte de a începe, vă recomandăm să creați o temă copil. Puteți crea unul manual sau folosind un plugin pentru temă copil. După ce ați creat tema copil, să vedem cum puteți modifica fișierul antet folosind tabloul de bord de administrare WordPress .

1. Mai întâi, conectați-vă la secțiunea de administrare.

2. În secțiunea Aspect , veți vedea Editorul de teme .

3. Aici puteți face modificări fișierelor de bază ale temei. În mod implicit, editorul va trage fișierul style.css al temei curente pentru a-l edita și va arăta cam așa.

4. În partea dreaptă, veți vedea toate fișierele și folderele disponibile în directorul temei curente.

5. Derulați în jos lista până când găsiți header.php (sub Theme Header).

6. Selectați fișierul și acesta se va deschide în editorul dvs. Pentru a crea acest ghid, folosim tema GeneratePress WordPress, astfel încât să arate așa.

7. Acum, începe distracția. În timp ce editați fișierul header.php și adăugați codul personalizat, asigurați-vă că adăugați fragmentul între etichetele <head> și </head> . În acest caz, vom adăuga un text exemplu chiar înainte de eticheta </head> .

8. Faceți clic pe Actualizare fișier pentru a salva modificările. Dacă vedeți mesajul Fișier editat cu succes , modificările sunt salvate corect. Puteți verifica acest lucru accesând interfața site-ului dvs. și vizualizând sursa.

Asta e! Așa editezi antetul în WordPress prin fișierul header.php . De asemenea, poate fi util să adăugați și alte personalizări la antet. Să aruncăm o privire la unele dintre ele.

Adăugați coduri de urmărire

Dacă doriți să adăugați un cod de urmărire Google Analytics, un cod de anunțuri automate/cod de verificare Google AdSense, Facebook Pixel sau chiar un cod de verificare pentru consola de căutare Google, ar trebui să îl plasați chiar înaintea etichetei </head> . Dacă faceți acest lucru, asigurați-vă că ați actualizat fișierul după adăugarea fragmentelor, altfel nu va funcționa.

SFAT PRO: Schimbați dimensiunea fontului și stilul antetului WordPress

În unele cazuri, în afară de editarea textului, poate doriți să schimbați fontul sau stilul antetului WordPress. Să aruncăm o privire la cum poți să o faci. Pentru a schimba stilul antetului, trebuie să cunoașteți puțin CSS. Cu toate acestea, aici vă vom arăta cum puteți edita dimensiunea fontului într-un mod foarte simplu.

1. Pentru a adăuga un pic de cod CSS pe blogul dvs., trebuie să mergeți la secțiunea Aspect și să faceți clic pe Personalizare .

2. Acolo, veți găsi mai multe opțiuni de configurare. Vă puteți configura întregul site web în funcție de configurația temei instalate, iar unele teme premium precum Divi sau GeneratePress vă permit, de asemenea, să aveți configurații personalizate în personalizat.

3. Chiar dacă aceste configurații pot fi diferite în funcție de tema dvs. WordPress, veți putea înțelege cum să faceți acest lucru cu un singur exemplu. În cazul nostru, folosim tema WordPress GeneratePress Lite, așa că facem clic pe CSS suplimentar .

4. Aici, puteți edita codul CSS al temei existente pentru a vă personaliza antetul. Mai întâi, verificați sursa paginii pentru a găsi clasa CSS potrivită. În cazul nostru, este titlul principal, așa că asta ar trebui să edităm.

De exemplu, să presupunem că trebuie să schimbați stilul de font al antetului și să îl faceți italic. Pur și simplu adăugați:

 .titlul principal {

font-style: italic;

}

Si asta e. Ai schimbat stilul de font al antetului WordPress. În plus, puteți atribui CSS personalizat pentru a modifica alte lucruri, cum ar fi:

• Font-family : font: Arial – Acest lucru va schimba fontul în „Arial”
• Size: font-size: 16px – Aceasta va schimba dimensiunea fontului la 16 pixeli, așa că dacă doriți să setați o dimensiune de 24, de exemplu, scrieți pur și simplu 24 în loc de 16 în cod.

3) Editați antetul prin FTP

Aceasta este, de asemenea, o modalitate ușoară pentru începători. Dacă aveți probleme cu editorul de teme WordPress, puteți utiliza un client FTP . Pentru acest tutorial, folosim FileZilla pentru că este preferatul nostru, dar dacă vă place unul diferit, oricare va fi potrivit. Acum, să vedem cum să edităm antetul WordPress prin FTP.

1. Pentru a conecta FTP la serverul dvs., aveți nevoie de un cont FTP. Din cPanelul de găzduire, puteți crea unul. Apoi, cu numele de utilizator, numele de gazdă, portul de parolă, conectați clientul FTP la serverul dvs.

2. În partea stângă, veți vedea stocarea locală, iar în partea dreaptă, stocarea serverului. Pentru a edita fișierul antet, accesați directorul temei active.

3. Calea va fi / wp-content/themes/theme-name/ . Acolo, veți vedea fișierul header.php .

4. Faceți clic dreapta pe el și alegeți opțiunea de editare. Fișierul va fi salvat în spațiul de stocare local și va fi deschis cu un editor de fișiere precum Notepad sau Notepad++.

5. Aici faceți modificările dorite chiar înaintea etichetei </head> . După efectuarea modificărilor, salvați fișierul și încărcați-l înapoi pe server.

6. Asta e! Ați editat fișierul și ați schimbat antetul WordPress al site-ului dvs.! Puteți verifica modificările vizualizând codul sursă al site-ului web. Este demn de remarcat faptul că această metodă are un dezavantaj principal.

Odată ce ați schimbat tema, veți pierde toate personalizările anterioare, așa că dacă intenționați să schimbați temele în viitor, aceasta ar putea să nu fie cea mai bună opțiune pentru dvs. Pe de altă parte, dacă trebuie să modificați antetul temei noi cu codul vechi, o simplă copiere-lipire va face treaba.

Primă

Unele teme WordPress precum Newspaper, Newsmag și altele vă permit să editați antetul temei. Majoritatea temelor WordPress vin cu un panou tematic dedicat. De acolo, puteți personaliza tema. Ca exemplu, aruncați o privire la panoul tematic oferit de tema Ziarului WordPress de mai jos.

Pentru a adăuga codul Google Analytics, echipa a adăugat o secțiune dedicată panoului.

Codul va fi adăugat în secțiunea <head> a site-ului dvs. web. După ce adăugați codul, pur și simplu salvați modificările, ștergeți memoria cache a site-ului dvs. și sunteți gata! Dacă tema dvs. nu acceptă acest lucru pentru a edita antetul, puteți utiliza una dintre metodele menționate mai sus.

Ce să adăugați în antet?

Deci, acum că știți cum să editați antetul WordPress, să aruncăm o privire la ce puteți adăuga la el:

• Cod de urmărire Google Analytics
• Cod de verificare
• Cod de anunțuri automate
• Facebook Pixel
• Cod de verificare pentru Search Console
• Cod de culoare de bare mobil
• Imagini și videoclipuri
• Cod de verificare Pinterest

După cum puteți vedea, aproape fiecare verificare se poate face prin modificarea antetului. În plus, dacă aveți nevoie, puteți adăuga și un widget la antet. Acest lucru ar putea fi vizibil pentru vizitatorii site-ului dvs. și poate fi foarte util, deoarece puteți utiliza widget-ul pentru a adăuga un buton CTA, afișare reclamă sau orice doriți.

Cum să adăugați o imagine la antet în WordPress

O altă posibilă personalizare este adăugarea de imagini la antetul WordPress . Pentru a face acest lucru pur și simplu urmați acești pași:

1. Conectați-vă la tabloul de bord de administrare WordPress
2. Accesați Aspect > Antet . Vă rugăm să rețineți că unele teme nu au opțiunea de antet, așa că va trebui să mergeți la Aspect > Editor de teme > Antet și să modificați antetul fișierelor PHP
3. Apoi, accesați secțiunea Imagine antet și faceți clic pe Adăugați o imagine nouă
4. După aceea, selectați imaginea pe care doriți să o utilizați în antet
5. Apoi, veți merge la secțiunea Decupați imaginea unde puteți decide ce parte a imaginii doriți să afișați.
6. După ce ați terminat, faceți clic pe Publicați .
7. Asta e! Ați personalizat antetul WordPress cu o nouă imagine

Când adăugați o imagine în antet, nu uitați să:

• Folosește fotografii care să atragă atenția vizitatorilor și să comunice ceea ce faci și valorile tale
• Folosiți imagini care se potrivesc cu brandul dvs. și care sunt în concordanță cu ceea ce doriți să comunicați. De exemplu, dacă ești o marcă de sport, nu arăta poze cu fast-food sau mașini. Acest lucru ar putea suna evident, dar există o mulțime de site-uri în care imaginile nu se potrivesc cu ceea ce fac și ajung să încurce clienții

Cum să adăugați un videoclip la antetul în WordPress

Pentru unele companii, ar putea avea sens să adăugați un videoclip la antet pentru a atrage atenția utilizatorilor. Deci, aici, vă vom arăta cum să o faceți în 2 moduri diferite.

1. Adăugați un videoclip YouTube la antet
2. Adăugați un videoclip mp4

Să aruncăm o privire mai atentă la fiecare metodă.

1) Adăugați un videoclip YouTube

Înainte de a începe cu acești pași, accesați YouTube și copiați adresa URL a videoclipului pe care doriți să-l adăugați în antetul WordPress. După aceea, faceți următoarele:

1. Conectați-vă la tabloul de bord de administrare WordPress
2. Apoi, accesați Aspect > Antet
3. Acolo, accesați secțiunea Header Media și inserați adresa URL a videoclipului YouTube în câmpul corespunzător din Header Video
4. Apăsați pe Publicare și gata

2) Adăugați un videoclip mp4

O a doua opțiune pentru a adăuga un videoclip la antetul WordPress este să încărcați un fișier video mp4. Rețineți că fișierul nu poate cântări mai mult de 8 MB . În plus, dimensiunile vor trebui să se adapteze la dimensiunea containerului temei dvs. Deci, pentru a adăuga un videoclip mp4 la antet, în tabloul de bord WordPress, trebuie să:

1. Accesați Aspect > Antet
2. Apoi, accesați secțiunea Header Media și apăsați Select Video sub Header Video
3. Căutați fișierul și încărcați-l în Biblioteca media
4. Apoi apăsați pe Alegeți videoclipul și publicați -l
5. Asta e! Ați adăugat un videoclip la antetul WordPress!

NOTĂ : Un avantaj al metodei YouTube este că vă permite să adăugați orice videoclip, în timp ce dacă încărcați un fișier video, fișierul nu poate fi mai mare de 8 MB și trebuie să se adapteze la dimensiunile temei.

BONUS: Cum să accesezi eticheta antetului în WordPress

Cele mai simple două moduri de a accesa eticheta pentru a vă edita antetul în WordPress sunt:

• Din tabloul de bord WordPress : Accesați Aspect > Editor de teme > fișier header.php . În partea de sus a fișierului, ar trebui să vedeți <head> și </head>. Pur și simplu adăugați codul dvs. între etichete.
• Prin URL : Alternativ, puteți accesa eticheta antetului adăugând /wp-admin/theme-editor.php?file=header.php la adresa URL a domeniului dvs. De exemplu, pentru QuadLayers, ar fi http://quadlayers.com/wp-admin/theme-editor.php?file=header.php .
  Dacă utilizați WordPress Network, va trebui să utilizați un alt link: http://quadlayers.com/wp-admin/network/theme-editor.php (nu uitați să schimbați adresa URL cu domeniul dvs.)

Ce se întâmplă dacă tema mea nu are un fișier header.php?

Unele teme copii nu au propriile fișiere header.php. Dacă acesta este cazul dvs., există 2 opțiuni pentru a vă personaliza antetul:

• Mutați antetul temei părinte în tema secundară și editați-o de acolo
• Utilizați un cârlig: Pentru a adăuga cod și a edita antetul, puteți adăuga următoarele în fișierul functions.php al temei copil.

 function QL_your_function() {
 ecou „codul tău”;
 }
 add_action('wp_head', 'QL_your_function');

Rețineți că acesta este un exemplu de cod pentru a vă oferi o structură, va trebui să îl adaptați și să adăugați propriul cod la acesta.

Am încercat să editez antetul WordPress, dar nu a funcționat

Să presupunem că ați urmat fiecare pas din acest tutorial, dar codul nu a fost adăugat în antetul site-ului dvs. Mai întâi, asigurați-vă că ați editat fișierul corect și ați adăugat cod în secțiunea potrivită. Dacă ați făcut totul corect și tot nu funcționează, există o soluție simplă. Dacă utilizați un plugin de cache WordPress pe site-ul dvs. pentru a optimiza viteza și performanța, pur și simplu golirea memoriei cache va rezolva această problemă în majoritatea cazurilor.

Concluzie

Pentru a rezuma, acestea sunt modalități simple de a edita antetul oricărui site web WordPress. Pentru începători, vă recomandăm să utilizați pluginul Insert Headers and Footers deoarece este simplu de utilizat și gestionat.

Pe de altă parte, dacă nu intenționați să vă schimbați tema WordPress în curând, editarea fișierului header.php al temei este o alegere excelentă pentru dvs.

În cele din urmă, este important să rețineți că, dacă ați editat fișierul header.php al temei dvs. WordPress și ați schimbat tema, toate personalizările se vor pierde, deși le puteți și copia și lipi. Așadar, alege dintre opțiunile disponibile și află care este cea mai potrivită pentru tine.

Dacă, în afară de antet, doriți să personalizați și subsolul site-ului dvs., consultați ghidul nostru despre cum să editați subsolul în WordPress.

Totuși, aveți nevoie de ajutor? Simțiți-vă liber să comentați mai jos și vă vom ajuta cu orice aveți nevoie!