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

Platforma WordPress face o treabă grozavă pentru a-i ajuta pe cei fără experiență de codare să implementeze aproape orice tip de funcționalitate. Cu toate acestea, în unele cazuri, va trebui să adăugați cod de antet și subsol în WordPress pentru a ajuta serviciile terțe să-și integreze propria funcționalitate.

Cel mai obișnuit caz de utilizare pentru aceasta este integrarea Google Analytics în site-ul dvs. Cu toate acestea, există o mulțime de alte motive pentru care veți dori să faceți acest lucru - este posibil să știți deja de ce doriți să îndepliniți această sarcină.

Pentru acest tutorial, vă vom arăta câteva modalități de a adăuga cod de antet și subsol în WordPress. În primul rând, însă, vom arunca o privire asupra soiurilor de motive pentru care ați dori să faceți acest lucru în primul rând.

Ce puteți obține cu un cod suplimentar în antetul și subsolul site-ului dvs

Un site web standard se va descompune în câteva componente diferite, la fel ca un document text:

• Antet. Antetul site-ului dvs. conține o serie de elemente de „preîncărcare” și detalii despre certificatul dvs. Secure Sockets Layer (SSL), criptare, orice JavaScript și multe altele.
• Subsol. Aceasta funcționează într-un mod similar cu antetul dvs., dar ajunge în partea de jos a paginii.
• Corp. Majoritatea funcționalității pe care le implementați pe site-ul dvs. vor fi în „corpul” conținutului dvs. Acesta este obiectivul principal al aproape tot ceea ce se află în tabloul de bord WordPress, iar corpul reprezintă ceea ce vedeți pe pagină.

Serverele vor încărca paginile într-un mod liniar – capul, corpul, apoi subsolul. Aceasta înseamnă că codul din antet se va încărca primul, dar codul de subsol se va încărca după orice altceva.

Cazuri de utilizare zilnice a fragmentelor de cod

Rețelele de socializare și instrumentele de optimizare pentru motoarele de căutare (SEO) vor avea nevoie adesea să adăugați cod de antet în WordPress. Acest lucru se datorează faptului că acele servicii trebuie să aibă o anumită prioritate atunci când un site se încarcă pentru a înregistra tot ce urmează după el.

Este o situație similară cu codul CSS, deoarece acesta dictează cum va arăta site-ul dvs. Dacă acesta ar fi în subsol, ați vedea o serie de modificări de aspect înainte de a vedea stilul.

Deși JavaScript ne ajută să producem, să vedem și să interacționăm cu site-uri web moderne, nu este o componentă necesară (în sens tehnic). Ca atare, JavaScript din subsol vă va oferi performanțe mai mari în multe cazuri, iar dacă aveți asta opțiune, ar trebui să mergi cu ea.

De fapt, există mult mai multe cazuri de utilizare și le acoperim mai detaliat într-un alt articol de pe blogul WPKube. Cu toate acestea, într-o situație tipică WordPress, nu aveți acces la elementele antet și subsol ale site-ului dvs. Pentru a face acest lucru, va trebui fie să vă murdărești mâinile, fie să apelați la ajutor extern.

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

În restul articolului, vom acoperi două moduri de a adăuga cod de antet și subsol în WordPress. Ambele sunt simple, dar o preferăm una peste alta:

1. Puteți folosi un plugin pentru a vă ajuta să adăugați codul în zonele potrivite ale site-ului dvs.
2. Puteți adăuga cod la fișierul functions.php și va trebui să aveți cunoștințe suplimentare despre cum să accesați fișierele site-ului dvs.

Ne vom uita mai întâi la opțiunea de plugin, din motive pe care le vom explica în scurt timp.

1. Utilizați un plugin pentru a adăuga cod la antet și subsol

Dacă doriți să implementați ceva în WordPress, un plugin ar trebui să facă treaba pentru dvs. Am considera un plugin implicit în cele mai multe cazuri pentru site-urile WordPress. Ca atare, dacă doriți să adăugați cod de antet și subsol în WordPress, pluginul Embed Code va fi ideal:

Aceasta este o soluție pe care o dezvoltă site-ul nostru parte DesignBombs și vă oferă o modalitate rapidă și nedureroasă de a adăuga cod fie pe site-ul dvs. în ansamblu, fie pagini sau postări specifice și chiar tipuri de postări personalizate.

Pentru a-l folosi, veți instala și activa pluginul în modul tipic WordPress. Când acest proces se termină, veți vedea o nouă opțiune Setări > Cod încorporat pe tabloul de bord:

Pe acest ecran, veți observa două zone de text: una pentru cap și una pentru subsol. Veți primi chiar și un indiciu despre unde va fi codul pe care îl introduceți în HTML:

