Cum să adăugați pesmet la site-ul dvs. WordPress
Publicat: 2018-12-19Termenul „pesmet” se referă la un instrument de navigare eficient pe site-ul web (așa cum ne-au învățat Hansel și Gretel) este menit să ajute la urmărirea pașilor înapoi la „pagina principală” (sau pagina de pornire) a unui site web. Acestea permit utilizatorilor să vadă modul în care pagina curentă se încadrează în întreaga structură a site-ului, oferind o pistă în linie de link-uri (sau etichete) care duce până la pagina principală.

Pagina produsului Home Depot cu pesmet
Pesmetul este de fapt mai important pentru site-ul dvs. WordPress decât ați putea crede. Nu numai că îmbunătățesc experiența utilizatorului, dar pot, de asemenea, să ofere site-ului dvs. o lovitură în clasamentul căutărilor. Lui Google îi place acest element structural într-un site web, iar vizitatorii vor avea un ajutor crucial pentru navigare atunci când vor da peste una din paginile dvs. în mod organic (reducând rata de respingere).
Ați crede că adăugarea unui astfel de sistem integrat de nativare pe site-ul dvs. web ar fi dificilă, dar de fapt este destul de simplă cu utilizarea unui plugin. De fapt, dacă utilizați pluginul Yoast SEO, aveți un început, deoarece funcționalitatea pesmetului este deja încorporată în Yoast! Și, adăugarea pesmetului prin Yoast este cu siguranță una dintre metodele preferate de acolo. În afară de Yoast SEO, pluginul Breadcrumb NavXT este o altă opțiune excelentă, care este foarte personalizabilă și funcționează bine cu propria noastră temă Divi.
Abonați-vă la canalul nostru Youtube
Cum să adăugați pesmet pe site-ul dvs. WordPress utilizând Yoast
Pentru a adăuga pesmet la site-ul dvs. WordPress utilizând Yoast SEO, va trebui să abordați trei pași simpli:
- Instalați și activați pluginul Yoast SEO
- Adăugarea fragmentului de cod Breadcrumbs în tema dvs. WordPress
- Activați / configurați pesmetul Yoast Breadcrumbs în setările pluginului
Instalați și activați pluginul Yoast SEO
Pentru a instala pluginul Yoast SEO, accesați tabloul de bord WordPress și navigați la Pluginuri> Adăugare nouă. Apoi căutați depozitul WordPress pentru „yoast”. Când vedeți pluginul Yoast SEO, faceți clic pentru a instala și activa pluginul.

Adăugați fragmentul de cod Breadcrumbs în tema dvs. pentru copii WordPress
În continuare, trebuie să adăugăm un scurt fragment de cod în fișierele tematice WordPress. Deci, dacă nu ați făcut-o deja, este o idee bună să creați o temă pentru copii. Pentru acest exemplu, vă voi arăta cum să adăugați fragmentul de cod pesmet la o temă implicită WordPress TwentyNineteen WordPress. Puteți adăuga codul la orice fișier tematic / șablon, dar, în cea mai mare parte, veți dori să îl adăugați la fișierul dvs. single.php (pentru a apărea în toate postările), la fișierul page.php (pentru a apărea pe toate paginile ) sau în fișierul header.php (pentru a apărea la nivel de site).
Pentru acest exemplu, voi adăuga codul pesmet în fișierul header.php al temei copilului meu. După ce copiați peste fișierul header.php din tema părinte, deschideți pentru a edita fișierul într-un editor de cod la alegere.
Apoi, chiar în partea de jos a fișierului header.php, adăugați următorul fragment php furnizat de Yoast pentru a activa funcționalitatea Breadcrumbs:
<?php
if ( function_exists('yoast_breadcrumb') ) {
yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );
}
?>

Aceasta va afișa pesmetul direct sub antetul tuturor paginilor, o destinație obișnuită pentru pesmetul.
Activați și configurați pesmetul Yoast în setările pluginului
După ce fragmentul de cod a fost adăugat la tema dvs. WordPress Child, nu mai rămâneți decât să activați pesmetul din setările pluginului Yoast SEO. Pentru a face acest lucru, accesați tabloul de bord WordPress și navigați la SEO> Aspect de căutare și apoi faceți clic pe fila Pâine. În setările pentru pesmet, asigurați-vă că activați pesmetul prin comutarea opțiunii la „activat”. Apoi puteți configura setările pentru pesmet în funcție de nevoile dvs. Poate doriți să alegeți o taxonomie pe care să o afișați în pesmet pentru postarea dvs. Pentru acest exemplu, voi seta postările mele să afișeze categorii în pesmet.

Acum să mergem mai departe și să vedem cum arată pesmetul pe una dintre postările pe care le-am creat în tema TwentyNineteen.
Iată cum arată postarea înainte de a activa pesmetul.

