Cum să adăugați un cod de antet și de subsol în WordPress

Publicat: 2020-10-30

Personalizarea site-ului dvs. WordPress folosind cod poate fi înfricoșătoare. Adesea, va trebui să cercetați fișierele de bază pentru a modifica configurațiile sau pentru a adăuga noi parametri, care vă pot distruge site-ul dacă procedați greșit.

Cu toate acestea, adăugarea codului de antet și subsol tinde să fie mult mai simplă. Adesea, va trebui doar să copiați și să lipiți anumite fragmente de cod. Aceasta înseamnă că dacă știi cum să accesezi fișierele antet și subsol, ai trecut de partea cea mai înfricoșătoare.

În acest articol, vă vom învăța cum să adăugați cod de antet și subsol în WordPress atât manual, cât și cu un plugin. Ambele abordări sunt foarte simple, așa că să trecem direct la el!

De ce ar putea fi necesar să adăugați cod de antet și subsol în WordPress

Dacă rulați un site web, probabil că sunteți familiarizat cu cel puțin un serviciu terță parte care necesită să încorporați cod pentru a vă conecta la acesta.

Unele dintre cele mai populare exemple includ Google Analytics, Search Console, Facebook Pixel și multe alte instrumente care implică urmărirea site-ului web.

Toate aceste servicii necesită să adăugați scripturi specifice între etichetele head ale site-ului dvs. Antetul site-ului dvs. este o componentă crucială, inclusiv elemente precum scripturi, titluri, fișiere de stil și multe altele.

Un exemplu de fișier antet.

Etichetele de subsol funcționează în mod similar cu omologii lor de cap . Din punct de vedere tehnic, dacă adăugați fragmente de cod la subsolul site-ului dvs., acestea ar trebui să ruleze la fel ca și când le includeți în antet.

Cu toate acestea, este important să înțelegeți că site-ul dvs. web va executa scripturi în ordinea în care le includeți. În plus, codul antetului va fi   rulați înainte ca pagina să fie încărcată, în timp ce codul de subsol va rula după ea.

Dacă aveți opțiunea de a alege și vă pasă de optimizarea site-ului, mutarea JavaScript în subsolul site-ului dvs. poate ajuta la accelerarea timpilor de încărcare. Cu toate acestea, unele servicii vă vor cere în mod explicit să adăugați codul lor în antet pentru a evita orice probleme de execuție.

Ca regulă generală, dacă un serviciu vă solicită acest lucru, vă recomandăm să urmați sfaturile acestuia. Pentru alte fragmente de cod JavaScript, plasați-le în subsolul site-ului dvs. WordPress. Codul CSS intră întotdeauna în antet.

Cum să adăugați un cod de antet și de subsol în WordPress (2 metode)

Așa cum este adesea cazul cu WordPress, puteți atinge același obiectiv fie modificând fișierele manual, fie folosind un plugin.

Să începem prin a vorbi despre abordarea pluginului.

1. Folosiți un plugin cum ar fi Head, Footer și Post Injections

Utilizarea unui plugin pentru a adăuga cod la fișierele de antet și subsol din WordPress este cea mai sigură abordare. Cu un plugin, nu trebuie să modificați manual fișierele teme sau să vă asigurați că adăugați scripturi în locul potrivit.

Deși există multe pluginuri bune din care să alegeți, recomandarea noastră pentru job este pluginul Head, Footer și Post Injections.

Pluginul Head, Footer and Post Injections

Acest plugin vă oferă mult control asupra locului în care doriți să adăugați fragmentele de cod. De asemenea, oferă opțiunea de a adăuga diferite scripturi pentru redările pe dispozitive mobile și desktop ale site-ului dvs.

Pentru a adăuga pluginul, accesați Plugin-uri > Adăugați nou în tabloul de bord și utilizați funcția de căutare pentru a găsi pluginul. Faceți clic pe instalare, apoi activați pluginul.

Odată ce pluginul este activ, puteți sări direct la Setări > Antet și subsol . Veți vedea mai multe câmpuri în care puteți adăuga fragmente de cod.

Verificați opțiunile de plasare a codului de antet ale pluginului

Dacă cercetați opțiunile pluginului, veți vedea că acesta oferă o mulțime de destinații de plasare suplimentare pentru fragmentele dvs. de cod. Cu toate acestea, în majoritatea cazurilor, puteți rămâne la fila Cap și subsol .

Pentru codul global, asigurați-vă că plasați acele fragmente în câmpul Pe fiecare pagină . Cu toate acestea, dacă aveți nevoie doar de codul pentru a rula pe pagina dvs. de pornire, utilizați opțiunea Numai pe pagina de pornire .

După ce ați terminat de adăugat codul pe site-ul dvs. web, salvați modificările la plugin și sunteți gata!

2. Adăugați fragmente de cod prin fișierul functions.php

Adăugarea manuală a codului antetului și subsolului în WordPress nu este complicată, dar necesită mai multe considerații decât abordarea pluginului.

Puteți adăuga codul direct în fișierele header.php sau footer.php ale temei active. Puteți găsi aceste fișiere în directorul /public_html/wp-content/themes/ deschizând folderul temei active și uitându-vă în interior:

Accesarea fișierelor de antet și subsol prin FTP

Puteți accesa aceste fișiere prin Protocolul de transfer de fișiere (FTP) și le puteți edita folosind editorul de coduri preferat. Cu toate acestea, editarea directă a fișierelor antet și subsol poate fi dezordonată. Având în vedere acest lucru, avem două recomandări dacă intenționați să utilizați abordarea manuală:

  1. Creați o temă copil pentru tema dvs. În acest fel, nu veți pierde nicio personalizare atunci când actualizați tema părinte.
  2. Utilizați cârlige pentru a adăuga codul prin fișierul functions.php . Aceasta oferă o abordare mai curată față de editarea manuală a fișierelor antet și subsol.

În mod ideal, ar trebui să utilizați întotdeauna o temă copil dacă intenționați să faceți orice tip de personalizare a temei. Puteți accesa fișierul functions.php al temei copilului în folderul său din directorul /wp-content/themes .

Deschideți fișierul functions.php în editorul de cod. Pentru a adăuga codul dorit, trebuie să utilizați fie wp_head   sau wp_footer   cârlig.

Următorul fragment de cod adaugă codul personalizat la antetul site-ului dvs.:

 add_action('wp_head', 'test_script'); function test_script() { ?> <!-- Here comes your custom code in HTML format. --> <?php }

Puteți folosi cârligul wp_footer în loc de wp_head dacă doriți să plasați codul în subsol. De asemenea, puteți schimba numele funcției (test_script) dacă doriți.

Când ați terminat de ajustat fișierul functions.php , amintiți-vă să salvați modificările și asta este tot. Orice cod ai adăugat ar trebui să funcționeze acum!

Concluzie

Multe servicii terțe, cum ar fi Google Analytics sau Facebook Pixel, vă solicită să adăugați fragmente de cod pe site-ul dvs. web, astfel încât aceștia să se poată conecta la acesta. Cu toate acestea, acesta este doar unul dintre multele cazuri în care va trebui să adăugați cod la antetul și subsolul dvs. în WordPress, așa că merită să știți cum să faceți acest lucru.

Există două moduri în care puteți adăuga fragmente de cod în antet și subsol. Puteți fie să utilizați un plugin precum „Head, Footer and Post Injections”, fie să adăugați fragmente de cod prin fișierul functions.php .

Aveți întrebări despre cum să adăugați cod de antet și subsol în WordPress? Să vorbim despre ele în secțiunea de comentarii de mai jos!