Utilizarea acestui instrument este foarte simplă. După ce ați introdus codul, salvați modificările. Acest lucru va adăuga orice cod aici la nivel global (adică la nivel de site). Cu toate acestea, este posibil să doriți doar să adăugați cod la o postare sau o pagină individuală. Puteți face acest lucru prin Editorul de blocuri – metaboxul și opțiunile de care aveți nevoie sunt în partea de jos a ecranului:

În timp ce Codul încorporat este metoda noastră preferată și una pe care ar trebui să o utilizați pentru un minim de agitație, există și o altă modalitate prin care vă puteți obține rezultatele de care aveți nevoie. O să ne uităm la acesta în continuare.

2. Adăugați fragmente de cod în fișierul dvs. functions.php

Fiecare instalare WordPress poate accesa un fișier functions.php dedicat în directorul său de nivel superior sau specific temei. Acest lucru vă permite să adăugați fragmente de cod pentru a ajuta WordPress să folosească mai multe funcționalități. Cu toate acestea, există câteva condiții preliminare pe care va trebui să le înțelegeți și să le aveți în aplicare înainte de a începe:

• Accesați fișierele de bază WordPress – și, prin extensie, fișierul functions.php – folosind Secure File Transfer Protocol (SFTP). Ca atare, veți avea nevoie de cunoștințe despre cum funcționează acest lucru pentru a găsi fișierele site-urilor dvs. și a lucra cu ele.
• De asemenea, vă recomandăm să utilizați o temă secundară, pentru a vă păstra modificările dacă tema în cauză primește o actualizare.
• Veți dori cel puțin cunoștințe de lucru despre cârlige, acțiuni și filtre WordPress. În plus, veți dori să înțelegeți cum vă accesează WordPress antetul și subsolul prin aceste cârlige.

Când vine vorba de utilizarea SFTP, WPKube are o selecție de articole pe care le puteți considera lectură esențială:

• Un ghid pentru începători pentru protocolul securizat de transfer de fișiere (SFTP)
• Cum să utilizați FileZilla: un ghid pas cu pas
• Un ghid pentru începători pentru permisiunile fișierelor WordPress

De asemenea, poate doriți să vă uitați la biblioteca de hook pentru dezvoltatori WordPress, în special acele intrări pentru wp_head și wp_footer , deși acest lucru este opțional, deoarece nu le veți folosi într-un mod greu.

De aici, procesul durează câțiva pași. Mai întâi, deschideți serverul site-ului dvs. în clientul SFTP, apoi navigați la wp-content/themes . Aici, deschideți directorul temei dvs. curente și căutați fișierul functions.php relevant:

Veți dori să deschideți acest fișier în editorul de text sau cod preferat. În cadrul, puteți plasa următorul șablon de fragment:

 add_action( 'wp_head', '<SNIPPET_NAME>' ); function <SNIPPET_NAME>() { ?> <!-- Place your HTML code or other script here. --> <?php }

Pe scurt, acest lucru adaugă un cârlig de acțiune la WordPress folosind orice îl numiți ca <SNIPPET_NAME> . În cadrul funcției în sine, vei înlocui sau tastați sub linia de comentariu (adică linia care începe cu <!-- .) Dacă doriți să adăugați cod la subsol, veți înlocui 'wp_head' cu 'wp_footer' si continua ca de obicei.

După ce salvați modificările, acest lucru ar trebui să se aplice site-ului dvs. În funcție de codul pe care îl adăugați, ar trebui să existe ceva vizibil pe pagina principală, în tabloul de bord WordPress sau chiar într-un tablou de bord terță parte.

Încheierea

Deși WordPress nu are nevoie de cunoștințe tipice de codificare pentru a le utiliza la maximum, în unele cazuri este posibil să fie nevoie să adăugați cod de antet și subsol în WordPress. De exemplu, este posibil să doriți să utilizați analize, care este un motiv popular pentru a deschide fișierele site-ului dvs.

Această postare a analizat două moduri diferite de a adăuga cod la antet și subsol:

• Un plugin precum Codul de încorporare vă va permite să adăugați cod de antet și subsol la WordPress folosind tabloul de bord. Ca atare, va trebui pur și simplu să copiați și să lipiți, fără să vă faceți griji că vă accesați serverul.
• Cu toate acestea, dacă aveți cunoștințele, puteți căuta să adăugați un fragment la fișierul functions.php . Veți avea nevoie de cunoștințe SFTP și puțină experiență cu fișierele dvs. WordPress, dar această abordare este la fel de bună ca și opțiunea de plugin.

Cu ce ​​metodă veți folosi pentru a adăuga cod de antet și subsol în WordPress? Anunțați-ne în secțiunea de comentarii de mai jos!