Iată cum arată postarea după activarea pesmetului. Acest exemplu special de postare are o categorie („WordPress”) și o categorie părinte („Web Design”) pentru a vă arăta categoria de taxonomie a pesmetului pe care l-am ales în setările de pesmet.


Este posibil să trebuiască să ajustați stilul pesmetului dvs. utilizând unele CSS externe. Pentru a face acest lucru, puteți utiliza ID-ul CSS „pesmet” care a fost inclus în codul php. Deschideți fișierul style.css al Temei dvs. pentru copii (sau îl puteți adăuga în Customizerul temei în CSS suplimentar) și adăugați următoarele:
#breadcrumbs {
/*Add breadcrumb styling here*/
}
Pentru tema TwentyNineteen, este posibil să doresc să potrivesc marja textului antetului meu adăugând următoarele CSS personalizate:
#breadcrumbs {
margin: 0 calc(10% + 60px);
}

Dacă doriți un control mai mare asupra locației specifice a pesmetului, puteți utiliza următorul cod scurt pentru postări sau pagini individuale.
[wpseo_breadcrumb]
Adăugarea de pesmet pe site-ul dvs. WordPress folosind NavXT de pesmet
Dacă nu doriți să instalați Yoast SEO dintr-un anumit motiv sau dacă căutați o altă opțiune simplă, pluginul Breadcrumb NavXT este o alegere excelentă.
Pentru a instala pluginul, accesați tabloul de bord WordPress și navigați la Pluginuri> Adăugare nouă. Apoi, căutați în depozitul WordPress pentru „navxt pesmet”. După ce vedeți pluginul, faceți clic pentru instalare și activare.

Pentru a apela pesmetul astfel încât să se afișeze pe site-ul dvs. web, puteți utiliza widget-ul NavXT încorporat furnizat în pagina widgeturilor. Acest lucru vă va permite să trageți widgetul în diferitele zone widget furnizate de tema dvs. Pentru a face acest lucru, accesați tabloul de bord WordPress și navigați la Aspect> Widgeturi. Apoi trageți widgetul în zona widgetului sau alegerea dvs. și actualizați setările widgetului.

Pentru acest exemplu, folosesc tema Divi pentru a afișa pesmetul în partea de sus a barei mele laterale. Iată cum arată pe o postare.

Similar cu exemplul Yoast Breadcrumb, puteți apela, de asemenea, traseul pesmetului pe site-ul dvs. adăugând codul necesar temei copilului dvs. Iată codul pe care îl furnizează, care este conform schema.org breadcrumblist:
<div class="breadcrumbs" typeof="BreadcrumbList" vocab="https://schema.org/">
<?php
if(function_exists('bcn_display'))
{
bcn_display();
}?>
</div>
Deoarece folosesc tema Divi pentru acest exemplu, voi adăuga codul în fișierul Single.php al temei mele Divi Child chiar deasupra etichetei articolului. Aceasta va afișa pesmetul în partea de sus a tuturor postărilor mele.

Iată cum arată o postare după adăugarea codului.

Configurarea pesmetului folosind setările pluginului
Pluginul NavXT NavXT are câteva opțiuni puternice pentru configurarea pesmetului. Puteți personaliza întregul șablon de pesmet pentru diferite taxonomii și multe altele. Puteți obține acces la aceste setări din tabloul de bord WordPress navigând la Setări> NavXT NavXT.

Aranjarea pesmetului
Dacă doriți să aranjați pesmetul, puteți viza clasa numită „pesmet” care este inclusă în cod.
Pur și simplu adăugați următorul CSS în fișierul style.css al temei copilului dvs. sau în CSS suplimentar pentru personalizarea temei:
.breadcrumbs {
/*add css to style breadcrumbs here*/
}
Dacă doriți să utilizați widget-ul breadcrumb cu tema Divi, puteți utiliza, de asemenea, modulul din bara laterală Divi pentru a adăuga stil la breadcrumb în Divi Builder.
Gânduri finale
Pesmetul este o parte importantă a unui site web atât pentru utilizare cât și pentru SEO. Deci, dacă vă gândiți să adăugați pesmet pe site-ul dvs. WordPress, v-aș sugera să începeți cu metodele furnizate de pluginurile menționate în acest articol (Yoast SEO și Breadcrumb NavXT). Este cel mai logic să folosiți pesmetul Yoast dacă profitați deja de pluginul lor SEO, deoarece acesta este deja la dispoziția dvs. Cu toate acestea, Breadcrumb NavXT este și o opțiune foarte personalizabilă. Sigur, este posibil să trebuiască să vă accesați fișierele tematice, dar una peste alta, procesul este unul simplu. În orice caz, sper că acest lucru vă va ajuta să ușurați durerea de a obține pesmet pe propriul dvs. site WordPress.
Aștept cu nerăbdare să aud de la dvs. în comentarii.
Noroc!
